Next.js starter (cnsqnt v2) with Typescript & Tailwind.css (feat. next-themes
for dark mode).
- Cleaned up tailwind config
- Removed Radix Colors plugin + usages
- Cleaned up eslint
- Enabled tailwindcss eslint plugin
- Fixed eslint issues
react-hooks
warning is working for exhaustive depstailwindcss
warning is workingtypescript-eslint
is working
-
postcss-import
needed or safe to remove? - Store site meta (title, etc) in json file.
- USE LINEAR OR GITHUB ISSUES!
- Fix darkmode/lightmode colours
-
bg-opacity-x
utils don't work with custom radix colors-
That said, using radix colors plugins means we automatically get theming w/ light / dark - UPDATE: NOT USING ANYMORE
-
-
custom radix colors don't get inline color previews in VSCode- UPDATE: NOT USING ANYMORE
- Add docs
- Features
- TS
- ESLint
- Themes
-
getLayout
- Set up
- Usage
- Features
- Add
react-error-boundary
- Update
index
- Add docs route
- Add favicon, opengraph metadata, etc.
- Remove
providers
component -
AddHusky
-
Add package -
Add pre-commit -
Add post-merge - UPDATE: I don't really like husky atm.
-
- Add
zustand
- Add package
- Remove custom
context
implementation currently being used
- Cleanup
eslint
config -
Figure out color preview for radix-colors - Fix paths in
tsconfig.json
- Just use relative imports?
-
Usedata/site.config.json
inHeader
- Removed altogether
- Cleanup
tailwind.config.js
-
Remove prose customizations- Eh, I like the prose customizations.
- Though if I use radix-colors plugin, it automatically changes color variant between light/dark
- Remove homemade radix plugin
-
- use only
Inter
as custom font- Remove
Recursive
- Remove
Space Mono
- Remove
Space Grotesk
- Cleanup
tailwind
config
- Remove
- Figure out which
postcss
plugins are actually needed - Remove unneeded
postcss
plugins - Remove
@babel/core
- Remove
tailwind-typography
- Remove plugin
- Remove customization in
tailwind.config.js
- Really shouldn't be customizing styling in tailwind config, it would be easier just to do it from scratch
- https://sergiodxa.com/articles/use-tailwindcss-typography-with-dark-mode-styles
- Reference custom fontFamily:
- https://paulintrognon.fr/blog/post/typescript-prettier-eslint-next-js
- https://www.npmjs.com/package/eslint-config-nextjs
- https://github.com/vercel/next.js/tree/canary/examples/with-typescript-eslint-jest
- See
src/styles/font.css
. - google/fonts#2386 (comment)
# pyftsubset has to be installed
pyftsubset Inter.ttf \
--unicodes="U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD" \
--layout-features="" \
--flavor="woff2" \
--output-file="Inter-subset.woff2"