From 9ae6776f379d73e23bc15b7442f5808e8f0b5cb6 Mon Sep 17 00:00:00 2001 From: johndoe6345789 Date: Tue, 20 Jan 2026 00:06:44 +0000 Subject: [PATCH] feat: add stylelint for SCSS and CSS, update theme and global styles - Added stylelint scripts to package.json for linting SCSS and CSS files. - Updated global styles to remove quotes from font-family declarations and changed `currentColor` to `currentcolor`. - Refactored theme.scss to use shorthand hex color codes and updated font-family declarations. - Modified carousel component to remove unnecessary onSelect call. - Enhanced useSnippetForm hook with comments and ESLint disable/enable for clarity. - Improved mixins in _mixins.scss for flexbox and responsive breakpoints. - Updated color definitions in _variables.scss to use the `hsl()` format with degrees. - Changed button and dialog styles to use `currentcolor` for background. - Adjusted header styles for box-shadow and gradient backgrounds. - Refined typography styles to ensure consistent font-family usage. - Enhanced utility classes in _utilities.scss for better readability and maintainability. --- .stylelintignore | 5 + .stylelintrc.json | 4 + eslint.config.mjs | 2 - package-lock.json | 1341 ++++++++++++++++++++++++ package.json | 4 + src/app/globals.scss | 18 +- src/app/theme.scss | 10 +- src/components/ui/carousel.tsx | 1 - src/hooks/useSnippetForm.ts | 4 + src/styles/abstracts/_mixins.scss | 21 +- src/styles/abstracts/_variables.scss | 219 ++-- src/styles/components/_buttons.scss | 6 +- src/styles/components/_dialogs.scss | 4 + src/styles/components/_header.scss | 22 +- src/styles/components/_typography.scss | 2 +- src/styles/utilities/_utilities.scss | 291 +++-- 16 files changed, 1738 insertions(+), 216 deletions(-) create mode 100644 .stylelintignore create mode 100644 .stylelintrc.json diff --git a/.stylelintignore b/.stylelintignore new file mode 100644 index 0000000..3f8ee20 --- /dev/null +++ b/.stylelintignore @@ -0,0 +1,5 @@ +.next +node_modules +dist +coverage +**/generated/** diff --git a/.stylelintrc.json b/.stylelintrc.json new file mode 100644 index 0000000..615f990 --- /dev/null +++ b/.stylelintrc.json @@ -0,0 +1,4 @@ +{ + "extends": ["stylelint-config-standard-scss"], + "rules": {} +} diff --git a/eslint.config.mjs b/eslint.config.mjs index 49f8452..0f0b715 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -18,8 +18,6 @@ export default [ }, rules: { ...reactHooks.configs.recommended.rules, - 'react-hooks/set-state-in-effect': 'off', - 'react-hooks/purity': 'off', }, }, { diff --git a/package-lock.json b/package-lock.json index 4b74a5a..0830e0b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -71,6 +71,9 @@ "eslint-config-next": "^16.1.3", "eslint-plugin-react-hooks": "^7.0.1", "globals": "^16.0.0", + "stylelint": "^17.0.0", + "stylelint-config-standard-scss": "^17.0.0", + "stylelint-scss": "^7.0.0", "typescript": "~5.9.3", "typescript-eslint": "^8.53.1" }, @@ -371,6 +374,200 @@ "node": ">=6.9.0" } }, + "node_modules/@cacheable/memory": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/@cacheable/memory/-/memory-2.0.7.tgz", + "integrity": "sha512-RbxnxAMf89Tp1dLhXMS7ceft/PGsDl1Ip7T20z5nZ+pwIAsQ1p2izPjVG69oCLv/jfQ7HDPHTWK0c9rcAWXN3A==", + "dev": true, + "license": "MIT", + "dependencies": { + "@cacheable/utils": "^2.3.3", + "@keyv/bigmap": "^1.3.0", + "hookified": "^1.14.0", + "keyv": "^5.5.5" + } + }, + "node_modules/@cacheable/memory/node_modules/@keyv/bigmap": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/@keyv/bigmap/-/bigmap-1.3.0.tgz", + "integrity": "sha512-KT01GjzV6AQD5+IYrcpoYLkCu1Jod3nau1Z7EsEuViO3TZGRacSbO9MfHmbJ1WaOXFtWLxPVj169cn2WNKPkIg==", + "dev": true, + "license": "MIT", + "dependencies": { + "hashery": "^1.2.0", + "hookified": "^1.13.0" + }, + "engines": { + "node": ">= 18" + }, + "peerDependencies": { + "keyv": "^5.5.4" + } + }, + "node_modules/@cacheable/memory/node_modules/keyv": { + "version": "5.5.5", + "resolved": "https://registry.npmjs.org/keyv/-/keyv-5.5.5.tgz", + "integrity": "sha512-FA5LmZVF1VziNc0bIdCSA1IoSVnDCqE8HJIZZv2/W8YmoAM50+tnUgJR/gQZwEeIMleuIOnRnHA/UaZRNeV4iQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@keyv/serialize": "^1.1.1" + } + }, + "node_modules/@cacheable/utils": { + "version": "2.3.3", + "resolved": "https://registry.npmjs.org/@cacheable/utils/-/utils-2.3.3.tgz", + "integrity": "sha512-JsXDL70gQ+1Vc2W/KUFfkAJzgb4puKwwKehNLuB+HrNKWf91O736kGfxn4KujXCCSuh6mRRL4XEB0PkAFjWS0A==", + "dev": true, + "license": "MIT", + "dependencies": { + "hashery": "^1.3.0", + "keyv": "^5.5.5" + } + }, + "node_modules/@cacheable/utils/node_modules/keyv": { + "version": "5.5.5", + "resolved": "https://registry.npmjs.org/keyv/-/keyv-5.5.5.tgz", + "integrity": "sha512-FA5LmZVF1VziNc0bIdCSA1IoSVnDCqE8HJIZZv2/W8YmoAM50+tnUgJR/gQZwEeIMleuIOnRnHA/UaZRNeV4iQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@keyv/serialize": "^1.1.1" + } + }, + "node_modules/@csstools/css-parser-algorithms": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-4.0.0.tgz", + "integrity": "sha512-+B87qS7fIG3L5h3qwJ/IFbjoVoOe/bpOdh9hAjXbvx0o8ImEmUsGXN0inFOnk2ChCFgqkkGFQ+TpM5rbhkKe4w==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "license": "MIT", + "engines": { + "node": ">=20.19.0" + }, + "peerDependencies": { + "@csstools/css-tokenizer": "^4.0.0" + } + }, + "node_modules/@csstools/css-syntax-patches-for-csstree": { + "version": "1.0.25", + "resolved": "https://registry.npmjs.org/@csstools/css-syntax-patches-for-csstree/-/css-syntax-patches-for-csstree-1.0.25.tgz", + "integrity": "sha512-g0Kw9W3vjx5BEBAF8c5Fm2NcB/Fs8jJXh85aXqwEXiL+tqtOut07TWgyaGzAAfTM+gKckrrncyeGEZPcaRgm2Q==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "license": "MIT-0", + "engines": { + "node": ">=18" + } + }, + "node_modules/@csstools/css-tokenizer": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-4.0.0.tgz", + "integrity": "sha512-QxULHAm7cNu72w97JUNCBFODFaXpbDg+dP8b/oWFAZ2MTRppA3U00Y2L1HqaS4J6yBqxwa/Y3nMBaxVKbB/NsA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "license": "MIT", + "engines": { + "node": ">=20.19.0" + } + }, + "node_modules/@csstools/media-query-list-parser": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-5.0.0.tgz", + "integrity": "sha512-T9lXmZOfnam3eMERPsszjY5NK0jX8RmThmmm99FZ8b7z8yMaFZWKwLWGZuTwdO3ddRY5fy13GmmEYZXB4I98Eg==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "license": "MIT", + "engines": { + "node": ">=20.19.0" + }, + "peerDependencies": { + "@csstools/css-parser-algorithms": "^4.0.0", + "@csstools/css-tokenizer": "^4.0.0" + } + }, + "node_modules/@csstools/selector-resolve-nested": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@csstools/selector-resolve-nested/-/selector-resolve-nested-4.0.0.tgz", + "integrity": "sha512-9vAPxmp+Dx3wQBIUwc1v7Mdisw1kbbaGqXUM8QLTgWg7SoPGYtXBsMXvsFs/0Bn5yoFhcktzxNZGNaUt0VjgjA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "license": "MIT-0", + "engines": { + "node": ">=20.19.0" + }, + "peerDependencies": { + "postcss-selector-parser": "^7.1.1" + } + }, + "node_modules/@csstools/selector-specificity": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-6.0.0.tgz", + "integrity": "sha512-4sSgl78OtOXEX/2d++8A83zHNTgwCJMaR24FvsYL7Uf/VS8HZk9PTwR51elTbGqMuwH3szLvvOXEaVnqn0Z3zA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "license": "MIT-0", + "engines": { + "node": ">=20.19.0" + }, + "peerDependencies": { + "postcss-selector-parser": "^7.1.1" + } + }, "node_modules/@emnapi/core": { "version": "1.8.1", "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.8.1.tgz", @@ -1179,6 +1376,13 @@ "@jridgewell/sourcemap-codec": "^1.4.14" } }, + "node_modules/@keyv/serialize": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/@keyv/serialize/-/serialize-1.1.1.tgz", + "integrity": "sha512-dXn3FZhPv0US+7dtJsIi2R+c7qWYiReoEh5zUntWCf4oSpMNib8FDhSoed6m3QyZdx5hK7iLFkYk3rNxwt8vTA==", + "dev": true, + "license": "MIT" + }, "node_modules/@monaco-editor/loader": { "version": "1.7.0", "resolved": "https://registry.npmjs.org/@monaco-editor/loader/-/loader-1.7.0.tgz", @@ -3364,6 +3568,19 @@ "dev": true, "license": "MIT" }, + "node_modules/@sindresorhus/merge-streams": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@sindresorhus/merge-streams/-/merge-streams-4.0.0.tgz", + "integrity": "sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/@standard-schema/spec": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.1.0.tgz", @@ -4080,6 +4297,19 @@ "url": "https://github.com/sponsors/epoberezkin" } }, + "node_modules/ansi-regex": { + "version": "6.2.2", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.2.tgz", + "integrity": "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/chalk/ansi-regex?sponsor=1" + } + }, "node_modules/ansi-styles": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", @@ -4292,6 +4522,16 @@ "dev": true, "license": "MIT" }, + "node_modules/astral-regex": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-2.0.0.tgz", + "integrity": "sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, "node_modules/async-function": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/async-function/-/async-function-1.0.0.tgz", @@ -4412,6 +4652,30 @@ "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7" } }, + "node_modules/cacheable": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/cacheable/-/cacheable-2.3.2.tgz", + "integrity": "sha512-w+ZuRNmex9c1TR9RcsxbfTKCjSL0rh1WA5SABbrWprIHeNBdmyQLSYonlDy9gpD+63XT8DgZ/wNh1Smvc9WnJA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@cacheable/memory": "^2.0.7", + "@cacheable/utils": "^2.3.3", + "hookified": "^1.15.0", + "keyv": "^5.5.5", + "qified": "^0.6.0" + } + }, + "node_modules/cacheable/node_modules/keyv": { + "version": "5.5.5", + "resolved": "https://registry.npmjs.org/keyv/-/keyv-5.5.5.tgz", + "integrity": "sha512-FA5LmZVF1VziNc0bIdCSA1IoSVnDCqE8HJIZZv2/W8YmoAM50+tnUgJR/gQZwEeIMleuIOnRnHA/UaZRNeV4iQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@keyv/serialize": "^1.1.1" + } + }, "node_modules/call-bind": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.8.tgz", @@ -4571,6 +4835,13 @@ "dev": true, "license": "MIT" }, + "node_modules/colord": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz", + "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==", + "dev": true, + "license": "MIT" + }, "node_modules/concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", @@ -4585,6 +4856,33 @@ "dev": true, "license": "MIT" }, + "node_modules/cosmiconfig": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz", + "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==", + "dev": true, + "license": "MIT", + "dependencies": { + "env-paths": "^2.2.1", + "import-fresh": "^3.3.0", + "js-yaml": "^4.1.0", + "parse-json": "^5.2.0" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/d-fischer" + }, + "peerDependencies": { + "typescript": ">=4.9.5" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, "node_modules/cross-spawn": { "version": "7.0.6", "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", @@ -4600,6 +4898,43 @@ "node": ">= 8" } }, + "node_modules/css-functions-list": { + "version": "3.2.3", + "resolved": "https://registry.npmjs.org/css-functions-list/-/css-functions-list-3.2.3.tgz", + "integrity": "sha512-IQOkD3hbR5KrN93MtcYuad6YPuTSUhntLHDuLEbFWE+ff2/XSZNdZG+LcbbIW5AXKg/WFIfYItIzVoHngHXZzA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12 || >=16" + } + }, + "node_modules/css-tree": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-3.1.0.tgz", + "integrity": "sha512-0eW44TGN5SQXU1mWSkKwFstI/22X2bG1nYzZTYMAWjylYURhse752YgbE4Cx46AC+bAvI+/dYTPRk1LqSUnu6w==", + "dev": true, + "license": "MIT", + "dependencies": { + "mdn-data": "2.12.2", + "source-map-js": "^1.0.1" + }, + "engines": { + "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0" + } + }, + "node_modules/cssesc": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", + "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==", + "dev": true, + "license": "MIT", + "bin": { + "cssesc": "bin/cssesc" + }, + "engines": { + "node": ">=4" + } + }, "node_modules/csstype": { "version": "3.2.3", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz", @@ -4971,6 +5306,26 @@ "dev": true, "license": "MIT" }, + "node_modules/env-paths": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/env-paths/-/env-paths-2.2.1.tgz", + "integrity": "sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6" + } + }, + "node_modules/error-ex": { + "version": "1.3.4", + "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.4.tgz", + "integrity": "sha512-sqQamAnR14VgCr1A618A3sGrygcpK+HEbenA/HiEAkkUwcZIIB/tgWqHFxWgOyDh4nB4JCRimh79dR5Ywc9MDQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "is-arrayish": "^0.2.1" + } + }, "node_modules/es-abstract": { "version": "1.24.1", "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.24.1.tgz", @@ -5681,6 +6036,33 @@ "dev": true, "license": "MIT" }, + "node_modules/fast-uri": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.0.tgz", + "integrity": "sha512-iPeeDKJSWf4IEOasVVrknXpaBV0IApz/gp7S2bb7Z4Lljbl2MGJRqInZiUrQwV16cpzw/D3S5j5Julj/gT52AA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/fastify" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/fastify" + } + ], + "license": "BSD-3-Clause" + }, + "node_modules/fastest-levenshtein": { + "version": "1.0.16", + "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz", + "integrity": "sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 4.9.1" + } + }, "node_modules/fastq": { "version": "1.20.1", "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz", @@ -5877,6 +6259,19 @@ "node": ">=6.9.0" } }, + "node_modules/get-east-asian-width": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.4.0.tgz", + "integrity": "sha512-QZjmEOC+IT1uk6Rx0sX22V6uHWVwbdbxf1faPqJ1QhLdGgsRGCZoyaQBm/piRdJy/D2um6hM1UP7ZEeQ4EkP+Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/get-intrinsic": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz", @@ -5969,6 +6364,47 @@ "node": ">=10.13.0" } }, + "node_modules/global-modules": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-2.0.0.tgz", + "integrity": "sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==", + "dev": true, + "license": "MIT", + "dependencies": { + "global-prefix": "^3.0.0" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/global-prefix": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-3.0.0.tgz", + "integrity": "sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==", + "dev": true, + "license": "MIT", + "dependencies": { + "ini": "^1.3.5", + "kind-of": "^6.0.2", + "which": "^1.3.1" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/global-prefix/node_modules/which": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz", + "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==", + "dev": true, + "license": "ISC", + "dependencies": { + "isexe": "^2.0.0" + }, + "bin": { + "which": "bin/which" + } + }, "node_modules/globals": { "version": "16.5.0", "resolved": "https://registry.npmjs.org/globals/-/globals-16.5.0.tgz", @@ -5999,6 +6435,74 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/globby": { + "version": "16.1.0", + "resolved": "https://registry.npmjs.org/globby/-/globby-16.1.0.tgz", + "integrity": "sha512-+A4Hq7m7Ze592k9gZRy4gJ27DrXRNnC1vPjxTt1qQxEY8RxagBkBxivkCwg7FxSTG0iLLEMaUx13oOr0R2/qcQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@sindresorhus/merge-streams": "^4.0.0", + "fast-glob": "^3.3.3", + "ignore": "^7.0.5", + "is-path-inside": "^4.0.0", + "slash": "^5.1.0", + "unicorn-magic": "^0.4.0" + }, + "engines": { + "node": ">=20" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/globby/node_modules/fast-glob": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz", + "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.stat": "^2.0.2", + "@nodelib/fs.walk": "^1.2.3", + "glob-parent": "^5.1.2", + "merge2": "^1.3.0", + "micromatch": "^4.0.8" + }, + "engines": { + "node": ">=8.6.0" + } + }, + "node_modules/globby/node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "license": "ISC", + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/globby/node_modules/ignore": { + "version": "7.0.5", + "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz", + "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 4" + } + }, + "node_modules/globjoin": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/globjoin/-/globjoin-0.1.4.tgz", + "integrity": "sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==", + "dev": true, + "license": "MIT" + }, "node_modules/gopd": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz", @@ -6093,6 +6597,19 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/hashery": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/hashery/-/hashery-1.4.0.tgz", + "integrity": "sha512-Wn2i1In6XFxl8Az55kkgnFRiAlIAushzh26PTjL2AKtQcEfXrcLa7Hn5QOWGZEf3LU057P9TwwZjFyxfS1VuvQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "hookified": "^1.14.0" + }, + "engines": { + "node": ">=20" + } + }, "node_modules/hasown": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz", @@ -6123,6 +6640,26 @@ "hermes-estree": "0.25.1" } }, + "node_modules/hookified": { + "version": "1.15.0", + "resolved": "https://registry.npmjs.org/hookified/-/hookified-1.15.0.tgz", + "integrity": "sha512-51w+ZZGt7Zw5q7rM3nC4t3aLn/xvKDETsXqMczndvwyVQhAHfUmUuFBRFcos8Iyebtk7OAE9dL26wFNzZVVOkw==", + "dev": true, + "license": "MIT" + }, + "node_modules/html-tags": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/html-tags/-/html-tags-5.1.0.tgz", + "integrity": "sha512-n6l5uca7/y5joxZ3LUePhzmBFUJ+U2YWzhMa8XUTecSeSlQiZdF5XAd/Q3/WUl0VsXgUwWi8I7CNIwdI5WN1SQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=20.10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/ignore": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz", @@ -6166,6 +6703,17 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/import-meta-resolve": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.2.0.tgz", + "integrity": "sha512-Iqv2fzaTQN28s/FwZAoFq0ZSs/7hMAHJVX+w8PZl3cY19Pxk6jFFalxQoIfW2826i/fDLXv8IiEZRIT0lDuWcg==", + "dev": true, + "license": "MIT", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/imurmurhash": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz", @@ -6176,6 +6724,13 @@ "node": ">=0.8.19" } }, + "node_modules/ini": { + "version": "1.3.8", + "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz", + "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==", + "dev": true, + "license": "ISC" + }, "node_modules/internal-slot": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz", @@ -6218,6 +6773,13 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-arrayish": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz", + "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==", + "dev": true, + "license": "MIT" + }, "node_modules/is-async-function": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.1.1.tgz", @@ -6371,6 +6933,16 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-fullwidth-code-point": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz", + "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, "node_modules/is-generator-function": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.1.2.tgz", @@ -6457,6 +7029,29 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-path-inside": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-4.0.0.tgz", + "integrity": "sha512-lJJV/5dYS+RcL8uQdBDW9c9uWFLLBNRyFhnAKXw5tVqLlKZ4RMGZKv+YQ/IA3OhD+RpbJa1LLFM1FQPGyIXvOA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/is-plain-object": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz", + "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/is-regex": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz", @@ -6673,6 +7268,13 @@ "dev": true, "license": "MIT" }, + "node_modules/json-parse-even-better-errors": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz", + "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==", + "dev": true, + "license": "MIT" + }, "node_modules/json-schema-traverse": { "version": "0.4.1", "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz", @@ -6726,6 +7328,23 @@ "json-buffer": "3.0.1" } }, + "node_modules/kind-of": { + "version": "6.0.3", + "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz", + "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/known-css-properties": { + "version": "0.37.0", + "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.37.0.tgz", + "integrity": "sha512-JCDrsP4Z1Sb9JwG0aJ8Eo2r7k4Ou5MwmThS/6lcIe1ICyb7UBJKGRIUUdqc2ASdE/42lgz6zFUnzAIhtXnBVrQ==", + "dev": true, + "license": "MIT" + }, "node_modules/language-subtag-registry": { "version": "0.3.23", "resolved": "https://registry.npmjs.org/language-subtag-registry/-/language-subtag-registry-0.3.23.tgz", @@ -6760,6 +7379,13 @@ "node": ">= 0.8.0" } }, + "node_modules/lines-and-columns": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz", + "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==", + "dev": true, + "license": "MIT" + }, "node_modules/locate-path": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz", @@ -6789,6 +7415,13 @@ "dev": true, "license": "MIT" }, + "node_modules/lodash.truncate": { + "version": "4.4.2", + "resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz", + "integrity": "sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==", + "dev": true, + "license": "MIT" + }, "node_modules/loose-envify": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", @@ -6842,6 +7475,37 @@ "node": ">= 0.4" } }, + "node_modules/mathml-tag-names": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/mathml-tag-names/-/mathml-tag-names-4.0.0.tgz", + "integrity": "sha512-aa6AU2Pcx0VP/XWnh8IGL0SYSgQHDT6Ucror2j2mXeFAlN3ahaNs8EZtG1YiticMkSLj3Gt6VPFfZogt7G5iFQ==", + "dev": true, + "license": "MIT", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, + "node_modules/mdn-data": { + "version": "2.12.2", + "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.12.2.tgz", + "integrity": "sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==", + "dev": true, + "license": "CC0-1.0" + }, + "node_modules/meow": { + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/meow/-/meow-14.0.0.tgz", + "integrity": "sha512-JhC3R1f6dbspVtmF3vKjAWz1EVIvwFrGGPLSdU6rK79xBwHWTuHoLnRX/t1/zHS1Ch1Y2UtIrih7DAHuH9JFJA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=20" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/merge2": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", @@ -7103,6 +7767,16 @@ "dev": true, "license": "MIT" }, + "node_modules/normalize-path": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", + "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", @@ -7306,6 +7980,25 @@ "node": ">=6" } }, + "node_modules/parse-json": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz", + "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/code-frame": "^7.0.0", + "error-ex": "^1.3.1", + "json-parse-even-better-errors": "^2.3.0", + "lines-and-columns": "^1.1.6" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/path-exists": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", @@ -7362,6 +8055,124 @@ "node": ">= 0.4" } }, + "node_modules/postcss": { + "version": "8.5.6", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz", + "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "nanoid": "^3.3.11", + "picocolors": "^1.1.1", + "source-map-js": "^1.2.1" + }, + "engines": { + "node": "^10 || ^12 || >=14" + } + }, + "node_modules/postcss-media-query-parser": { + "version": "0.2.3", + "resolved": "https://registry.npmjs.org/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz", + "integrity": "sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==", + "dev": true, + "license": "MIT" + }, + "node_modules/postcss-resolve-nested-selector": { + "version": "0.1.6", + "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.6.tgz", + "integrity": "sha512-0sglIs9Wmkzbr8lQwEyIzlDOOC9bGmfVKcJTaxv3vMmd3uo4o4DerC3En0bnmgceeql9BfC8hRkp7cg0fjdVqw==", + "dev": true, + "license": "MIT" + }, + "node_modules/postcss-safe-parser": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/postcss-safe-parser/-/postcss-safe-parser-7.0.1.tgz", + "integrity": "sha512-0AioNCJZ2DPYz5ABT6bddIqlhgwhpHZ/l65YAYo0BCIn0xiDpsnTHz0gnoTGk0OXZW0JRs+cDwL8u/teRdz+8A==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss-safe-parser" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "engines": { + "node": ">=18.0" + }, + "peerDependencies": { + "postcss": "^8.4.31" + } + }, + "node_modules/postcss-scss": { + "version": "4.0.9", + "resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.9.tgz", + "integrity": "sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss-scss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "engines": { + "node": ">=12.0" + }, + "peerDependencies": { + "postcss": "^8.4.29" + } + }, + "node_modules/postcss-selector-parser": { + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.1.tgz", + "integrity": "sha512-orRsuYpJVw8LdAwqqLykBj9ecS5/cRHlI5+nvTo8LcCKmzDmqVORXtOIYEEQuL9D4BxtA1lm5isAqzQZCoQ6Eg==", + "dev": true, + "license": "MIT", + "dependencies": { + "cssesc": "^3.0.0", + "util-deprecate": "^1.0.2" + }, + "engines": { + "node": ">=4" + } + }, + "node_modules/postcss-value-parser": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", + "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", + "dev": true, + "license": "MIT" + }, "node_modules/prelude-ls": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz", @@ -7411,6 +8222,19 @@ "node": ">=18.0.0" } }, + "node_modules/qified": { + "version": "0.6.0", + "resolved": "https://registry.npmjs.org/qified/-/qified-0.6.0.tgz", + "integrity": "sha512-tsSGN1x3h569ZSU1u6diwhltLyfUWDp3YbFHedapTmpBl0B3P6U3+Qptg7xu+v+1io1EwhdPyyRHYbEw0KN2FA==", + "dev": true, + "license": "MIT", + "dependencies": { + "hookified": "^1.14.0" + }, + "engines": { + "node": ">=20" + } + }, "node_modules/queue-microtask": { "version": "1.2.3", "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", @@ -7724,6 +8548,16 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/require-from-string": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz", + "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/reselect": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/reselect/-/reselect-5.1.1.tgz", @@ -8093,6 +8927,50 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/signal-exit": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz", + "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==", + "dev": true, + "license": "ISC", + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/slash": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-5.1.0.tgz", + "integrity": "sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14.16" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/slice-ansi": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-4.0.0.tgz", + "integrity": "sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-styles": "^4.0.0", + "astral-regex": "^2.0.0", + "is-fullwidth-code-point": "^3.0.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/slice-ansi?sponsor=1" + } + }, "node_modules/sonner": { "version": "2.0.7", "resolved": "https://registry.npmjs.org/sonner/-/sonner-2.0.7.tgz", @@ -8139,6 +9017,23 @@ "node": ">= 0.4" } }, + "node_modules/string-width": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-8.1.0.tgz", + "integrity": "sha512-Kxl3KJGb/gxkaUMOjRsQ8IrXiGW75O4E3RPjFIINOVH8AMl2SQ/yWdTzWwF3FevIX9LcMAjJW+GRwAlAbTSXdg==", + "dev": true, + "license": "MIT", + "dependencies": { + "get-east-asian-width": "^1.3.0", + "strip-ansi": "^7.1.0" + }, + "engines": { + "node": ">=20" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/string.prototype.includes": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/string.prototype.includes/-/string.prototype.includes-2.0.1.tgz", @@ -8252,6 +9147,22 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/strip-ansi": { + "version": "7.1.2", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.2.tgz", + "integrity": "sha512-gmBGslpoQJtgnMAvOVqGZpEz9dyoKTCzy2nfz/n8aIFhN/jCE/rCmcxabB6jOOHV+0WNnylOxaxBQPSvcWklhA==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-regex": "^6.0.1" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/chalk/strip-ansi?sponsor=1" + } + }, "node_modules/strip-bom": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz", @@ -8298,6 +9209,267 @@ } } }, + "node_modules/stylelint": { + "version": "17.0.0", + "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-17.0.0.tgz", + "integrity": "sha512-saMZ2mqdQre4AfouxcbTdpVglDRcROb4MIucKHvgsDb/0IX7ODhcaz+EOIyfxAsm8Zjl/7j4hJj6MgIYYM8Xwg==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/stylelint" + }, + { + "type": "github", + "url": "https://github.com/sponsors/stylelint" + } + ], + "license": "MIT", + "dependencies": { + "@csstools/css-parser-algorithms": "^4.0.0", + "@csstools/css-syntax-patches-for-csstree": "^1.0.25", + "@csstools/css-tokenizer": "^4.0.0", + "@csstools/media-query-list-parser": "^5.0.0", + "@csstools/selector-resolve-nested": "^4.0.0", + "@csstools/selector-specificity": "^6.0.0", + "balanced-match": "^3.0.1", + "colord": "^2.9.3", + "cosmiconfig": "^9.0.0", + "css-functions-list": "^3.2.3", + "css-tree": "^3.1.0", + "debug": "^4.4.3", + "fast-glob": "^3.3.3", + "fastest-levenshtein": "^1.0.16", + "file-entry-cache": "^11.1.1", + "global-modules": "^2.0.0", + "globby": "^16.1.0", + "globjoin": "^0.1.4", + "html-tags": "^5.1.0", + "ignore": "^7.0.5", + "import-meta-resolve": "^4.2.0", + "imurmurhash": "^0.1.4", + "is-plain-object": "^5.0.0", + "known-css-properties": "^0.37.0", + "mathml-tag-names": "^4.0.0", + "meow": "^14.0.0", + "micromatch": "^4.0.8", + "normalize-path": "^3.0.0", + "picocolors": "^1.1.1", + "postcss": "^8.5.6", + "postcss-safe-parser": "^7.0.1", + "postcss-selector-parser": "^7.1.1", + "postcss-value-parser": "^4.2.0", + "string-width": "^8.1.0", + "supports-hyperlinks": "^4.4.0", + "svg-tags": "^1.0.0", + "table": "^6.9.0", + "write-file-atomic": "^7.0.0" + }, + "bin": { + "stylelint": "bin/stylelint.mjs" + }, + "engines": { + "node": ">=20.19.0" + } + }, + "node_modules/stylelint-config-recommended": { + "version": "18.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-18.0.0.tgz", + "integrity": "sha512-mxgT2XY6YZ3HWWe3Di8umG6aBmWmHTblTgu/f10rqFXnyWxjKWwNdjSWkgkwCtxIKnqjSJzvFmPT5yabVIRxZg==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/stylelint" + }, + { + "type": "github", + "url": "https://github.com/sponsors/stylelint" + } + ], + "license": "MIT", + "engines": { + "node": ">=20.19.0" + }, + "peerDependencies": { + "stylelint": "^17.0.0" + } + }, + "node_modules/stylelint-config-recommended-scss": { + "version": "17.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-17.0.0.tgz", + "integrity": "sha512-VkVD9r7jfUT/dq3mA3/I1WXXk2U71rO5wvU2yIil9PW5o1g3UM7Xc82vHmuVJHV7Y8ok5K137fmW5u3HbhtTOA==", + "dev": true, + "license": "MIT", + "dependencies": { + "postcss-scss": "^4.0.9", + "stylelint-config-recommended": "^18.0.0", + "stylelint-scss": "^7.0.0" + }, + "engines": { + "node": ">=20" + }, + "peerDependencies": { + "postcss": "^8.3.3", + "stylelint": "^17.0.0" + }, + "peerDependenciesMeta": { + "postcss": { + "optional": true + } + } + }, + "node_modules/stylelint-config-standard": { + "version": "40.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-40.0.0.tgz", + "integrity": "sha512-EznGJxOUhtWck2r6dJpbgAdPATIzvpLdK9+i5qPd4Lx70es66TkBPljSg4wN3Qnc6c4h2n+WbUrUynQ3fanjHw==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/stylelint" + }, + { + "type": "github", + "url": "https://github.com/sponsors/stylelint" + } + ], + "license": "MIT", + "dependencies": { + "stylelint-config-recommended": "^18.0.0" + }, + "engines": { + "node": ">=20.19.0" + }, + "peerDependencies": { + "stylelint": "^17.0.0" + } + }, + "node_modules/stylelint-config-standard-scss": { + "version": "17.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-17.0.0.tgz", + "integrity": "sha512-uLJS6xgOCBw5EMsDW7Ukji8l28qRoMnkRch15s0qwZpskXvWt9oPzMmcYM307m9GN4MxuWLsQh4I6hU9yI53cQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "stylelint-config-recommended-scss": "^17.0.0", + "stylelint-config-standard": "^40.0.0" + }, + "engines": { + "node": ">=20" + }, + "peerDependencies": { + "postcss": "^8.3.3", + "stylelint": "^17.0.0" + }, + "peerDependenciesMeta": { + "postcss": { + "optional": true + } + } + }, + "node_modules/stylelint-scss": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-7.0.0.tgz", + "integrity": "sha512-H88kCC+6Vtzj76NsC8rv6x/LW8slBzIbyeSjsKVlS+4qaEJoDrcJR4L+8JdrR2ORdTscrBzYWiiT2jq6leYR1Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "css-tree": "^3.0.1", + "is-plain-object": "^5.0.0", + "known-css-properties": "^0.37.0", + "mdn-data": "^2.25.0", + "postcss-media-query-parser": "^0.2.3", + "postcss-resolve-nested-selector": "^0.1.6", + "postcss-selector-parser": "^7.1.1", + "postcss-value-parser": "^4.2.0" + }, + "engines": { + "node": ">=20.19.0" + }, + "peerDependencies": { + "stylelint": "^16.8.2 || ^17.0.0" + } + }, + "node_modules/stylelint-scss/node_modules/mdn-data": { + "version": "2.26.0", + "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.26.0.tgz", + "integrity": "sha512-ZqI0qjKWHMPcGUfLmlr80NPNVHIOjPMHtIOe1qXYFGS0YBZ1YKAzo9yk8W+gGrLCN0Xdv/RKxqdIsqPakEfmow==", + "dev": true, + "license": "CC0-1.0" + }, + "node_modules/stylelint/node_modules/balanced-match": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-3.0.1.tgz", + "integrity": "sha512-vjtV3hiLqYDNRoiAv0zC4QaGAMPomEoq83PRmYIofPswwZurCeWR5LByXm7SyoL0Zh5+2z0+HC7jG8gSZJUh0w==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 16" + } + }, + "node_modules/stylelint/node_modules/fast-glob": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz", + "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.stat": "^2.0.2", + "@nodelib/fs.walk": "^1.2.3", + "glob-parent": "^5.1.2", + "merge2": "^1.3.0", + "micromatch": "^4.0.8" + }, + "engines": { + "node": ">=8.6.0" + } + }, + "node_modules/stylelint/node_modules/file-entry-cache": { + "version": "11.1.2", + "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-11.1.2.tgz", + "integrity": "sha512-N2WFfK12gmrK1c1GXOqiAJ1tc5YE+R53zvQ+t5P8S5XhnmKYVB5eZEiLNZKDSmoG8wqqbF9EXYBBW/nef19log==", + "dev": true, + "license": "MIT", + "dependencies": { + "flat-cache": "^6.1.20" + } + }, + "node_modules/stylelint/node_modules/flat-cache": { + "version": "6.1.20", + "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-6.1.20.tgz", + "integrity": "sha512-AhHYqwvN62NVLp4lObVXGVluiABTHapoB57EyegZVmazN+hhGhLTn3uZbOofoTw4DSDvVCadzzyChXhOAvy8uQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "cacheable": "^2.3.2", + "flatted": "^3.3.3", + "hookified": "^1.15.0" + } + }, + "node_modules/stylelint/node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "license": "ISC", + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/stylelint/node_modules/ignore": { + "version": "7.0.5", + "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz", + "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 4" + } + }, "node_modules/supports-color": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", @@ -8311,6 +9483,49 @@ "node": ">=8" } }, + "node_modules/supports-hyperlinks": { + "version": "4.4.0", + "resolved": "https://registry.npmjs.org/supports-hyperlinks/-/supports-hyperlinks-4.4.0.tgz", + "integrity": "sha512-UKbpT93hN5Nr9go5UY7bopIB9YQlMz9nm/ct4IXt/irb5YRkn9WaqrOBJGZ5Pwvsd5FQzSVeYlGdXoCAPQZrPg==", + "dev": true, + "license": "MIT", + "dependencies": { + "has-flag": "^5.0.1", + "supports-color": "^10.2.2" + }, + "engines": { + "node": ">=20" + }, + "funding": { + "url": "https://github.com/chalk/supports-hyperlinks?sponsor=1" + } + }, + "node_modules/supports-hyperlinks/node_modules/has-flag": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-5.0.1.tgz", + "integrity": "sha512-CsNUt5x9LUdx6hnk/E2SZLsDyvfqANZSUq4+D3D8RzDJ2M+HDTIkF60ibS1vHaK55vzgiZw1bEPFG9yH7l33wA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/supports-hyperlinks/node_modules/supports-color": { + "version": "10.2.2", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-10.2.2.tgz", + "integrity": "sha512-SS+jx45GF1QjgEXQx4NJZV9ImqmO2NPz5FNsIHrsDjh2YsHnawpan7SNQ1o8NuhrbHZy9AZhIoCUiCeaW/C80g==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/chalk/supports-color?sponsor=1" + } + }, "node_modules/supports-preserve-symlinks-flag": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", @@ -8324,6 +9539,98 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/svg-tags": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/svg-tags/-/svg-tags-1.0.0.tgz", + "integrity": "sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==", + "dev": true + }, + "node_modules/table": { + "version": "6.9.0", + "resolved": "https://registry.npmjs.org/table/-/table-6.9.0.tgz", + "integrity": "sha512-9kY+CygyYM6j02t5YFHbNz2FN5QmYGv9zAjVp4lCDjlCw7amdckXlEt/bjMhUIfj4ThGRE4gCUH5+yGnNuPo5A==", + "dev": true, + "license": "BSD-3-Clause", + "dependencies": { + "ajv": "^8.0.1", + "lodash.truncate": "^4.4.2", + "slice-ansi": "^4.0.0", + "string-width": "^4.2.3", + "strip-ansi": "^6.0.1" + }, + "engines": { + "node": ">=10.0.0" + } + }, + "node_modules/table/node_modules/ajv": { + "version": "8.17.1", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz", + "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==", + "dev": true, + "license": "MIT", + "dependencies": { + "fast-deep-equal": "^3.1.3", + "fast-uri": "^3.0.1", + "json-schema-traverse": "^1.0.0", + "require-from-string": "^2.0.2" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/epoberezkin" + } + }, + "node_modules/table/node_modules/ansi-regex": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", + "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, + "node_modules/table/node_modules/emoji-regex": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", + "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==", + "dev": true, + "license": "MIT" + }, + "node_modules/table/node_modules/json-schema-traverse": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz", + "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==", + "dev": true, + "license": "MIT" + }, + "node_modules/table/node_modules/string-width": { + "version": "4.2.3", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", + "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", + "dev": true, + "license": "MIT", + "dependencies": { + "emoji-regex": "^8.0.0", + "is-fullwidth-code-point": "^3.0.0", + "strip-ansi": "^6.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/table/node_modules/strip-ansi": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", + "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-regex": "^5.0.1" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/tiny-invariant": { "version": "1.3.3", "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz", @@ -8547,6 +9854,19 @@ "dev": true, "license": "MIT" }, + "node_modules/unicorn-magic": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.4.0.tgz", + "integrity": "sha512-wH590V9VNgYH9g3lH9wWjTrUoKsjLF6sGLjhR4sH1LWpLmCOH0Zf7PukhDA8BiS7KHe4oPNkcTHqYkj7SOGUOw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=20" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/unrs-resolver": { "version": "1.11.1", "resolved": "https://registry.npmjs.org/unrs-resolver/-/unrs-resolver-1.11.1.tgz", @@ -8675,6 +9995,13 @@ "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, + "node_modules/util-deprecate": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", + "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==", + "dev": true, + "license": "MIT" + }, "node_modules/uuid": { "version": "11.1.0", "resolved": "https://registry.npmjs.org/uuid/-/uuid-11.1.0.tgz", @@ -8825,6 +10152,20 @@ "node": ">=0.10.0" } }, + "node_modules/write-file-atomic": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-7.0.0.tgz", + "integrity": "sha512-YnlPC6JqnZl6aO4uRc+dx5PHguiR9S6WeoLtpxNT9wIG+BDya7ZNE1q7KOjVgaA73hKhKLpVPgJ5QA9THQ5BRg==", + "dev": true, + "license": "ISC", + "dependencies": { + "imurmurhash": "^0.1.4", + "signal-exit": "^4.0.1" + }, + "engines": { + "node": "^20.17.0 || >=22.9.0" + } + }, "node_modules/ws": { "version": "8.18.3", "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.3.tgz", diff --git a/package.json b/package.json index e458b71..813ce24 100644 --- a/package.json +++ b/package.json @@ -8,6 +8,7 @@ "build": "next build", "start": "next start", "lint": "eslint .", + "stylelint": "stylelint \"src/**/*.{scss,css}\"", "kill": "fuser -k 5000/tcp" }, "dependencies": { @@ -74,6 +75,9 @@ "eslint-config-next": "^16.1.3", "eslint-plugin-react-hooks": "^7.0.1", "globals": "^16.0.0", + "stylelint": "^17.0.0", + "stylelint-config-standard-scss": "^17.0.0", + "stylelint-scss": "^7.0.0", "typescript": "~5.9.3", "typescript-eslint": "^8.53.1" }, diff --git a/src/app/globals.scss b/src/app/globals.scss index 970d8da..b5164cf 100644 --- a/src/app/globals.scss +++ b/src/app/globals.scss @@ -1,7 +1,7 @@ @use '../styles/abstracts' as *; @use '../styles/utilities/utilities'; @use '../styles/components'; -@use './theme.scss'; +@use './theme'; // Global resets * { @@ -23,7 +23,7 @@ body { background: $background; color: $foreground; - font-family: var(--font-inter), 'Inter', 'Roboto', system-ui, sans-serif; + font-family: var(--font-inter), Inter, Roboto, system-ui, sans-serif; font-size: $font-body-medium; line-height: $line-height-body-medium; letter-spacing: $letter-spacing-body; @@ -150,7 +150,7 @@ body { // Typography base for headings h1, h2, h3, h4, h5, h6 { - font-family: var(--font-inter), 'Inter', 'Roboto', system-ui, sans-serif; + font-family: var(--font-inter), Inter, Roboto, system-ui, sans-serif; font-weight: 400; letter-spacing: $letter-spacing-headline; } @@ -409,7 +409,7 @@ code, pre { content: ''; position: absolute; inset: 0; - background-color: currentColor; + background-color: currentcolor; opacity: 0; transition: opacity $duration-short-4 $easing-standard; pointer-events: none; @@ -438,6 +438,7 @@ code, pre { transform: scale(0); opacity: 0.12; } + to { transform: scale(4); opacity: 0; @@ -456,7 +457,7 @@ code, pre { top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); - background: radial-gradient(circle, currentColor 10%, transparent 10.01%); + background: radial-gradient(circle, currentcolor 10%, transparent 10.01%); opacity: 0; pointer-events: none; border-radius: 50%; @@ -476,6 +477,7 @@ code, pre { height: 0; opacity: 0; } + to { height: var(--radix-accordion-content-height); opacity: 1; @@ -487,6 +489,7 @@ code, pre { height: var(--radix-accordion-content-height); opacity: 1; } + to { height: 0; opacity: 0; @@ -497,6 +500,7 @@ code, pre { from { opacity: 0; } + to { opacity: 1; } @@ -506,6 +510,7 @@ code, pre { from { opacity: 1; } + to { opacity: 0; } @@ -516,6 +521,7 @@ code, pre { opacity: 0; transform: scale(0.8); } + to { opacity: 1; transform: scale(1); @@ -527,6 +533,7 @@ code, pre { opacity: 0; transform: translateY(100%); } + to { opacity: 1; transform: translateY(0); @@ -538,6 +545,7 @@ code, pre { opacity: 0; transform: translateX(100%); } + to { opacity: 1; transform: translateX(0); diff --git a/src/app/theme.scss b/src/app/theme.scss index 5e2e658..371cf1c 100644 --- a/src/app/theme.scss +++ b/src/app/theme.scss @@ -25,22 +25,22 @@ --color-fg-secondary: var(--color-neutral-11); // Background colors - --color-bg: #ffffff; + --color-bg: #fff; --color-bg-inset: var(--color-neutral-2); - --color-bg-overlay: #ffffff; + --color-bg-overlay: #fff; // Focus ring --color-focus-ring: var(--color-accent-9); // Fonts --font-sans-serif: ui-sans-serif, system-ui, sans-serif; - --font-serif: ui-serif, Georgia, serif; - --font-monospace: ui-monospace, 'SF Mono', Monaco, Consolas, monospace; + --font-serif: ui-serif, georgia, serif; + --font-monospace: ui-monospace, 'SF Mono', monaco, consolas, monospace; --font-family: var(--font-sans-serif); } #spark-app.dark-theme { --color-bg: var(--color-neutral-1); - --color-bg-inset: #000000; + --color-bg-inset: #000; --color-bg-overlay: var(--color-neutral-3); } \ No newline at end of file diff --git a/src/components/ui/carousel.tsx b/src/components/ui/carousel.tsx index 0e76744..022c09f 100644 --- a/src/components/ui/carousel.tsx +++ b/src/components/ui/carousel.tsx @@ -96,7 +96,6 @@ function Carousel({ useEffect(() => { if (!api) return - onSelect(api) api.on("reInit", onSelect) api.on("select", onSelect) diff --git a/src/hooks/useSnippetForm.ts b/src/hooks/useSnippetForm.ts index 842b9a5..6eaa3e4 100644 --- a/src/hooks/useSnippetForm.ts +++ b/src/hooks/useSnippetForm.ts @@ -12,6 +12,9 @@ export function useSnippetForm(editingSnippet?: Snippet | null, open?: boolean) const [inputParameters, setInputParameters] = useState([]) const [errors, setErrors] = useState<{ title?: string; code?: string }>({}) + /* eslint-disable react-hooks/set-state-in-effect */ + // This effect hydrates the form when the dialog opens or when a different snippet is selected for editing. + // The state reset is intentional user-facing behavior. useEffect(() => { if (editingSnippet) { setTitle(editingSnippet.title) @@ -32,6 +35,7 @@ export function useSnippetForm(editingSnippet?: Snippet | null, open?: boolean) } setErrors({}) }, [editingSnippet, open]) + /* eslint-enable react-hooks/set-state-in-effect */ const handleAddParameter = () => { setInputParameters((prev) => [ diff --git a/src/styles/abstracts/_mixins.scss b/src/styles/abstracts/_mixins.scss index 1d495f5..5140ad2 100644 --- a/src/styles/abstracts/_mixins.scss +++ b/src/styles/abstracts/_mixins.scss @@ -4,10 +4,9 @@ // Flexbox mixins @mixin flex($direction: row, $justify: flex-start, $align: stretch, $wrap: nowrap) { display: flex; - flex-direction: $direction; + flex-flow: $direction $wrap; justify-content: $justify; align-items: $align; - flex-wrap: $wrap; } @mixin flex-center { @@ -112,6 +111,7 @@ // Responsive breakpoint mixin @mixin respond-to($breakpoint) { $size: fn.breakpoint($breakpoint); + @media (min-width: $size) { @content; } @@ -124,6 +124,7 @@ @include rounded(md); @include font(medium); @include text(sm); + display: inline-flex; align-items: center; justify-content: center; @@ -144,25 +145,26 @@ background: vars.$card; color: vars.$card-foreground; border: 1px solid vars.$border; + @include rounded(lg); @include p(6); } // Shadow mixins @mixin shadow-sm { - box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); + box-shadow: 0 1px 2px 0 rgb(0 0 0 / 5%); } @mixin shadow { - box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); + box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%), 0 1px 2px -1px rgb(0 0 0 / 10%); } @mixin shadow-md { - box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); + box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -2px rgb(0 0 0 / 10%); } @mixin shadow-lg { - box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); + box-shadow: 0 10px 15px -3px rgb(0 0 0 / 10%), 0 4px 6px -4px rgb(0 0 0 / 10%); } // Transition mixin @@ -185,7 +187,7 @@ padding: 0; margin: -1px; overflow: hidden; - clip: rect(0, 0, 0, 0); + clip-path: inset(50%); white-space: nowrap; border-width: 0; } @@ -200,10 +202,7 @@ @mixin absolute-fill { position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; + inset: 0; } // Focus ring diff --git a/src/styles/abstracts/_variables.scss b/src/styles/abstracts/_variables.scss index 9d7b52d..ebac954 100644 --- a/src/styles/abstracts/_variables.scss +++ b/src/styles/abstracts/_variables.scss @@ -5,129 +5,129 @@ // === MD3 Primary Tonal Palette === // Purple/Violet primary color with full tonal range -$md3-primary-0: hsl(260, 50%, 0%); -$md3-primary-10: hsl(260, 50%, 10%); -$md3-primary-20: hsl(260, 50%, 20%); -$md3-primary-25: hsl(260, 50%, 25%); -$md3-primary-30: hsl(260, 50%, 30%); -$md3-primary-35: hsl(260, 50%, 35%); -$md3-primary-40: hsl(260, 50%, 40%); -$md3-primary-50: hsl(260, 50%, 50%); -$md3-primary-60: hsl(260, 50%, 60%); -$md3-primary-70: hsl(260, 50%, 70%); -$md3-primary-80: hsl(260, 50%, 80%); -$md3-primary-90: hsl(260, 50%, 90%); -$md3-primary-95: hsl(260, 50%, 95%); -$md3-primary-99: hsl(260, 50%, 99%); -$md3-primary-100: hsl(260, 50%, 100%); +$md3-primary-0: hsl(260deg 50% 0%); +$md3-primary-10: hsl(260deg 50% 10%); +$md3-primary-20: hsl(260deg 50% 20%); +$md3-primary-25: hsl(260deg 50% 25%); +$md3-primary-30: hsl(260deg 50% 30%); +$md3-primary-35: hsl(260deg 50% 35%); +$md3-primary-40: hsl(260deg 50% 40%); +$md3-primary-50: hsl(260deg 50% 50%); +$md3-primary-60: hsl(260deg 50% 60%); +$md3-primary-70: hsl(260deg 50% 70%); +$md3-primary-80: hsl(260deg 50% 80%); +$md3-primary-90: hsl(260deg 50% 90%); +$md3-primary-95: hsl(260deg 50% 95%); +$md3-primary-99: hsl(260deg 50% 99%); +$md3-primary-100: hsl(260deg 50% 100%); // === MD3 Secondary Tonal Palette === // Desaturated purple for secondary elements -$md3-secondary-0: hsl(260, 15%, 0%); -$md3-secondary-10: hsl(260, 15%, 10%); -$md3-secondary-20: hsl(260, 15%, 20%); -$md3-secondary-25: hsl(260, 15%, 25%); -$md3-secondary-30: hsl(260, 15%, 30%); -$md3-secondary-35: hsl(260, 15%, 35%); -$md3-secondary-40: hsl(260, 15%, 40%); -$md3-secondary-50: hsl(260, 15%, 50%); -$md3-secondary-60: hsl(260, 15%, 60%); -$md3-secondary-70: hsl(260, 15%, 70%); -$md3-secondary-80: hsl(260, 15%, 80%); -$md3-secondary-90: hsl(260, 15%, 90%); -$md3-secondary-95: hsl(260, 15%, 95%); -$md3-secondary-99: hsl(260, 15%, 99%); -$md3-secondary-100: hsl(260, 15%, 100%); +$md3-secondary-0: hsl(260deg 15% 0%); +$md3-secondary-10: hsl(260deg 15% 10%); +$md3-secondary-20: hsl(260deg 15% 20%); +$md3-secondary-25: hsl(260deg 15% 25%); +$md3-secondary-30: hsl(260deg 15% 30%); +$md3-secondary-35: hsl(260deg 15% 35%); +$md3-secondary-40: hsl(260deg 15% 40%); +$md3-secondary-50: hsl(260deg 15% 50%); +$md3-secondary-60: hsl(260deg 15% 60%); +$md3-secondary-70: hsl(260deg 15% 70%); +$md3-secondary-80: hsl(260deg 15% 80%); +$md3-secondary-90: hsl(260deg 15% 90%); +$md3-secondary-95: hsl(260deg 15% 95%); +$md3-secondary-99: hsl(260deg 15% 99%); +$md3-secondary-100: hsl(260deg 15% 100%); // === MD3 Tertiary Tonal Palette === // Cyan/Teal for tertiary accents -$md3-tertiary-0: hsl(180, 50%, 0%); -$md3-tertiary-10: hsl(180, 50%, 10%); -$md3-tertiary-20: hsl(180, 50%, 20%); -$md3-tertiary-25: hsl(180, 50%, 25%); -$md3-tertiary-30: hsl(180, 50%, 30%); -$md3-tertiary-35: hsl(180, 50%, 35%); -$md3-tertiary-40: hsl(180, 50%, 40%); -$md3-tertiary-50: hsl(180, 50%, 50%); -$md3-tertiary-60: hsl(180, 50%, 60%); -$md3-tertiary-70: hsl(180, 50%, 70%); -$md3-tertiary-80: hsl(180, 50%, 80%); -$md3-tertiary-90: hsl(180, 50%, 90%); -$md3-tertiary-95: hsl(180, 50%, 95%); -$md3-tertiary-99: hsl(180, 50%, 99%); -$md3-tertiary-100: hsl(180, 50%, 100%); +$md3-tertiary-0: hsl(180deg 50% 0%); +$md3-tertiary-10: hsl(180deg 50% 10%); +$md3-tertiary-20: hsl(180deg 50% 20%); +$md3-tertiary-25: hsl(180deg 50% 25%); +$md3-tertiary-30: hsl(180deg 50% 30%); +$md3-tertiary-35: hsl(180deg 50% 35%); +$md3-tertiary-40: hsl(180deg 50% 40%); +$md3-tertiary-50: hsl(180deg 50% 50%); +$md3-tertiary-60: hsl(180deg 50% 60%); +$md3-tertiary-70: hsl(180deg 50% 70%); +$md3-tertiary-80: hsl(180deg 50% 80%); +$md3-tertiary-90: hsl(180deg 50% 90%); +$md3-tertiary-95: hsl(180deg 50% 95%); +$md3-tertiary-99: hsl(180deg 50% 99%); +$md3-tertiary-100: hsl(180deg 50% 100%); // === MD3 Error Tonal Palette === -$md3-error-0: hsl(0, 75%, 0%); -$md3-error-10: hsl(0, 75%, 10%); -$md3-error-20: hsl(0, 75%, 20%); -$md3-error-30: hsl(0, 75%, 30%); -$md3-error-40: hsl(0, 75%, 40%); -$md3-error-50: hsl(0, 75%, 50%); -$md3-error-60: hsl(0, 75%, 60%); -$md3-error-70: hsl(0, 75%, 70%); -$md3-error-80: hsl(0, 75%, 80%); -$md3-error-90: hsl(0, 75%, 90%); -$md3-error-95: hsl(0, 75%, 95%); -$md3-error-100: hsl(0, 75%, 100%); +$md3-error-0: hsl(0deg 75% 0%); +$md3-error-10: hsl(0deg 75% 10%); +$md3-error-20: hsl(0deg 75% 20%); +$md3-error-30: hsl(0deg 75% 30%); +$md3-error-40: hsl(0deg 75% 40%); +$md3-error-50: hsl(0deg 75% 50%); +$md3-error-60: hsl(0deg 75% 60%); +$md3-error-70: hsl(0deg 75% 70%); +$md3-error-80: hsl(0deg 75% 80%); +$md3-error-90: hsl(0deg 75% 90%); +$md3-error-95: hsl(0deg 75% 95%); +$md3-error-100: hsl(0deg 75% 100%); // === MD3 Neutral Tonal Palette === // For surfaces and backgrounds -$md3-neutral-0: hsl(260, 10%, 0%); -$md3-neutral-4: hsl(260, 10%, 4%); -$md3-neutral-6: hsl(260, 10%, 6%); -$md3-neutral-10: hsl(260, 10%, 10%); -$md3-neutral-12: hsl(260, 10%, 12%); -$md3-neutral-17: hsl(260, 10%, 17%); -$md3-neutral-20: hsl(260, 10%, 20%); -$md3-neutral-22: hsl(260, 10%, 22%); -$md3-neutral-24: hsl(260, 10%, 24%); -$md3-neutral-25: hsl(260, 10%, 25%); -$md3-neutral-30: hsl(260, 10%, 30%); -$md3-neutral-35: hsl(260, 10%, 35%); -$md3-neutral-40: hsl(260, 10%, 40%); -$md3-neutral-50: hsl(260, 10%, 50%); -$md3-neutral-60: hsl(260, 10%, 60%); -$md3-neutral-70: hsl(260, 10%, 70%); -$md3-neutral-80: hsl(260, 10%, 80%); -$md3-neutral-87: hsl(260, 10%, 87%); -$md3-neutral-90: hsl(260, 10%, 90%); -$md3-neutral-92: hsl(260, 10%, 92%); -$md3-neutral-94: hsl(260, 10%, 94%); -$md3-neutral-95: hsl(260, 10%, 95%); -$md3-neutral-96: hsl(260, 10%, 96%); -$md3-neutral-98: hsl(260, 10%, 98%); -$md3-neutral-99: hsl(260, 10%, 99%); -$md3-neutral-100: hsl(260, 10%, 100%); +$md3-neutral-0: hsl(260deg 10% 0%); +$md3-neutral-4: hsl(260deg 10% 4%); +$md3-neutral-6: hsl(260deg 10% 6%); +$md3-neutral-10: hsl(260deg 10% 10%); +$md3-neutral-12: hsl(260deg 10% 12%); +$md3-neutral-17: hsl(260deg 10% 17%); +$md3-neutral-20: hsl(260deg 10% 20%); +$md3-neutral-22: hsl(260deg 10% 22%); +$md3-neutral-24: hsl(260deg 10% 24%); +$md3-neutral-25: hsl(260deg 10% 25%); +$md3-neutral-30: hsl(260deg 10% 30%); +$md3-neutral-35: hsl(260deg 10% 35%); +$md3-neutral-40: hsl(260deg 10% 40%); +$md3-neutral-50: hsl(260deg 10% 50%); +$md3-neutral-60: hsl(260deg 10% 60%); +$md3-neutral-70: hsl(260deg 10% 70%); +$md3-neutral-80: hsl(260deg 10% 80%); +$md3-neutral-87: hsl(260deg 10% 87%); +$md3-neutral-90: hsl(260deg 10% 90%); +$md3-neutral-92: hsl(260deg 10% 92%); +$md3-neutral-94: hsl(260deg 10% 94%); +$md3-neutral-95: hsl(260deg 10% 95%); +$md3-neutral-96: hsl(260deg 10% 96%); +$md3-neutral-98: hsl(260deg 10% 98%); +$md3-neutral-99: hsl(260deg 10% 99%); +$md3-neutral-100: hsl(260deg 10% 100%); // === MD3 Neutral Variant Tonal Palette === // For outline and surface variants -$md3-neutral-variant-0: hsl(260, 15%, 0%); -$md3-neutral-variant-10: hsl(260, 15%, 10%); -$md3-neutral-variant-20: hsl(260, 15%, 20%); -$md3-neutral-variant-25: hsl(260, 15%, 25%); -$md3-neutral-variant-30: hsl(260, 15%, 30%); -$md3-neutral-variant-35: hsl(260, 15%, 35%); -$md3-neutral-variant-40: hsl(260, 15%, 40%); -$md3-neutral-variant-50: hsl(260, 15%, 50%); -$md3-neutral-variant-60: hsl(260, 15%, 60%); -$md3-neutral-variant-70: hsl(260, 15%, 70%); -$md3-neutral-variant-80: hsl(260, 15%, 80%); -$md3-neutral-variant-90: hsl(260, 15%, 90%); -$md3-neutral-variant-95: hsl(260, 15%, 95%); -$md3-neutral-variant-99: hsl(260, 15%, 99%); -$md3-neutral-variant-100: hsl(260, 15%, 100%); +$md3-neutral-variant-0: hsl(260deg 15% 0%); +$md3-neutral-variant-10: hsl(260deg 15% 10%); +$md3-neutral-variant-20: hsl(260deg 15% 20%); +$md3-neutral-variant-25: hsl(260deg 15% 25%); +$md3-neutral-variant-30: hsl(260deg 15% 30%); +$md3-neutral-variant-35: hsl(260deg 15% 35%); +$md3-neutral-variant-40: hsl(260deg 15% 40%); +$md3-neutral-variant-50: hsl(260deg 15% 50%); +$md3-neutral-variant-60: hsl(260deg 15% 60%); +$md3-neutral-variant-70: hsl(260deg 15% 70%); +$md3-neutral-variant-80: hsl(260deg 15% 80%); +$md3-neutral-variant-90: hsl(260deg 15% 90%); +$md3-neutral-variant-95: hsl(260deg 15% 95%); +$md3-neutral-variant-99: hsl(260deg 15% 99%); +$md3-neutral-variant-100: hsl(260deg 15% 100%); // === MD3 Semantic Colors (Success, Warning, Info) === -$md3-success-40: hsl(145, 60%, 35%); -$md3-success-80: hsl(145, 60%, 75%); -$md3-success-90: hsl(145, 60%, 90%); -$md3-warning-40: hsl(40, 80%, 45%); -$md3-warning-80: hsl(40, 80%, 75%); -$md3-warning-90: hsl(40, 80%, 90%); -$md3-info-40: hsl(210, 70%, 45%); -$md3-info-80: hsl(210, 70%, 75%); -$md3-info-90: hsl(210, 70%, 90%); +$md3-success-40: hsl(145deg 60% 35%); +$md3-success-80: hsl(145deg 60% 75%); +$md3-success-90: hsl(145deg 60% 90%); +$md3-warning-40: hsl(40deg 80% 45%); +$md3-warning-80: hsl(40deg 80% 75%); +$md3-warning-90: hsl(40deg 80% 90%); +$md3-info-40: hsl(210deg 70% 45%); +$md3-info-80: hsl(210deg 70% 75%); +$md3-info-90: hsl(210deg 70% 90%); // ============================================ // MD3 Dark Theme Color Scheme @@ -165,7 +165,6 @@ $on-error-container: $md3-error-90; $background: $md3-neutral-6; $foreground: $md3-neutral-90; $on-background: $md3-neutral-90; - $surface: $md3-neutral-6; $on-surface: $md3-neutral-90; $surface-dim: $md3-neutral-6; @@ -272,7 +271,6 @@ $letter-spacing-label: 0.1px; // ============================================ $radius-factor: 1; $size-scale: 1; - $radius-none: 0; $radius-extra-small: calc(4px * $radius-factor); // MD3 extra-small $radius-small: calc(8px * $radius-factor); // MD3 small @@ -348,9 +346,12 @@ $easing-legacy: cubic-bezier(0.4, 0, 0.2, 1); $size-0: 0px; $size-px: 1px; $size-0-5: calc(0.125rem * $size-scale); // 2px +$size-1-5: calc(0.375rem * $size-scale); // 6px $size-1: calc(0.25rem * $size-scale); // 4px $size-2: calc(0.5rem * $size-scale); // 8px +$size-2-5: calc(0.625rem * $size-scale); // 10px $size-3: calc(0.75rem * $size-scale); // 12px +$size-3-5: calc(0.875rem * $size-scale); // 14px $size-4: calc(1rem * $size-scale); // 16px $size-5: calc(1.25rem * $size-scale); // 20px $size-6: calc(1.5rem * $size-scale); // 24px diff --git a/src/styles/components/_buttons.scss b/src/styles/components/_buttons.scss index f6c0f3b..7a8ad83 100644 --- a/src/styles/components/_buttons.scss +++ b/src/styles/components/_buttons.scss @@ -37,7 +37,7 @@ position: absolute; inset: 0; border-radius: inherit; - background-color: currentColor; + background-color: currentcolor; opacity: 0; transition: opacity $duration-short-4 $easing-standard; pointer-events: none; @@ -253,7 +253,7 @@ position: absolute; inset: 0; border-radius: inherit; - background-color: currentColor; + background-color: currentcolor; opacity: 0; transition: opacity $duration-short-4 $easing-standard; pointer-events: none; @@ -330,7 +330,7 @@ position: absolute; inset: 0; border-radius: inherit; - background-color: currentColor; + background-color: currentcolor; opacity: 0; transition: opacity $duration-short-4 $easing-standard; pointer-events: none; diff --git a/src/styles/components/_dialogs.scss b/src/styles/components/_dialogs.scss index 31f7694..da9acef 100644 --- a/src/styles/components/_dialogs.scss +++ b/src/styles/components/_dialogs.scss @@ -421,6 +421,7 @@ from { opacity: 0; } + to { opacity: 1; } @@ -431,6 +432,7 @@ opacity: 0; transform: translate(-50%, -48%) scale(0.95); } + to { opacity: 1; transform: translate(-50%, -50%) scale(1); @@ -442,6 +444,7 @@ opacity: 0; transform: scale(0.95); } + to { opacity: 1; transform: scale(1); @@ -453,6 +456,7 @@ opacity: 0; transform: translateY(100%); } + to { opacity: 1; transform: translateY(0); diff --git a/src/styles/components/_header.scss b/src/styles/components/_header.scss index 758f204..1d12109 100644 --- a/src/styles/components/_header.scss +++ b/src/styles/components/_header.scss @@ -8,7 +8,7 @@ header { position: sticky; top: 0; z-index: 20; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08); // MD3 elevation-1 + box-shadow: 0 1px 2px rgb(0 0 0 / 8%); // MD3 elevation-1 .container { padding: 1rem 1.5rem; @@ -54,6 +54,7 @@ header { outline-offset: 2px; } } + // Logo styling - Material Design 3 inspired .logo-container { display: flex; @@ -65,13 +66,13 @@ header { width: 2.5rem; height: 2.5rem; border-radius: $radius-xl; // MD3 large shape - background: linear-gradient(135deg, $primary 0%, hsl(260, 45%, 50%) 100%); + background: linear-gradient(135deg, $primary 0%, hsl(260deg 45% 50%) 100%); display: flex; align-items: center; justify-content: center; box-shadow: - 0 1px 2px rgba(0, 0, 0, 0.12), // MD3 elevation-1 - 0 1px 3px rgba(0, 0, 0, 0.08); + 0 1px 2px rgb(0 0 0 / 12%), // MD3 elevation-1 + 0 1px 3px rgb(0 0 0 / 8%); transition: all 0.3s cubic-bezier(0.2, 0, 0, 1); // MD3 emphasized easing svg { @@ -82,8 +83,8 @@ header { &:hover { box-shadow: - 0 2px 4px rgba(0, 0, 0, 0.14), // MD3 elevation-2 - 0 3px 6px rgba(0, 0, 0, 0.10); + 0 2px 4px rgb(0 0 0 / 14%), // MD3 elevation-2 + 0 3px 6px rgb(0 0 0 / 10%); transform: scale(1.02); // Subtle scale instead of translateY } } @@ -92,11 +93,9 @@ header { font-size: 1.25rem; font-weight: 600; // MD3 label-large weight letter-spacing: 0.01em; // MD3 tracking - color: $foreground; // Subtle gradient instead of animated - background: linear-gradient(135deg, $foreground 0%, rgba($accent, 0.8) 100%); - -webkit-background-clip: text; + background: linear-gradient(135deg, $foreground 0%, rgb($accent / 80%) 100%); background-clip: text; color: transparent; } @@ -127,11 +126,12 @@ header { } // Header animations - MD3 style (subtle) -@keyframes fadeInDown { +@keyframes fade-in-down { from { opacity: 0; transform: translateY(-4px); // Less dramatic } + to { opacity: 1; transform: translateY(0); @@ -139,5 +139,5 @@ header { } header { - animation: fadeInDown 0.3s cubic-bezier(0.2, 0, 0, 1); // MD3 easing + animation: fade-in-down 0.3s cubic-bezier(0.2, 0, 0, 1); // MD3 easing } diff --git a/src/styles/components/_typography.scss b/src/styles/components/_typography.scss index 70da68f..a7efafd 100644 --- a/src/styles/components/_typography.scss +++ b/src/styles/components/_typography.scss @@ -2,7 +2,7 @@ // Typography styles h1, h2, h3, h4, h5, h6 { - font-family: var(--font-inter), 'Inter', sans-serif; + font-family: var(--font-inter), Inter, sans-serif; font-weight: 600; line-height: 1.2; color: $foreground; diff --git a/src/styles/utilities/_utilities.scss b/src/styles/utilities/_utilities.scss index 5fd521e..9c609cf 100644 --- a/src/styles/utilities/_utilities.scss +++ b/src/styles/utilities/_utilities.scss @@ -4,88 +4,241 @@ // Utility classes generator @each $name, $value in vars.$spacing { - .p-#{$name} { padding: $value !important; } - .px-#{$name} { padding-left: $value !important; padding-right: $value !important; } - .py-#{$name} { padding-top: $value !important; padding-bottom: $value !important; } - .pt-#{$name} { padding-top: $value !important; } - .pr-#{$name} { padding-right: $value !important; } - .pb-#{$name} { padding-bottom: $value !important; } - .pl-#{$name} { padding-left: $value !important; } - - .m-#{$name} { margin: $value !important; } - .mx-#{$name} { margin-left: $value !important; margin-right: $value !important; } - .my-#{$name} { margin-top: $value !important; margin-bottom: $value !important; } - .mt-#{$name} { margin-top: $value !important; } - .mr-#{$name} { margin-right: $value !important; } - .mb-#{$name} { margin-bottom: $value !important; } - .ml-#{$name} { margin-left: $value !important; } - - .gap-#{$name} { gap: $value !important; } + .p-#{$name} { + padding: $value !important; + } + + .px-#{$name} { + padding-left: $value !important; + padding-right: $value !important; + } + + .py-#{$name} { + padding-top: $value !important; + padding-bottom: $value !important; + } + + .pt-#{$name} { + padding-top: $value !important; + } + + .pr-#{$name} { + padding-right: $value !important; + } + + .pb-#{$name} { + padding-bottom: $value !important; + } + + .pl-#{$name} { + padding-left: $value !important; + } + + .m-#{$name} { + margin: $value !important; + } + + .mx-#{$name} { + margin-left: $value !important; + margin-right: $value !important; + } + + .my-#{$name} { + margin-top: $value !important; + margin-bottom: $value !important; + } + + .mt-#{$name} { + margin-top: $value !important; + } + + .mr-#{$name} { + margin-right: $value !important; + } + + .mb-#{$name} { + margin-bottom: $value !important; + } + + .ml-#{$name} { + margin-left: $value !important; + } + + .gap-#{$name} { + gap: $value !important; + } } // Flexbox utilities -.flex { display: flex !important; } -.inline-flex { display: inline-flex !important; } -.flex-row { flex-direction: row !important; } -.flex-col { flex-direction: column !important; } -.flex-wrap { flex-wrap: wrap !important; } -.flex-nowrap { flex-wrap: nowrap !important; } -.flex-1 { flex: 1 1 0% !important; } +.flex { + display: flex !important; +} + +.inline-flex { + display: inline-flex !important; +} + +.flex-row { + flex-direction: row !important; +} + +.flex-col { + flex-direction: column !important; +} + +.flex-wrap { + flex-wrap: wrap !important; +} + +.flex-nowrap { + flex-wrap: nowrap !important; +} + +.flex-1 { + flex: 1 1 0% !important; +} // Justify content -.justify-start { justify-content: flex-start !important; } -.justify-end { justify-content: flex-end !important; } -.justify-center { justify-content: center !important; } -.justify-between { justify-content: space-between !important; } -.justify-around { justify-content: space-around !important; } +.justify-start { + justify-content: flex-start !important; +} + +.justify-end { + justify-content: flex-end !important; +} + +.justify-center { + justify-content: center !important; +} + +.justify-between { + justify-content: space-between !important; +} + +.justify-around { + justify-content: space-around !important; +} // Align items -.items-start { align-items: flex-start !important; } -.items-end { align-items: flex-end !important; } -.items-center { align-items: center !important; } -.items-stretch { align-items: stretch !important; } +.items-start { + align-items: flex-start !important; +} + +.items-end { + align-items: flex-end !important; +} + +.items-center { + align-items: center !important; +} + +.items-stretch { + align-items: stretch !important; +} // Grid -.grid { display: grid !important; } -.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; } -.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } -.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } -.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } +.grid { + display: grid !important; +} + +.grid-cols-1 { + grid-template-columns: repeat(1, minmax(0, 1fr)) !important; +} + +.grid-cols-2 { + grid-template-columns: repeat(2, minmax(0, 1fr)) !important; +} + +.grid-cols-3 { + grid-template-columns: repeat(3, minmax(0, 1fr)) !important; +} + +.grid-cols-4 { + grid-template-columns: repeat(4, minmax(0, 1fr)) !important; +} // Border radius @each $name, $value in vars.$radius { - .rounded-#{$name} { border-radius: $value !important; } + .rounded-#{$name} { + border-radius: $value !important; + } } // Text sizes @each $name, $value in vars.$font-sizes { - .text-#{$name} { font-size: $value !important; } + .text-#{$name} { + font-size: $value !important; + } } // Font weights @each $name, $value in vars.$font-weights { - .font-#{$name} { font-weight: $value !important; } + .font-#{$name} { + font-weight: $value !important; + } } // Text align -.text-left { text-align: left !important; } -.text-center { text-align: center !important; } -.text-right { text-align: right !important; } +.text-left { + text-align: left !important; +} + +.text-center { + text-align: center !important; +} + +.text-right { + text-align: right !important; +} // Colors -.text-foreground { color: vars.$foreground !important; } -.text-muted-foreground { color: vars.$muted-foreground !important; } -.text-primary { color: vars.$primary !important; } -.text-destructive { color: vars.$destructive !important; } -.text-accent { color: vars.$accent !important; } +.text-foreground { + color: vars.$foreground !important; +} -.bg-background { background-color: vars.$background !important; } -.bg-card { background-color: vars.$card !important; } -.bg-primary { background-color: vars.$primary !important; } -.bg-secondary { background-color: vars.$secondary !important; } -.bg-muted { background-color: vars.$muted !important; } -.bg-accent { background-color: vars.$accent !important; } -.bg-destructive { background-color: vars.$destructive !important; } +.text-muted-foreground { + color: vars.$muted-foreground !important; +} + +.text-primary { + color: vars.$primary !important; +} + +.text-destructive { + color: vars.$destructive !important; +} + +.text-accent { + color: vars.$accent !important; +} + +.bg-background { + background-color: vars.$background !important; +} + +.bg-card { + background-color: vars.$card !important; +} + +.bg-primary { + background-color: vars.$primary !important; +} + +.bg-secondary { + background-color: vars.$secondary !important; +} + +.bg-muted { + background-color: vars.$muted !important; +} + +.bg-accent { + background-color: vars.$accent !important; +} + +.bg-destructive { + background-color: vars.$destructive !important; +} // Border .border { border: 1px solid vars.$border !important; } @@ -138,6 +291,7 @@ // Space between children - DRY loop $space-values: (2, 3, 4, 6, 8); + @each $value in $space-values { .space-y-#{$value} > * + * { margin-top: fn.spacing($value) !important; } .space-x-#{$value} > * + * { margin-left: fn.spacing($value) !important; } @@ -161,26 +315,26 @@ $space-values: (2, 3, 4, 6, 8); padding-left: 1rem; padding-right: 1rem; - @media (min-width: 640px) { + @media (width >= 640px) { max-width: 640px; } - @media (min-width: 768px) { + + @media (width >= 768px) { max-width: 768px; } - @media (min-width: 1024px) { + + @media (width >= 1024px) { max-width: 1024px; } - @media (min-width: 1280px) { + + @media (width >= 1280px) { max-width: 1280px; } } // Additional positioning .inset-0 { - top: 0 !important; - right: 0 !important; - bottom: 0 !important; - left: 0 !important; + inset: 0 !important; } .top-0 { top: 0 !important; } @@ -239,8 +393,7 @@ $space-values: (2, 3, 4, 6, 8); } // Background clip -.bg-clip-text { - -webkit-background-clip: text !important; +.bg-clip-text { background-clip: text !important; } @@ -252,7 +405,7 @@ $space-values: (2, 3, 4, 6, 8); // Shadow variants .shadow-xs { - box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05) !important; + box-shadow: 0 1px 2px 0 rgb(0 0 0 / 5%) !important; } // Underline offset @@ -261,7 +414,9 @@ $space-values: (2, 3, 4, 6, 8); } // Gap variations - only adding those NOT in spacing map -.gap-1\.5 { gap: 0.375rem !important; } // 1.5 spacing not in map +.gap-1-5 { + gap: 0.375rem !important; +} // 1.5 spacing not in map // Rounded variations (additional) .rounded-xs { border-radius: 0.125rem !important; }