From a1ca9f3dfa9c38b248f3f9e34e947c81a4fb62f4 Mon Sep 17 00:00:00 2001 From: Fergal Moran Date: Sun, 28 May 2023 17:51:46 +0100 Subject: [PATCH] Theme working --- package.json | 1 + pnpm-lock.yaml | 190 +++++++++++++++++++----- src/app/Providers.tsx | 6 +- src/app/layout.tsx | 40 +++-- src/components/theme-provider.tsx | 9 ++ src/components/widgets/mode-toggle.tsx | 43 ------ src/components/widgets/theme-toggle.tsx | 23 +++ src/config/fonts.ts | 14 ++ src/config/site.ts | 17 +++ src/lib/components/layout/Navbar.tsx | 5 +- src/styles/globals.css | 18 +-- tailwind.config.ts | 9 +- 12 files changed, 263 insertions(+), 112 deletions(-) create mode 100644 src/components/theme-provider.tsx delete mode 100644 src/components/widgets/mode-toggle.tsx create mode 100644 src/components/widgets/theme-toggle.tsx create mode 100644 src/config/fonts.ts create mode 100644 src/config/site.ts diff --git a/package.json b/package.json index f54bd32..f682f4c 100644 --- a/package.json +++ b/package.json @@ -40,6 +40,7 @@ }, "devDependencies": { "@faker-js/faker": "^8.0.0", + "@ianvs/prettier-plugin-sort-imports": "^4.0.0", "@radix-ui/react-avatar": "^1.0.3", "@radix-ui/react-dropdown-menu": "^2.0.5", "@radix-ui/react-slot": "^1.0.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 282aa04..d49a23b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -42,7 +42,7 @@ dependencies: version: 0.13.0 next: specifier: 13.4.2 - version: 13.4.2(react-dom@18.2.0)(react@18.2.0) + version: 13.4.2(@babel/core@7.22.1)(react-dom@18.2.0)(react@18.2.0) next-auth: specifier: ^4.22.1 version: 4.22.1(next@13.4.2)(react-dom@18.2.0)(react@18.2.0) @@ -78,6 +78,9 @@ devDependencies: '@faker-js/faker': specifier: ^8.0.0 version: 8.0.0 + '@ianvs/prettier-plugin-sort-imports': + specifier: ^4.0.0 + version: 4.0.0(prettier@2.8.8) '@radix-ui/react-avatar': specifier: ^1.0.3 version: 1.0.3(@types/react-dom@18.2.4)(@types/react@18.2.6)(react-dom@18.2.0)(react@18.2.0) @@ -155,7 +158,7 @@ devDependencies: version: 2.8.8 prettier-plugin-tailwindcss: specifier: ^0.2.8 - version: 0.2.8(prettier@2.8.8) + version: 0.2.8(@ianvs/prettier-plugin-sort-imports@4.0.0)(prettier@2.8.8) prisma: specifier: ^4.14.1 version: 4.14.1 @@ -200,12 +203,44 @@ packages: engines: {node: '>=10'} dev: true + /@ampproject/remapping@2.2.1: + resolution: {integrity: sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==} + engines: {node: '>=6.0.0'} + dependencies: + '@jridgewell/gen-mapping': 0.3.3 + '@jridgewell/trace-mapping': 0.3.18 + /@babel/code-frame@7.21.4: resolution: {integrity: sha512-LYvhNKfwWSPpocw8GI7gpK2nq3HSDuEPC/uSYaALSJu9xjsalaaYFOq0Pwt5KmVqwEbZlDu81aLXwBOmD/Fv9g==} engines: {node: '>=6.9.0'} dependencies: '@babel/highlight': 7.18.6 - dev: false + + /@babel/compat-data@7.22.3: + resolution: {integrity: sha512-aNtko9OPOwVESUFp3MZfD8Uzxl7JzSeJpd7npIoxCasU37PFbAQRpKglkaKwlHOyeJdrREpo8TW8ldrkYWwvIQ==} + engines: {node: '>=6.9.0'} + + /@babel/core@7.22.1: + resolution: {integrity: sha512-Hkqu7J4ynysSXxmAahpN1jjRwVJ+NdpraFLIWflgjpVob3KNyK3/tIUc7Q7szed8WMp0JNa7Qtd1E9Oo22F9gA==} + engines: {node: '>=6.9.0'} + dependencies: + '@ampproject/remapping': 2.2.1 + '@babel/code-frame': 7.21.4 + '@babel/generator': 7.22.0 + '@babel/helper-compilation-targets': 7.22.1(@babel/core@7.22.1) + '@babel/helper-module-transforms': 7.22.1 + '@babel/helpers': 7.22.3 + '@babel/parser': 7.22.0 + '@babel/template': 7.21.9 + '@babel/traverse': 7.22.1 + '@babel/types': 7.22.0 + convert-source-map: 1.9.0 + debug: 4.3.4 + gensync: 1.0.0-beta.2 + json5: 2.2.3 + semver: 6.3.0 + transitivePeerDependencies: + - supports-color /@babel/generator@7.22.0: resolution: {integrity: sha512-tyzR0OsH88AelgukhL2rbEUCLKBGmy2G9Th/5vpyOt0zf44Be61kvIQXjCwTSX8t+qJ/vMwZfhK6mPdrMLZXRg==} @@ -215,44 +250,91 @@ packages: '@jridgewell/gen-mapping': 0.3.3 '@jridgewell/trace-mapping': 0.3.18 jsesc: 2.5.2 - dev: false + + /@babel/helper-compilation-targets@7.22.1(@babel/core@7.22.1): + resolution: {integrity: sha512-Rqx13UM3yVB5q0D/KwQ8+SPfX/+Rnsy1Lw1k/UwOC4KC6qrzIQoY3lYnBu5EHKBlEHHcj0M0W8ltPSkD8rqfsQ==} + engines: {node: '>=6.9.0'} + peerDependencies: + '@babel/core': ^7.0.0 + dependencies: + '@babel/compat-data': 7.22.3 + '@babel/core': 7.22.1 + '@babel/helper-validator-option': 7.21.0 + browserslist: 4.21.5 + lru-cache: 5.1.1 + semver: 6.3.0 /@babel/helper-environment-visitor@7.22.1: resolution: {integrity: sha512-Z2tgopurB/kTbidvzeBrc2To3PUP/9i5MUe+fU6QJCQDyPwSH2oRapkLw3KGECDYSjhQZCNxEvNvZlLw8JjGwA==} engines: {node: '>=6.9.0'} - dev: false /@babel/helper-function-name@7.21.0: resolution: {integrity: sha512-HfK1aMRanKHpxemaY2gqBmL04iAPOPRj7DxtNbiDOrJK+gdwkiNRVpCpUJYbUT+aZyemKN8brqTOxzCaG6ExRg==} engines: {node: '>=6.9.0'} dependencies: '@babel/template': 7.21.9 - '@babel/types': 7.22.0 - dev: false + '@babel/types': 7.22.3 /@babel/helper-hoist-variables@7.18.6: resolution: {integrity: sha512-UlJQPkFqFULIcyW5sbzgbkxn2FKRgwWiRexcuaR8RNJRy8+LLveqPjwZV/bwrLZCN0eUHD/x8D0heK1ozuoo6Q==} engines: {node: '>=6.9.0'} dependencies: + '@babel/types': 7.22.3 + + /@babel/helper-module-imports@7.21.4: + resolution: {integrity: sha512-orajc5T2PsRYUN3ZryCEFeMDYwyw09c/pZeaQEZPH0MpKzSvn3e0uXsDBu3k03VI+9DBiRo+l22BfKTpKwa/Wg==} + engines: {node: '>=6.9.0'} + dependencies: + '@babel/types': 7.22.3 + + /@babel/helper-module-transforms@7.22.1: + resolution: {integrity: sha512-dxAe9E7ySDGbQdCVOY/4+UcD8M9ZFqZcZhSPsPacvCG4M+9lwtDDQfI2EoaSvmf7W/8yCBkGU0m7Pvt1ru3UZw==} + engines: {node: '>=6.9.0'} + dependencies: + '@babel/helper-environment-visitor': 7.22.1 + '@babel/helper-module-imports': 7.21.4 + '@babel/helper-simple-access': 7.21.5 + '@babel/helper-split-export-declaration': 7.18.6 + '@babel/helper-validator-identifier': 7.19.1 + '@babel/template': 7.21.9 + '@babel/traverse': 7.22.1 '@babel/types': 7.22.0 - dev: false + transitivePeerDependencies: + - supports-color + + /@babel/helper-simple-access@7.21.5: + resolution: {integrity: sha512-ENPDAMC1wAjR0uaCUwliBdiSl1KBJAVnMTzXqi64c2MG8MPR6ii4qf7bSXDqSFbr4W6W028/rf5ivoHop5/mkg==} + engines: {node: '>=6.9.0'} + dependencies: + '@babel/types': 7.22.3 /@babel/helper-split-export-declaration@7.18.6: resolution: {integrity: sha512-bde1etTx6ZyTmobl9LLMMQsaizFVZrquTEHOqKeQESMKo4PlObf+8+JA25ZsIpZhT/WEd39+vOdLXAFG/nELpA==} engines: {node: '>=6.9.0'} dependencies: - '@babel/types': 7.22.0 - dev: false + '@babel/types': 7.22.3 /@babel/helper-string-parser@7.21.5: resolution: {integrity: sha512-5pTUx3hAJaZIdW99sJ6ZUUgWq/Y+Hja7TowEnLNMm1VivRgZQL3vpBY3qUACVsvw+yQU6+YgfBVmcbLaZtrA1w==} engines: {node: '>=6.9.0'} - dev: false /@babel/helper-validator-identifier@7.19.1: resolution: {integrity: sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==} engines: {node: '>=6.9.0'} - dev: false + + /@babel/helper-validator-option@7.21.0: + resolution: {integrity: sha512-rmL/B8/f0mKS2baE9ZpyTcTavvEuWhTTW8amjzXNvYG4AwBsqTLikfXsEofsJEfKHf+HQVQbFOHy6o+4cnC/fQ==} + engines: {node: '>=6.9.0'} + + /@babel/helpers@7.22.3: + resolution: {integrity: sha512-jBJ7jWblbgr7r6wYZHMdIqKc73ycaTcCaWRq4/2LpuPHcx7xMlZvpGQkOYc9HeSjn6rcx15CPlgVcBtZ4WZJ2w==} + engines: {node: '>=6.9.0'} + dependencies: + '@babel/template': 7.21.9 + '@babel/traverse': 7.22.1 + '@babel/types': 7.22.3 + transitivePeerDependencies: + - supports-color /@babel/highlight@7.18.6: resolution: {integrity: sha512-u7stbOuYjaPezCuLj29hNW1v64M2Md2qupEKP1fHc7WdOA3DgLh37suiSrZYY7haUB7iBeQZ9P1uiRF359do3g==} @@ -261,7 +343,6 @@ packages: '@babel/helper-validator-identifier': 7.19.1 chalk: 2.4.2 js-tokens: 4.0.0 - dev: false /@babel/parser@7.22.0: resolution: {integrity: sha512-DA65VCJRetcFmJnt9/hEmRvXNCwk0V86dxG6p6N13hzDazaLRjGdTGPGgjxZOtLuFgWzOSRX4grybmRXwQ9bSg==} @@ -269,7 +350,6 @@ packages: hasBin: true dependencies: '@babel/types': 7.22.0 - dev: false /@babel/runtime@7.22.0: resolution: {integrity: sha512-TT6NB0oszYQ4oxLNUdG+FNHIc3MohXVCKA2BeyQ4WeM2VCSC6wBZ6P0Yfkdzxv+87D8Xk0LJyHeCKlWMvpZt0g==} @@ -284,7 +364,6 @@ packages: '@babel/code-frame': 7.21.4 '@babel/parser': 7.22.0 '@babel/types': 7.22.0 - dev: false /@babel/traverse@7.22.1: resolution: {integrity: sha512-lAWkdCoUFnmwLBhIRLciFntGYsIIoC6vIbN8zrLPqBnJmPu7Z6nzqnKd7FsxQUNAvZfVZ0x6KdNvNp8zWIOHSQ==} @@ -302,7 +381,6 @@ packages: globals: 11.12.0 transitivePeerDependencies: - supports-color - dev: false /@babel/types@7.22.0: resolution: {integrity: sha512-NtXlm3f6cNWIv003cETdlz9sss0VMNtplyatFohxWPz90AbwuhCbHbQopkGis6bG1vOunDLN0FF/4Uv5i8LFZQ==} @@ -311,7 +389,14 @@ packages: '@babel/helper-string-parser': 7.21.5 '@babel/helper-validator-identifier': 7.19.1 to-fast-properties: 2.0.0 - dev: false + + /@babel/types@7.22.3: + resolution: {integrity: sha512-P3na3xIQHTKY4L0YOG7pM8M8uoUIB910WQaSiiMCZUC2Cy8XFEQONGABFnHWBa2gpGKODTAJcNhi5Zk0sLRrzg==} + engines: {node: '>=6.9.0'} + dependencies: + '@babel/helper-string-parser': 7.21.5 + '@babel/helper-validator-identifier': 7.19.1 + to-fast-properties: 2.0.0 /@datadog/native-appsec@3.2.0: resolution: {integrity: sha512-biAa7EFfuavjSWgSQaCit9CqGzr6Af5nhzfNNGJ38Y/Y387hDvLivAR374kK1z6XoxGZEOa+XPbVogmV/2Bcjw==} @@ -560,6 +645,26 @@ packages: resolution: {integrity: sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==} dev: true + /@ianvs/prettier-plugin-sort-imports@4.0.0(prettier@2.8.8): + resolution: {integrity: sha512-56wYZhq/Ezt5o4Lzc+CEUV+sqTPEV2WcTFJSSLBOhe15yfIkrUheGeRvC3lg30VQ8K0J1kvWjXIY5lxeOlW2Tg==} + peerDependencies: + '@vue/compiler-sfc': '>=3.0.0' + prettier: 2.x + peerDependenciesMeta: + '@vue/compiler-sfc': + optional: true + dependencies: + '@babel/core': 7.22.1 + '@babel/generator': 7.22.0 + '@babel/parser': 7.22.0 + '@babel/traverse': 7.22.1 + '@babel/types': 7.22.0 + prettier: 2.8.8 + semver: 7.5.1 + transitivePeerDependencies: + - supports-color + dev: true + /@ioredis/as-callback@3.0.0: resolution: {integrity: sha512-Kqv1rZ3WbgOrS+hgzJ5xG5WQuhvzzSTRYvNeyPMLOAM78MHSnuKI20JeJGbpuAt//LCuP0vsexZcorqW7kWhJg==} dev: false @@ -1448,7 +1553,7 @@ packages: '@trpc/client': 10.26.0(@trpc/server@10.26.0) '@trpc/react-query': 10.26.0(@tanstack/react-query@4.29.7)(@trpc/client@10.26.0)(@trpc/server@10.26.0)(react-dom@18.2.0)(react@18.2.0) '@trpc/server': 10.26.0 - next: 13.4.2(react-dom@18.2.0)(react@18.2.0) + next: 13.4.2(@babel/core@7.22.1)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) react-ssr-prepass: 1.5.0(react@18.2.0) @@ -1793,7 +1898,6 @@ packages: engines: {node: '>=4'} dependencies: color-convert: 1.9.3 - dev: false /ansi-styles@4.3.0: resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==} @@ -2069,7 +2173,6 @@ packages: electron-to-chromium: 1.4.409 node-releases: 2.0.12 update-browserslist-db: 1.0.11(browserslist@4.21.5) - dev: true /buffer-equal-constant-time@1.0.1: resolution: {integrity: sha512-zRpUiDwd/xk6ADqPMATG8vc9VPrkck7T07OIx0gnjmJAnHnTVXNQG3vfvWNuiZIkwu9KrKdA1iJKfsfTVxE6NA==} @@ -2126,7 +2229,6 @@ packages: ansi-styles: 3.2.1 escape-string-regexp: 1.0.5 supports-color: 5.5.0 - dev: false /chalk@4.1.2: resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==} @@ -2206,7 +2308,6 @@ packages: resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==} dependencies: color-name: 1.1.3 - dev: false /color-convert@2.0.1: resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==} @@ -2216,7 +2317,6 @@ packages: /color-name@1.1.3: resolution: {integrity: sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==} - dev: false /color-name@1.1.4: resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==} @@ -2297,6 +2397,9 @@ packages: engines: {node: '>= 0.6'} dev: false + /convert-source-map@1.9.0: + resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==} + /cookie@0.4.2: resolution: {integrity: sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==} engines: {node: '>= 0.6'} @@ -2618,7 +2721,6 @@ packages: /electron-to-chromium@1.4.409: resolution: {integrity: sha512-+2mRCBG9dR66sprh2dLuO6vr+O1xqHXvhmMglfut3OmfeUVRUho2nZYxxD9pG6G4PLDkZeqhlA/Gk6LpjVSHag==} - dev: true /emoji-regex@8.0.0: resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==} @@ -2721,7 +2823,6 @@ packages: /escalade@3.1.1: resolution: {integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==} engines: {node: '>=6'} - dev: true /escape-html@1.0.3: resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==} @@ -2730,7 +2831,6 @@ packages: /escape-string-regexp@1.0.5: resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==} engines: {node: '>=0.8.0'} - dev: false /escape-string-regexp@4.0.0: resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==} @@ -3370,6 +3470,10 @@ packages: wide-align: 1.1.5 dev: false + /gensync@1.0.0-beta.2: + resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==} + engines: {node: '>=6.9.0'} + /get-caller-file@2.0.5: resolution: {integrity: sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==} engines: {node: 6.* || 8.* || >= 10.*} @@ -3464,7 +3568,6 @@ packages: /globals@11.12.0: resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==} engines: {node: '>=4'} - dev: false /globals@13.20.0: resolution: {integrity: sha512-Qg5QtVkCy/kv3FUSlu4ukeZDVf9ee0iXLAUYX13gbR17bnejFTzr4iS9bY7kwCf1NztRNm1t91fjOiyx4CSwPQ==} @@ -3532,7 +3635,6 @@ packages: /has-flag@3.0.0: resolution: {integrity: sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==} engines: {node: '>=4'} - dev: false /has-flag@4.0.0: resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==} @@ -3971,7 +4073,6 @@ packages: resolution: {integrity: sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==} engines: {node: '>=4'} hasBin: true - dev: false /json-schema-resolver@2.0.0: resolution: {integrity: sha512-pJ4XLQP4Q9HTxl6RVDLJ8Cyh1uitSs0CzDBAz1uoJ4sRD/Bk7cFSXL1FUXDW3zJ7YnfliJx6eu8Jn283bpZ4Yg==} @@ -4003,6 +4104,11 @@ packages: minimist: 1.2.8 dev: true + /json5@2.2.3: + resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==} + engines: {node: '>=6'} + hasBin: true + /jsonwebtoken@8.5.1: resolution: {integrity: sha512-XjwVfRS6jTMsqYs0EsuJ4LGxXV14zQybNd4L2r0UvbVnSF9Af8x7p5MzbJ90Ioz/9TI41/hTCvznF/loiSzn8w==} engines: {node: '>=4', npm: '>=1.4.28'} @@ -4165,6 +4271,11 @@ packages: dependencies: js-tokens: 4.0.0 + /lru-cache@5.1.1: + resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==} + dependencies: + yallist: 3.1.1 + /lru-cache@6.0.0: resolution: {integrity: sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==} engines: {node: '>=10'} @@ -4362,7 +4473,7 @@ packages: '@panva/hkdf': 1.1.1 cookie: 0.5.0 jose: 4.14.4 - next: 13.4.2(react-dom@18.2.0)(react@18.2.0) + next: 13.4.2(@babel/core@7.22.1)(react-dom@18.2.0)(react@18.2.0) oauth: 0.9.15 openid-client: 5.4.2 preact: 10.15.0 @@ -4379,12 +4490,12 @@ packages: react: '*' react-dom: '*' dependencies: - next: 13.4.2(react-dom@18.2.0)(react@18.2.0) + next: 13.4.2(@babel/core@7.22.1)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) dev: true - /next@13.4.2(react-dom@18.2.0)(react@18.2.0): + /next@13.4.2(@babel/core@7.22.1)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-aNFqLs3a3nTGvLWlO9SUhCuMUHVPSFQC0+tDNGAsDXqx+WJDFSbvc233gOJ5H19SBc7nw36A9LwQepOJ2u/8Kg==} engines: {node: '>=16.8.0'} hasBin: true @@ -4412,7 +4523,7 @@ packages: postcss: 8.4.14 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) - styled-jsx: 5.1.1(react@18.2.0) + styled-jsx: 5.1.1(@babel/core@7.22.1)(react@18.2.0) zod: 3.21.4 optionalDependencies: '@next/swc-darwin-arm64': 13.4.2 @@ -4475,7 +4586,6 @@ packages: /node-releases@2.0.12: resolution: {integrity: sha512-QzsYKWhXTWx8h1kIvqfnC++o0pEmpRQA/aenALsL2F4pqNVr7YzcdMlDij5WBnwftRbJCNJL/O7zdKaxKPHqgQ==} - dev: true /nopt@5.0.0: resolution: {integrity: sha512-Tbj67rffqceeLpcRXrT7vKAN8CwfPeIBgM7E6iBkmKLV7bEMwpGgYLGv0jACUsECaa/vuxP0IjEont6umdMgtQ==} @@ -4945,7 +5055,7 @@ packages: engines: {node: '>= 0.8.0'} dev: true - /prettier-plugin-tailwindcss@0.2.8(prettier@2.8.8): + /prettier-plugin-tailwindcss@0.2.8(@ianvs/prettier-plugin-sort-imports@4.0.0)(prettier@2.8.8): resolution: {integrity: sha512-KgPcEnJeIijlMjsA6WwYgRs5rh3/q76oInqtMXBA/EMcamrcYJpyhtRhyX1ayT9hnHlHTuO8sIifHF10WuSDKg==} engines: {node: '>=12.17.0'} peerDependencies: @@ -4994,6 +5104,7 @@ packages: prettier-plugin-twig-melody: optional: true dependencies: + '@ianvs/prettier-plugin-sort-imports': 4.0.0(prettier@2.8.8) prettier: 2.8.8 dev: true @@ -5712,7 +5823,7 @@ packages: engines: {node: '>=8'} dev: true - /styled-jsx@5.1.1(react@18.2.0): + /styled-jsx@5.1.1(@babel/core@7.22.1)(react@18.2.0): resolution: {integrity: sha512-pW7uC1l4mBZ8ugbiZrcIsiIvVx1UmTfw7UkC3Um2tmfUq9Bhk8IiyEIPl6F8agHgjzku6j0xQEZbfA5uSgSaCw==} engines: {node: '>= 12.0.0'} peerDependencies: @@ -5725,6 +5836,7 @@ packages: babel-plugin-macros: optional: true dependencies: + '@babel/core': 7.22.1 client-only: 0.0.1 react: 18.2.0 @@ -5772,7 +5884,6 @@ packages: engines: {node: '>=4'} dependencies: has-flag: 3.0.0 - dev: false /supports-color@7.2.0: resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==} @@ -5920,7 +6031,6 @@ packages: /to-fast-properties@2.0.0: resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==} engines: {node: '>=4'} - dev: false /to-regex-range@5.0.1: resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==} @@ -6052,7 +6162,6 @@ packages: browserslist: 4.21.5 escalade: 3.1.1 picocolors: 1.0.0 - dev: true /uri-js@4.4.1: resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==} @@ -6211,6 +6320,9 @@ packages: engines: {node: '>=10'} dev: true + /yallist@3.1.1: + resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==} + /yallist@4.0.0: resolution: {integrity: sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==} diff --git a/src/app/Providers.tsx b/src/app/Providers.tsx index cbb7919..14893c2 100644 --- a/src/app/Providers.tsx +++ b/src/app/Providers.tsx @@ -1,7 +1,7 @@ "use client"; +import { ThemeProvider } from "@/components/theme-provider"; import { api } from "@/lib/utils/api"; import { SessionProvider } from "next-auth/react"; -import { ThemeProvider } from "next-themes"; import React from "react"; type ProvidersProps = { @@ -10,7 +10,9 @@ type ProvidersProps = { const Providers = ({ children }: ProvidersProps) => { return ( - {children} + + {children} + ); }; diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 7fdf4b6..e9fe0ed 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,18 +1,21 @@ import Navbar from "@/lib/components/layout/Navbar"; -import "../styles/globals.css"; +import "@/styles/globals.css"; +import { type Metadata } from "next"; import Providers from "./Providers"; -import { Raleway } from "next/font/google"; +import { fontSans } from "@/config/fonts"; import Image from "next/image"; - -const font = Raleway({ - subsets: ["latin"], - display: "swap", -}); +import { cn } from "@/lib/utils/styles"; +import { siteConfig } from "@/config/site"; const RootLayout = ({ children }: { children: React.ReactNode }) => { return ( - - + +
{ ); }; -export const metadata = { - title: "Mixy::Boos", - description: "Robot Powered Mixes", + +export const metadata: Metadata = { + title: { + default: siteConfig.name, + template: `%s - ${siteConfig.name}`, + }, + description: siteConfig.description, + themeColor: [ + { media: "(prefers-color-scheme: light)", color: "white" }, + { media: "(prefers-color-scheme: dark)", color: "black" }, + ], + icons: { + icon: "/favicon.ico", + shortcut: "/favicon-16x16.png", + apple: "/apple-touch-icon.png", + }, }; export default RootLayout; diff --git a/src/components/theme-provider.tsx b/src/components/theme-provider.tsx new file mode 100644 index 0000000..b0ff266 --- /dev/null +++ b/src/components/theme-provider.tsx @@ -0,0 +1,9 @@ +"use client"; + +import * as React from "react"; +import { ThemeProvider as NextThemesProvider } from "next-themes"; +import { type ThemeProviderProps } from "next-themes/dist/types"; + +export function ThemeProvider({ children, ...props }: ThemeProviderProps) { + return {children}; +} diff --git a/src/components/widgets/mode-toggle.tsx b/src/components/widgets/mode-toggle.tsx deleted file mode 100644 index 5fdc3e6..0000000 --- a/src/components/widgets/mode-toggle.tsx +++ /dev/null @@ -1,43 +0,0 @@ -"use client"; - -import * as React from "react"; -import { useTheme } from "next-themes"; - -import { Button } from "@/components/ui/button"; -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@/components/ui/dropdown-menu"; -import { Icons } from "@/components/icons"; - -export function ModeToggle() { - const { setTheme } = useTheme(); - - return ( - - - - - - setTheme("light")}> - - Light - - setTheme("dark")}> - - Dark - - setTheme("system")}> - - System - - - - ); -} diff --git a/src/components/widgets/theme-toggle.tsx b/src/components/widgets/theme-toggle.tsx new file mode 100644 index 0000000..7de133c --- /dev/null +++ b/src/components/widgets/theme-toggle.tsx @@ -0,0 +1,23 @@ +"use client"; + +import * as React from "react"; +import { useTheme } from "next-themes"; + +import { Button } from "@/components/ui/button"; +import { Icons } from "@/components/icons"; + +export function ThemeToggle() { + const { setTheme, theme } = useTheme(); + + return ( + + ); +} diff --git a/src/config/fonts.ts b/src/config/fonts.ts new file mode 100644 index 0000000..5b9dae1 --- /dev/null +++ b/src/config/fonts.ts @@ -0,0 +1,14 @@ +import { + JetBrains_Mono as FontMono, + Inter as FontSans, +} from "next/font/google"; + +export const fontSans = FontSans({ + subsets: ["latin"], + variable: "--font-sans", +}); + +export const fontMono = FontMono({ + subsets: ["latin"], + variable: "--font-mono", +}); diff --git a/src/config/site.ts b/src/config/site.ts new file mode 100644 index 0000000..b539897 --- /dev/null +++ b/src/config/site.ts @@ -0,0 +1,17 @@ +export type SiteConfig = typeof siteConfig; + +export const siteConfig = { + name: "Mixy:Boos", + description: "Robot Powered Mixes.", + mainNav: [ + { + title: "Home", + href: "/", + }, + ], + links: { + twitter: "https://twitter.com/mixyboos", + github: "https://github.com/mixyboos", + docs: "https://docs.mixyboos.com", + }, +}; diff --git a/src/lib/components/layout/Navbar.tsx b/src/lib/components/layout/Navbar.tsx index aae056d..228b175 100644 --- a/src/lib/components/layout/Navbar.tsx +++ b/src/lib/components/layout/Navbar.tsx @@ -7,9 +7,8 @@ import { useSession } from "next-auth/react"; import { cn } from "@/lib/utils/styles"; import Search from "@/components/widgets/search"; import { UserNav } from "@/components/widgets/user-nav"; -import { ModeToggle } from "@/components/widgets/mode-toggle"; +import { ThemeToggle } from "@/components/widgets/theme-toggle"; import { type Icon, Icons } from "@/components/icons"; -import { LucideIcon } from "lucide-react"; // const NavbarLogin = ({ // session, @@ -83,7 +82,7 @@ const Navbar = ({ className, ...props }: React.HTMLAttributes) => {
- +
diff --git a/src/styles/globals.css b/src/styles/globals.css index a1fb5a3..95d8cab 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -13,12 +13,12 @@ --popover: 0 0% 100%; --popover-foreground: 222.2 47.4% 11.2%; - --card: 0 0% 100%; - --card-foreground: 222.2 47.4% 11.2%; - --border: 214.3 31.8% 91.4%; --input: 214.3 31.8% 91.4%; + --card: 0 0% 100%; + --card-foreground: 222.2 47.4% 11.2%; + --primary: 222.2 47.4% 11.2%; --primary-foreground: 210 40% 98%; @@ -43,24 +43,24 @@ --muted: 223 47% 11%; --muted-foreground: 215.4 16.3% 56.9%; + --accent: 216 34% 17%; + --accent-foreground: 210 40% 98%; + --popover: 224 71% 4%; --popover-foreground: 215 20.2% 65.1%; - --card: 224 71% 4%; - --card-foreground: 213 31% 91%; - --border: 216 34% 17%; --input: 216 34% 17%; + --card: 224 71% 4%; + --card-foreground: 213 31% 91%; + --primary: 210 40% 98%; --primary-foreground: 222.2 47.4% 1.2%; --secondary: 222.2 47.4% 11.2%; --secondary-foreground: 210 40% 98%; - --accent: 216 34% 17%; - --accent-foreground: 210 40% 98%; - --destructive: 0 63% 31%; --destructive-foreground: 210 40% 98%; diff --git a/tailwind.config.ts b/tailwind.config.ts index b505bc7..1108407 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -1,7 +1,7 @@ import { fontFamily } from "tailwindcss/defaultTheme"; +import type { Config } from "tailwindcss"; -/** @type {import('tailwindcss').Config} */ -module.exports = { +const config: Config = { darkMode: ["class"], content: ["./src/**/*.{js,ts,jsx,tsx}"], theme: { @@ -58,12 +58,12 @@ module.exports = { }, keyframes: { "accordion-down": { - from: { height: 0 }, + from: { height: "0" }, to: { height: "var(--radix-accordion-content-height)" }, }, "accordion-up": { from: { height: "var(--radix-accordion-content-height)" }, - to: { height: 0 }, + to: { height: "0" }, }, }, animation: { @@ -74,3 +74,4 @@ module.exports = { }, plugins: [require("tailwindcss-animate")], }; +module.exports = config;