From 2b6a2e1e324f788ccd1df4f8105dbb41dea27451 Mon Sep 17 00:00:00 2001 From: Glen Cheney Date: Wed, 6 Jul 2022 00:00:21 -0400 Subject: [PATCH] Change dark mode illustration logic --- CONTRIBUTING.md | 13 ++-- README.md | 78 ------------------- apps/website/package.json | 1 + .../src/components/HomepageFeatures.jsx | 10 +-- .../components/HomepageFeatures.module.css | 9 +++ apps/website/src/pages/index.jsx | 4 +- 6 files changed, 20 insertions(+), 95 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 45ac416..3771a0e 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -12,9 +12,10 @@ Without a reduced test case, your issue may be closed. ## Releasing a new version -- Update `changelog.html`. +- Update `changelog.md`. - Run tests. - Commit changes. +- `cd packages/shuffle` - `npm version major|minor|patch`. - `npm publish` - `git push && git push --tags` @@ -22,9 +23,7 @@ Without a reduced test case, your issue may be closed. ## Running locally -This project uses [Jekyll](https://jekyllrb.com/). - -- Head over to [their quickstart guide](https://jekyllrb.com/docs/quickstart/) to setup jekyll. -- Install npm dependencies `npm install`. -- Run `npm run watch` to rebuild, start the jekyll server, and watch for changes. -- go to `http://localhost:4000` to see it. +- Clone the project. +- Install dependencies with `yarn`. +- Run `yarn watch` to rebuild, start the server, and watch for changes. +- go to `http://localhost:3000/Shuffle/` to see it. diff --git a/README.md b/README.md index f482589..52cdf25 100644 --- a/README.md +++ b/README.md @@ -31,81 +31,3 @@ This project was inspired by [Isotope](http://isotope.metafizzy.co/) and [Packer [npm-img]: https://img.shields.io/npm/v/shufflejs.svg [dependabot-url]: https://docs.github.com/en/code-security/supply-chain-security/managing-vulnerabilities-in-your-projects-dependencies/configuring-dependabot-security-updates [dependabot-img]: https://img.shields.io/badge/Dependabot-enabled-blue.svg - -# Turborepo starter - -This is an official Yarn v1 starter turborepo. - -## What's inside? - -This turborepo uses [Yarn](https://classic.yarnpkg.com/lang/en/) as a package manager. It includes the following packages/apps: - -### Apps and Packages - -- `docs`: a [Next.js](https://nextjs.org) app -- `web`: another [Next.js](https://nextjs.org) app -- `ui`: a stub React component library shared by both `web` and `docs` applications -- `config`: `eslint` configurations (includes `eslint-config-next` and `eslint-config-prettier`) -- `tsconfig`: `tsconfig.json`s used throughout the monorepo - -Each package/app is 100% [TypeScript](https://www.typescriptlang.org/). - -### Utilities - -This turborepo has some additional tools already setup for you: - -- [TypeScript](https://www.typescriptlang.org/) for static type checking -- [ESLint](https://eslint.org/) for code linting -- [Prettier](https://prettier.io) for code formatting - -## Setup - -This repository is used in the `npx create-turbo` command, and selected when choosing which package manager you wish to use with your monorepo (Yarn). - -### Build - -To build all apps and packages, run the following command: - -``` -cd my-turborepo -yarn run build -``` - -### Develop - -To develop all apps and packages, run the following command: - -``` -cd my-turborepo -yarn run dev -``` - -### Remote Caching - -Turborepo can use a technique known as [Remote Caching (Beta)](https://turborepo.org/docs/features/remote-caching) to share cache artifacts across machines, enabling you to share build caches with your team and CI/CD pipelines. - -By default, Turborepo will cache locally. To enable Remote Caching (Beta) you will need an account with Vercel. If you don't have an account you can [create one](https://vercel.com/signup), then enter the following commands: - -``` -cd my-turborepo -npx turbo login -``` - -This will authenticate the Turborepo CLI with your [Vercel account](https://vercel.com/docs/concepts/personal-accounts/overview). - -Next, you can link your Turborepo to your Remote Cache by running the following command from the root of your turborepo: - -``` -npx turbo link -``` - -## Useful Links - -Learn more about the power of Turborepo: - -- [Pipelines](https://turborepo.org/docs/features/pipelines) -- [Caching](https://turborepo.org/docs/features/caching) -- [Remote Caching (Beta)](https://turborepo.org/docs/features/remote-caching) -- [Scoped Tasks](https://turborepo.org/docs/features/scopes) -- [Configuration Options](https://turborepo.org/docs/reference/configuration) -- [CLI Usage](https://turborepo.org/docs/reference/command-line-reference) diff --git a/apps/website/package.json b/apps/website/package.json index 8a35f06..11fcfda 100644 --- a/apps/website/package.json +++ b/apps/website/package.json @@ -5,6 +5,7 @@ "scripts": { "docusaurus": "docusaurus", "start": "docusaurus start", + "watch": "docusaurus start", "build": "docusaurus build", "swizzle": "docusaurus swizzle", "deploy": "docusaurus deploy", diff --git a/apps/website/src/components/HomepageFeatures.jsx b/apps/website/src/components/HomepageFeatures.jsx index 3ee54cd..616ce81 100644 --- a/apps/website/src/components/HomepageFeatures.jsx +++ b/apps/website/src/components/HomepageFeatures.jsx @@ -1,7 +1,5 @@ import React from 'react'; import clsx from 'clsx'; -// eslint-disable-next-line import/no-extraneous-dependencies -import { useColorMode } from '@docusaurus/theme-common'; import styles from './HomepageFeatures.module.css'; import responsiveSvg from '../../static/img/undraw-responsive-design.svg'; @@ -37,15 +35,11 @@ const features = [ ]; function Feature({ Svg, SvgDark, title, description }) { - const { colorMode } = useColorMode(); return (
- {colorMode === 'dark' ? ( - - ) : ( - - )} + +

{title}

diff --git a/apps/website/src/components/HomepageFeatures.module.css b/apps/website/src/components/HomepageFeatures.module.css index ba0ab5c..efdcfae 100644 --- a/apps/website/src/components/HomepageFeatures.module.css +++ b/apps/website/src/components/HomepageFeatures.module.css @@ -8,3 +8,12 @@ height: 200px; width: 200px; } + +.featureSvgDark, +[data-theme="dark"] .featureSvgLight { + display: none; +} + +[data-theme="dark"] .featureSvgDark { + display: inline-block; +} diff --git a/apps/website/src/pages/index.jsx b/apps/website/src/pages/index.jsx index 31a8ac9..72d5845 100644 --- a/apps/website/src/pages/index.jsx +++ b/apps/website/src/pages/index.jsx @@ -102,7 +102,7 @@ function HomepageHeader() {

{siteConfig.title}

{siteConfig.tagline}

- + Get started with Shuffle
@@ -114,7 +114,7 @@ function HomepageHeader() { export default function Home() { const { siteConfig } = useDocusaurusContext(); return ( - +