From 943ee062fe2c0344165e28f4d612176878159133 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Mon, 21 Jul 2025 16:03:52 +0200 Subject: Consolidating button, action-button and badge; change design to have some 3D components --- package.json | 14 +- pnpm-lock.yaml | 718 +++++++++++++++++++++++++---------- src/_config.defaults.scss | 4 +- src/_core.vars.scss | 14 +- src/objects/_action-button.scss | 16 +- src/objects/_action-button.vars.scss | 176 +++++++-- src/objects/_alert.scss | 16 +- src/objects/_alert.vars.scss | 13 +- src/objects/_card.scss | 47 ++- src/objects/_card.vars.scss | 9 + src/objects/_popover.scss | 10 +- src/objects/_popover.vars.scss | 12 +- tpl/objects/action-button.pug | 14 +- tpl/views/action-button.pug | 68 +++- tpl/views/button.pug | 4 + 15 files changed, 844 insertions(+), 291 deletions(-) diff --git a/package.json b/package.json index cc74db1..c478deb 100644 --- a/package.json +++ b/package.json @@ -16,22 +16,24 @@ "build:style": "sass --load-path=node_modules src_demo/index.scss public/style.css", "lint:style": "stylelint \"src/**/*.scss\"", "fix:style": "stylelint \"src/**/*.scss\" --fix", - "serve": "python -m http.server --bind 127.0.0.1 --directory public 8001" + "serve": "python -m http.server --bind 127.0.0.1 --directory public 8001", + "watch": "nodemon --watch src --watch src_demo --watch tpl -e scss,pug --exec pnpm build" }, "dependencies": { "include-media": "^2.0.0", - "iro-sass": "git+https://git.vulpes.one/git/iro-sass.git#351814a60e8909814c7120db96314a1a25d962bd" + "iro-sass": "git+https://git.vulpes.one/git/iro-sass.git#351814a60e8909814c7120db96314a1a25d962bd", + "nodemon": "^3.1.10" }, "devDependencies": { "iro-icons": "git+https://git.vulpes.one/git/iro-icons.git#8b921f634a565fd9bb8f6e0ddb1b4d7ba207c0a0", "postcss-scss": "^4.0.6", "pug": "^3.0.3", "pug-cli": "^1.0.0-alpha6", - "sass": "^1.79.4", - "stylelint": "^16.9.0", - "stylelint-config-recess-order": "^5.1.1", + "sass": "^1.89.2", + "stylelint": "^16.22.0", + "stylelint-config-recess-order": "^7.1.0", "stylelint-config-sass-guidelines": "^12.1.0", - "stylelint-order": "^6.0.4", + "stylelint-order": "^7.0.0", "svg-sprite": "^2.0.4" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index da001c6..b415623 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -14,13 +14,16 @@ importers: iro-sass: specifier: git+https://git.vulpes.one/git/iro-sass.git#351814a60e8909814c7120db96314a1a25d962bd version: git+https://git.vulpes.one/git/iro-sass.git#351814a60e8909814c7120db96314a1a25d962bd + nodemon: + specifier: ^3.1.10 + version: 3.1.10 devDependencies: iro-icons: specifier: git+https://git.vulpes.one/git/iro-icons.git#8b921f634a565fd9bb8f6e0ddb1b4d7ba207c0a0 version: git+https://git.vulpes.one/git/iro-icons.git#8b921f634a565fd9bb8f6e0ddb1b4d7ba207c0a0(svg-sprite@2.0.4) postcss-scss: specifier: ^4.0.6 - version: 4.0.9(postcss@8.4.38) + version: 4.0.9(postcss@8.5.4) pug: specifier: ^3.0.3 version: 3.0.3 @@ -28,28 +31,28 @@ importers: specifier: ^1.0.0-alpha6 version: 1.0.0-alpha6 sass: - specifier: ^1.79.4 - version: 1.79.4 + specifier: ^1.89.2 + version: 1.89.2 stylelint: - specifier: ^16.9.0 - version: 16.9.0 + specifier: ^16.22.0 + version: 16.22.0 stylelint-config-recess-order: - specifier: ^5.1.1 - version: 5.1.1(stylelint@16.9.0) + specifier: ^7.1.0 + version: 7.1.0(stylelint-order@7.0.0(stylelint@16.22.0))(stylelint@16.22.0) stylelint-config-sass-guidelines: specifier: ^12.1.0 - version: 12.1.0(postcss@8.4.38)(stylelint@16.9.0) + version: 12.1.0(postcss@8.5.4)(stylelint@16.22.0) stylelint-order: - specifier: ^6.0.4 - version: 6.0.4(stylelint@16.9.0) + specifier: ^7.0.0 + version: 7.0.0(stylelint@16.22.0) svg-sprite: specifier: ^2.0.4 version: 2.0.4 packages: - '@babel/code-frame@7.25.7': - resolution: {integrity: sha512-0xZJFNE5XMpENsgfHYTw8FbX4kv53mFLn2i3XPoq69LyhYSCBJtitaHx9QnsVTrsogI4Z3+HtEfZ2/GFPOtf5g==} + '@babel/code-frame@7.27.1': + resolution: {integrity: sha512-cjQ7ZlQ0Mv3b47hABuTevyTuYN4i+loJKGeV9flcCgIK37cCXRh+L1bd3iBHlynerhQ7BhCkn2BPbQUL+rGqFg==} engines: {node: '>=6.9.0'} '@babel/helper-string-parser@7.24.7': @@ -60,12 +63,8 @@ packages: resolution: {integrity: sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w==} engines: {node: '>=6.9.0'} - '@babel/helper-validator-identifier@7.25.7': - resolution: {integrity: sha512-AM6TzwYqGChO45oiuPqwL2t20/HdMC1rTPAesnBCgPCSF1x3oN9MVUwQV2iyz4xqWrctwK5RNC8LV22kaQCNYg==} - engines: {node: '>=6.9.0'} - - '@babel/highlight@7.25.7': - resolution: {integrity: sha512-iYyACpW3iW8Fw+ZybQK+drQre+ns/tKpXbNESfrhNnPLIklLbXr7MYJ6gPEd0iETGLOK+SxMjVvKb/ffmk+FEw==} + '@babel/helper-validator-identifier@7.27.1': + resolution: {integrity: sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==} engines: {node: '>=6.9.0'} '@babel/parser@7.24.7': @@ -87,10 +86,20 @@ packages: peerDependencies: '@csstools/css-tokenizer': ^3.0.1 + '@csstools/css-parser-algorithms@3.0.5': + resolution: {integrity: sha512-DaDeUkXZKjdGhgYaHNJTV9pV7Y9B3b644jCLs9Upc3VeNGg6LWARAT6O+Q+/COo+2gg/bM5rhpMAtf70WqfBdQ==} + engines: {node: '>=18'} + peerDependencies: + '@csstools/css-tokenizer': ^3.0.4 + '@csstools/css-tokenizer@3.0.1': resolution: {integrity: sha512-UBqaiu7kU0lfvaP982/o3khfXccVlHPWp0/vwwiIgDF0GmqqqxoiXC/6FCjlS9u92f7CoEz6nXKQnrn1kIAkOw==} engines: {node: '>=18'} + '@csstools/css-tokenizer@3.0.4': + resolution: {integrity: sha512-Vd/9EVDiu6PPJt9yAh6roZP6El1xHrdvIVGjyBsHR0RYwNHgL7FJPyIIW4fANJNG6FtyZfvlRPpFI4ZM/lubvw==} + engines: {node: '>=18'} + '@csstools/media-query-list-parser@3.0.1': resolution: {integrity: sha512-HNo8gGD02kHmcbX6PvCoUuOQvn4szyB9ca63vZHKX5A81QytgDG4oxG4IaEfHTlEZSZ6MjPEMWIVU+zF2PZcgw==} engines: {node: '>=18'} @@ -98,11 +107,18 @@ packages: '@csstools/css-parser-algorithms': ^3.0.1 '@csstools/css-tokenizer': ^3.0.1 - '@csstools/selector-specificity@4.0.0': - resolution: {integrity: sha512-189nelqtPd8++phaHNwYovKZI0FOzH1vQEE3QhHHkNIGrg5fSs9CbYP3RvfEH5geztnIA9Jwq91wyOIwAW5JIQ==} + '@csstools/media-query-list-parser@4.0.3': + resolution: {integrity: sha512-HAYH7d3TLRHDOUQK4mZKf9k9Ph/m8Akstg66ywKR4SFAigjs3yBiUeZtFxywiTm5moZMAp/5W/ZuFnNXXYLuuQ==} engines: {node: '>=18'} peerDependencies: - postcss-selector-parser: ^6.1.0 + '@csstools/css-parser-algorithms': ^3.0.5 + '@csstools/css-tokenizer': ^3.0.4 + + '@csstools/selector-specificity@5.0.0': + resolution: {integrity: sha512-PCqQV3c4CoVm3kdPhyeZ07VmBRdH2EpMFA/pd9OASpOEC3aXNGoqPDAZ80D0cLpMBxnmk0+yNhGsEx31hq7Gtw==} + engines: {node: '>=18'} + peerDependencies: + postcss-selector-parser: ^7.0.0 '@dabh/diagnostics@2.0.3': resolution: {integrity: sha512-hrlQOIi7hAfzsMqlGSFyVucrx38O+j6wiGOf//H2ecvIEqYN4ADBSS2iLMh5UFyDunCNniUIPk/q3riFv45xRA==} @@ -110,6 +126,9 @@ packages: '@dual-bundle/import-meta-resolve@4.1.0': resolution: {integrity: sha512-+nxncfwHM5SgAtrVzgpzJOI1ol0PkumhVo469KCf9lUi21IGcY90G98VuHm9VRrUypmAzawAHO9bs6hqeADaVg==} + '@keyv/serialize@1.1.0': + resolution: {integrity: sha512-RlDgexML7Z63Q8BSaqhXdCYNBy/JQnqYIwxofUrNLGCblOMHp+xux2Q8nLMLlPpgHQPoU0Do8Z6btCpRBEqZ8g==} + '@nodelib/fs.scandir@2.1.5': resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==} engines: {node: '>= 8'} @@ -122,6 +141,88 @@ packages: resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==} engines: {node: '>= 8'} + '@parcel/watcher-android-arm64@2.5.1': + resolution: {integrity: sha512-KF8+j9nNbUN8vzOFDpRMsaKBHZ/mcjEjMToVMJOhTozkDonQFFrRcfdLWn6yWKCmJKmdVxSgHiYvTCef4/qcBA==} + engines: {node: '>= 10.0.0'} + cpu: [arm64] + os: [android] + + '@parcel/watcher-darwin-arm64@2.5.1': + resolution: {integrity: sha512-eAzPv5osDmZyBhou8PoF4i6RQXAfeKL9tjb3QzYuccXFMQU0ruIc/POh30ePnaOyD1UXdlKguHBmsTs53tVoPw==} + engines: {node: '>= 10.0.0'} + cpu: [arm64] + os: [darwin] + + '@parcel/watcher-darwin-x64@2.5.1': + resolution: {integrity: sha512-1ZXDthrnNmwv10A0/3AJNZ9JGlzrF82i3gNQcWOzd7nJ8aj+ILyW1MTxVk35Db0u91oD5Nlk9MBiujMlwmeXZg==} + engines: {node: '>= 10.0.0'} + cpu: [x64] + os: [darwin] + + '@parcel/watcher-freebsd-x64@2.5.1': + resolution: {integrity: sha512-SI4eljM7Flp9yPuKi8W0ird8TI/JK6CSxju3NojVI6BjHsTyK7zxA9urjVjEKJ5MBYC+bLmMcbAWlZ+rFkLpJQ==} + engines: {node: '>= 10.0.0'} + cpu: [x64] + os: [freebsd] + + '@parcel/watcher-linux-arm-glibc@2.5.1': + resolution: {integrity: sha512-RCdZlEyTs8geyBkkcnPWvtXLY44BCeZKmGYRtSgtwwnHR4dxfHRG3gR99XdMEdQ7KeiDdasJwwvNSF5jKtDwdA==} + engines: {node: '>= 10.0.0'} + cpu: [arm] + os: [linux] + + '@parcel/watcher-linux-arm-musl@2.5.1': + resolution: {integrity: sha512-6E+m/Mm1t1yhB8X412stiKFG3XykmgdIOqhjWj+VL8oHkKABfu/gjFj8DvLrYVHSBNC+/u5PeNrujiSQ1zwd1Q==} + engines: {node: '>= 10.0.0'} + cpu: [arm] + os: [linux] + + '@parcel/watcher-linux-arm64-glibc@2.5.1': + resolution: {integrity: sha512-LrGp+f02yU3BN9A+DGuY3v3bmnFUggAITBGriZHUREfNEzZh/GO06FF5u2kx8x+GBEUYfyTGamol4j3m9ANe8w==} + engines: {node: '>= 10.0.0'} + cpu: [arm64] + os: [linux] + + '@parcel/watcher-linux-arm64-musl@2.5.1': + resolution: {integrity: sha512-cFOjABi92pMYRXS7AcQv9/M1YuKRw8SZniCDw0ssQb/noPkRzA+HBDkwmyOJYp5wXcsTrhxO0zq1U11cK9jsFg==} + engines: {node: '>= 10.0.0'} + cpu: [arm64] + os: [linux] + + '@parcel/watcher-linux-x64-glibc@2.5.1': + resolution: {integrity: sha512-GcESn8NZySmfwlTsIur+49yDqSny2IhPeZfXunQi48DMugKeZ7uy1FX83pO0X22sHntJ4Ub+9k34XQCX+oHt2A==} + engines: {node: '>= 10.0.0'} + cpu: [x64] + os: [linux] + + '@parcel/watcher-linux-x64-musl@2.5.1': + resolution: {integrity: sha512-n0E2EQbatQ3bXhcH2D1XIAANAcTZkQICBPVaxMeaCVBtOpBZpWJuf7LwyWPSBDITb7In8mqQgJ7gH8CILCURXg==} + engines: {node: '>= 10.0.0'} + cpu: [x64] + os: [linux] + + '@parcel/watcher-win32-arm64@2.5.1': + resolution: {integrity: sha512-RFzklRvmc3PkjKjry3hLF9wD7ppR4AKcWNzH7kXR7GUe0Igb3Nz8fyPwtZCSquGrhU5HhUNDr/mKBqj7tqA2Vw==} + engines: {node: '>= 10.0.0'} + cpu: [arm64] + os: [win32] + + '@parcel/watcher-win32-ia32@2.5.1': + resolution: {integrity: sha512-c2KkcVN+NJmuA7CGlaGD1qJh1cLfDnQsHjE89E60vUEMlqduHGCdCLJCID5geFVM0dOtA3ZiIO8BoEQmzQVfpQ==} + engines: {node: '>= 10.0.0'} + cpu: [ia32] + os: [win32] + + '@parcel/watcher-win32-x64@2.5.1': + resolution: {integrity: sha512-9lHBdJITeNR++EvSQVUcaZoWupyHfXe1jZvGZ06O/5MflPcuPLtEphScIBL+AiCWBO46tDSHzWyD0uDmmZqsgA==} + engines: {node: '>= 10.0.0'} + cpu: [x64] + os: [win32] + + '@parcel/watcher@2.5.1': + resolution: {integrity: sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==} + engines: {node: '>= 10.0.0'} + '@resvg/resvg-js-android-arm-eabi@2.6.2': resolution: {integrity: sha512-FrJibrAk6v29eabIPgcTUMPXiEz8ssrAk7TXxsiZzww9UTQ1Z5KAbFJs+Z0Ez+VZTYgnE5IQJqBcoSiMebtPHA==} engines: {node: '>= 10'} @@ -254,22 +355,18 @@ packages: resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==} engines: {node: '>=8'} - ansi-regex@6.1.0: - resolution: {integrity: sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==} - engines: {node: '>=12'} - ansi-styles@2.2.1: resolution: {integrity: sha512-kmCevFghRiWM7HB5zTPULl4r9bVFSWjz62MhqizDGUrq2NWuNMQyuv4tHHoKJHs69M/MF64lEcHdYIocrdWQYA==} engines: {node: '>=0.10.0'} - ansi-styles@3.2.1: - resolution: {integrity: sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==} - engines: {node: '>=4'} - ansi-styles@4.3.0: resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==} engines: {node: '>=8'} + anymatch@3.1.3: + resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==} + engines: {node: '>= 8'} + argparse@2.0.1: resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==} @@ -310,6 +407,10 @@ packages: balanced-match@2.0.0: resolution: {integrity: sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==} + binary-extensions@2.3.0: + resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==} + engines: {node: '>=8'} + boolbase@1.0.0: resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==} @@ -320,6 +421,9 @@ packages: resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==} engines: {node: '>=8'} + cacheable@1.10.2: + resolution: {integrity: sha512-hMkETCRV4hwBAvjQY1/xGw15tlPj+7cM4d5HOlYJJFftLQVRCboVX+mT6AJ6eL0fsqUhSUwDiF+pgfTR2r2Hxg==} + call-bind@1.0.7: resolution: {integrity: sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==} engines: {node: '>= 0.4'} @@ -340,15 +444,15 @@ packages: resolution: {integrity: sha512-U3lRVLMSlsCfjqYPbLyVv11M9CPW4I728d6TCKMAOJueEeB9/8o+eSsMnxPJD+Q+K909sdESg7C+tIkoH6on1A==} engines: {node: '>=0.10.0'} - chalk@2.4.2: - resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==} - engines: {node: '>=4'} - character-parser@2.2.0: resolution: {integrity: sha512-+UqJQjFEFaTAs3bNsF2j2kEN1baG/zghZbdqoYEDxGZtJo9LBzl1A+m0D4n3qKx8N2FNv8/Xp6yV9mQmBuptaw==} - chokidar@4.0.1: - resolution: {integrity: sha512-n8enUVCED/KVRQlab1hr3MVpcVMvxtZjmEa956u+4YijlmQED223XMSYj2tLuKvr4jcCTzNNMpQDUer72MMmzA==} + chokidar@3.6.0: + resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==} + engines: {node: '>= 8.10.0'} + + chokidar@4.0.3: + resolution: {integrity: sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==} engines: {node: '>= 14.16.0'} clean-css@4.2.4: @@ -433,8 +537,8 @@ packages: typescript: optional: true - css-functions-list@3.2.2: - resolution: {integrity: sha512-c+N0v6wbKVxTu5gOBBFkr9BEdBWaqqjQeiJ8QvSRIJOf+UxlJh930m8e6/WNeODIK0mYLFkoONrnj16i2EcvfQ==} + css-functions-list@3.2.3: + resolution: {integrity: sha512-IQOkD3hbR5KrN93MtcYuad6YPuTSUhntLHDuLEbFWE+ff2/XSZNdZG+LcbbIW5AXKg/WFIfYItIzVoHngHXZzA==} engines: {node: '>=12 || >=16'} css-select@4.3.0: @@ -451,6 +555,10 @@ packages: resolution: {integrity: sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==} engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0} + css-tree@3.1.0: + resolution: {integrity: sha512-0eW44TGN5SQXU1mWSkKwFstI/22X2bG1nYzZTYMAWjylYURhse752YgbE4Cx46AC+bAvI+/dYTPRk1LqSUnu6w==} + engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0} + css-what@6.1.0: resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==} engines: {node: '>= 6'} @@ -467,8 +575,8 @@ packages: cssom@0.5.0: resolution: {integrity: sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==} - debug@4.3.7: - resolution: {integrity: sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==} + debug@4.4.1: + resolution: {integrity: sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==} engines: {node: '>=6.0'} peerDependencies: supports-color: '*' @@ -484,6 +592,11 @@ packages: resolution: {integrity: sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==} engines: {node: '>= 0.4'} + detect-libc@1.0.3: + resolution: {integrity: sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==} + engines: {node: '>=0.10'} + hasBin: true + dir-glob@3.0.1: resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==} engines: {node: '>=8'} @@ -543,37 +656,35 @@ packages: fast-deep-equal@3.1.3: resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==} - fast-glob@3.3.2: - resolution: {integrity: sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==} + fast-glob@3.3.3: + resolution: {integrity: sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==} engines: {node: '>=8.6.0'} - fast-uri@3.0.2: - resolution: {integrity: sha512-GR6f0hD7XXyNJa25Tb9BuIdN0tdr+0BMi6/CJPH3wJO1JjNG3n/VsSw38AwRdKZABm8lGbPfakLRkYzx2V9row==} + fast-uri@3.0.6: + resolution: {integrity: sha512-Atfo14OibSv5wAp4VWNsFYE1AchQRTv9cBGWET4pZWHzYshFSS9NQI6I57rdKn9croWVMbYFbLhJ+yJvmZIIHw==} fastest-levenshtein@1.0.16: resolution: {integrity: sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==} engines: {node: '>= 4.9.1'} - fastq@1.17.1: - resolution: {integrity: sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==} + fastq@1.19.1: + resolution: {integrity: sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==} fecha@4.2.3: resolution: {integrity: sha512-OP2IUU6HeYKJi3i0z4A19kHMQoLVs4Hc+DPqqxI2h/DPZHTm/vjsfC6P0b4jCMy14XizLBqvndQ+UilD7707Jw==} - file-entry-cache@9.1.0: - resolution: {integrity: sha512-/pqPFG+FdxWQj+/WSuzXSDaNzxgTLr/OrR1QuqfEZzDakpdYE70PwUxL7BPUa8hpjbvY1+qvCl8k+8Tq34xJgg==} - engines: {node: '>=18'} + file-entry-cache@10.1.1: + resolution: {integrity: sha512-zcmsHjg2B2zjuBgjdnB+9q0+cWcgWfykIcsDkWDB4GTPtl1eXUA+gTI6sO0u01AqK3cliHryTU55/b2Ow1hfZg==} fill-range@7.1.1: resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==} engines: {node: '>=8'} - flat-cache@5.0.0: - resolution: {integrity: sha512-JrqFmyUl2PnPi1OvLyTVHnQvwQ0S+e6lGSwu8OkAZlSaNIZciTY2H/cOOROxsBA1m/LZNHDsqAgDZt6akWcjsQ==} - engines: {node: '>=18'} + flat-cache@6.1.11: + resolution: {integrity: sha512-zfOAns94mp7bHG/vCn9Ru2eDCmIxVQ5dELUHKjHfDEOJmHNzE+uGa6208kfkgmtym4a0FFjEuFksCXFacbVhSg==} - flatted@3.3.1: - resolution: {integrity: sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==} + flatted@3.3.3: + resolution: {integrity: sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==} fn.name@1.1.0: resolution: {integrity: sha512-GRnmB5gPyJpAhTQdSZTSp9uaPSvl09KoYcMQtsB9rQoOmzs9dH6ffeccH+Z+cv6P68Hu5bC6JjRh4Ah/mHSNRw==} @@ -581,6 +692,11 @@ packages: fs.realpath@1.0.0: resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==} + fsevents@2.3.3: + resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==} + engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0} + os: [darwin] + function-bind@1.1.2: resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==} @@ -649,19 +765,29 @@ packages: resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==} engines: {node: '>= 0.4'} + hookified@1.10.0: + resolution: {integrity: sha512-dJw0492Iddsj56U1JsSTm9E/0B/29a1AuoSLRAte8vQg/kaTGF3IgjEWT8c8yG4cC10+HisE1x5QAwR0Xwc+DA==} + html-tags@3.3.1: resolution: {integrity: sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==} engines: {node: '>=8'} + ignore-by-default@1.0.1: + resolution: {integrity: sha512-Ius2VYcGNk7T90CppJqcIkS5ooHUZyIQK+ClZfMfMNFEF9VSE73Fq+906u/CWu92x4gzZMWOwfFYckPObzdEbA==} + ignore@5.3.2: resolution: {integrity: sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==} engines: {node: '>= 4'} - immutable@4.3.7: - resolution: {integrity: sha512-1hqclzwYwjRDFLjcFxOM5AYkkG0rpFPpr1RLPMEuGczoS7YA8gLhy8SWXYRAA/XwfEHpfo3cw5JGioS32fnMRw==} + ignore@7.0.5: + resolution: {integrity: sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==} + engines: {node: '>= 4'} + + immutable@5.1.2: + resolution: {integrity: sha512-qHKXW1q6liAk1Oys6umoaZbDRqjcjgSrbnrifHsfsttza7zcvRAsL7mMV6xWcyhwQy7Xj5v4hhbr6b+iDYwlmQ==} - import-fresh@3.3.0: - resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==} + import-fresh@3.3.1: + resolution: {integrity: sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==} engines: {node: '>=6'} imurmurhash@0.1.4: @@ -698,6 +824,10 @@ packages: is-arrayish@0.3.2: resolution: {integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==} + is-binary-path@2.1.0: + resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==} + engines: {node: '>=8'} + is-buffer@1.1.6: resolution: {integrity: sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==} @@ -758,9 +888,6 @@ packages: resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==} hasBin: true - json-buffer@3.0.1: - resolution: {integrity: sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==} - json-parse-even-better-errors@2.3.1: resolution: {integrity: sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==} @@ -770,8 +897,8 @@ packages: jstransformer@1.0.0: resolution: {integrity: sha512-C9YK3Rf8q6VAPDCCU9fnqo3mAfOH6vUGnMcP4AQAYIEpWtfGLpwOTmZ+igtdK5y+VvI2n3CyYSzy4Qh34eq24A==} - keyv@4.5.4: - resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==} + keyv@5.4.0: + resolution: {integrity: sha512-TMckyVjEoacG5IteUpUrOBsFORtheqziVyyY2dLUwg1jwTb8u48LX4TgmtogkNl9Y9unaEJ1luj10fGyjMGFOQ==} kind-of@3.2.2: resolution: {integrity: sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==} @@ -784,6 +911,9 @@ packages: known-css-properties@0.34.0: resolution: {integrity: sha512-tBECoUqNFbyAY4RrbqsBQqDFpGXAEbdD5QKr8kACx3+rnArmuuR22nKQWKazvp07N9yjTyDZaw/20UIH8tL9DQ==} + known-css-properties@0.37.0: + resolution: {integrity: sha512-JCDrsP4Z1Sb9JwG0aJ8Eo2r7k4Ou5MwmThS/6lcIe1ICyb7UBJKGRIUUdqc2ASdE/42lgz6zFUnzAIhtXnBVrQ==} + kuler@2.0.0: resolution: {integrity: sha512-Xq9nH7KlWZmXAtodXDDRE7vs6DU1gTU8zYDHDiWLSip45Egwq3plLHzPn27NgvzL2r1LMPC1vdqh98sQxtqj4A==} @@ -823,6 +953,9 @@ packages: mdn-data@2.0.30: resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==} + mdn-data@2.12.2: + resolution: {integrity: sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==} + meow@13.2.0: resolution: {integrity: sha512-pxQJQzB6djGPXh08dacEloMFopsOqGVRKFPYvPOt9XDZ1HasbgDZA74CJGreSU4G3Ak7EFJGoiH2auq+yXISgA==} engines: {node: '>=18'} @@ -852,11 +985,19 @@ packages: resolution: {integrity: sha512-71ippSywq5Yb7/tVYyGbkBggbU8H3u5Rz56fH60jGFgr8uHwxs+aSKeqmluIVzM0m0kB7xQjKS6qPfd0b2ZoqQ==} hasBin: true - nanoid@3.3.7: - resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==} + nanoid@3.3.11: + resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==} engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} hasBin: true + node-addon-api@7.1.1: + resolution: {integrity: sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==} + + nodemon@3.1.10: + resolution: {integrity: sha512-WDjw3pJ0/0jMFmyNDp3gvY2YizjLmmOUQo6DEBY+JgdvW/yQ9mEeSw6H5ythl5Ny2ytb7f9C2nIbjSxMNzbJXw==} + engines: {node: '>=10'} + hasBin: true + normalize-path@3.0.0: resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==} engines: {node: '>=0.10.0'} @@ -896,8 +1037,8 @@ packages: picocolors@1.0.1: resolution: {integrity: sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==} - picocolors@1.1.0: - resolution: {integrity: sha512-TQ92mBOW0l3LeMeyLV6mzy/kWr8lkd/hp3mTg7wYK7zJhuBStmGMBG0BdeDZS/dZx1IukaX6Bk11zcln25o1Aw==} + picocolors@1.1.1: + resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==} picomatch@2.3.1: resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==} @@ -925,20 +1066,24 @@ packages: resolution: {integrity: sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==} engines: {node: '>=4'} - postcss-sorting@8.0.2: - resolution: {integrity: sha512-M9dkSrmU00t/jK7rF6BZSZauA5MAaBW4i5EnJXspMwt4iqTh/L9j6fgMnbElEOfyRyfLfVbIHj/R52zHzAPe1Q==} + postcss-selector-parser@7.1.0: + resolution: {integrity: sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==} + engines: {node: '>=4'} + + postcss-sorting@9.1.0: + resolution: {integrity: sha512-Mn8KJ45HNNG6JBpBizXcyf6LqY/qyqetGcou/nprDnFwBFBLGj0j/sNKV2lj2KMOVOwdXu14aEzqJv8CIV6e8g==} peerDependencies: postcss: ^8.4.20 postcss-value-parser@4.2.0: resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==} - postcss@8.4.38: - resolution: {integrity: sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==} + postcss@8.5.4: + resolution: {integrity: sha512-QSa9EBe+uwlGTFmHsPKokv3B/oEMQZxfqW0QqNCyhpa6mB1afzulwn8hihglqAb2pOw+BJgNlmXQ8la2VeHB7w==} engines: {node: ^10 || ^12 || >=14} - postcss@8.4.47: - resolution: {integrity: sha512-56rxCq7G/XfB4EkXq9Egn5GCqugWvDFjafDOThIdMBsI15iqPqR5r15TfSr1YPYeEI19YeaXMCbY6u88Y76GLQ==} + postcss@8.5.6: + resolution: {integrity: sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==} engines: {node: ^10 || ^12 || >=14} prettysize@2.0.0: @@ -950,6 +1095,9 @@ packages: promise@7.3.1: resolution: {integrity: sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==} + pstree.remy@1.1.8: + resolution: {integrity: sha512-77DZwxQmxKnu3aR542U+X8FypNzbfJ+C5XQDk3uWjWxn6151aIMGthWYRXTqT1E5oJvg+ljaa2OJi+VfvCOQ8w==} + pug-attrs@2.0.4: resolution: {integrity: sha512-TaZ4Z2TWUPDJcV3wjU3RtUXMrd3kM4Wzjbe3EWnSsZPsJ3LDI0F3yCnf2/W7PPFF+edUFQ0HgDL1IoxSz5K8EQ==} @@ -1036,9 +1184,13 @@ packages: resolution: {integrity: sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==} engines: {node: '>= 6'} - readdirp@4.0.2: - resolution: {integrity: sha512-yDMz9g+VaZkqBYS/ozoBJwaBhTbZo3UNYQHNRw1D3UFQB8oHB4uS/tAODO+ZLjGWmUbKnIlOWO+aaIiAxrUWHA==} - engines: {node: '>= 14.16.0'} + readdirp@3.6.0: + resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==} + engines: {node: '>=8.10.0'} + + readdirp@4.1.2: + resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==} + engines: {node: '>= 14.18.0'} regenerator-runtime@0.11.1: resolution: {integrity: sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==} @@ -1074,8 +1226,8 @@ packages: resolution: {integrity: sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==} hasBin: true - reusify@1.0.4: - resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==} + reusify@1.1.0: + resolution: {integrity: sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==} engines: {iojs: '>=1.0.0', node: '>=0.10.0'} right-align@0.1.3: @@ -1095,11 +1247,16 @@ packages: resolution: {integrity: sha512-e2bDA2WJT0wxseVd4lsDP4+3ONX6HpMXQa1ZhFQ7SU+GjvORCmShbCMltrtIDfkYhVHrOcPtj+KhmDBdPdZD1g==} engines: {node: '>=10'} - sass@1.79.4: - resolution: {integrity: sha512-K0QDSNPXgyqO4GZq2HO5Q70TLxTH6cIT59RdoCHMivrC8rqzaTw5ab9prjz9KUN1El4FLXrBXJhik61JR4HcGg==} + sass@1.89.2: + resolution: {integrity: sha512-xCmtksBKd/jdJ9Bt9p7nPKiuqrlBMBuuGkQlkhZjjQk3Ty48lv93k5Dq6OPkKt4XwxDJ7tvlfrTa1MPA9bf+QA==} engines: {node: '>=14.0.0'} hasBin: true + semver@7.7.2: + resolution: {integrity: sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==} + engines: {node: '>=10'} + hasBin: true + set-function-length@1.2.2: resolution: {integrity: sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==} engines: {node: '>= 0.4'} @@ -1111,6 +1268,10 @@ packages: simple-swizzle@0.2.2: resolution: {integrity: sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==} + simple-update-notifier@2.0.0: + resolution: {integrity: sha512-a2B9Y0KlNXl9u/vsW6sTIu9vGEpfKu2wRV6l1H3XEas/0gUIzGzBoP/IouTcUQbm9JWZLH3COxyn03TYlFax6w==} + engines: {node: '>=10'} + slash@3.0.0: resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==} engines: {node: '>=8'} @@ -1156,17 +1317,14 @@ packages: resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==} engines: {node: '>=8'} - strip-ansi@7.1.0: - resolution: {integrity: sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==} - engines: {node: '>=12'} - style-search@0.1.0: resolution: {integrity: sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg==} - stylelint-config-recess-order@5.1.1: - resolution: {integrity: sha512-eDAHWVBelzDbMbdMj15pSw0Ycykv5eLeriJdbGCp0zd44yvhgZLI+wyVHegzXp5NrstxTPSxl0fuOVKdMm0XLA==} + stylelint-config-recess-order@7.1.0: + resolution: {integrity: sha512-rFc4Z6SCGgEohr1khsmAZ83X56Tdi2dHY/GB7VT3qJkpKU1V2w+mYlK+b7Za5gpsxEng3jnb4FzWyIl/KTH0AQ==} peerDependencies: - stylelint: '>=16' + stylelint: '>=16.18' + stylelint-order: '>=7' stylelint-config-sass-guidelines@12.1.0: resolution: {integrity: sha512-NTxEtVT6uNSqRvq+A3ScyKhjUrY/Z845TnpWEwnMgIPZ/+/Waa4+51r6OPuQRMu4XZS3D8DK1UaT4TWFBvuuAw==} @@ -1175,10 +1333,11 @@ packages: postcss: ^8.4.21 stylelint: ^16.1.0 - stylelint-order@6.0.4: - resolution: {integrity: sha512-0UuKo4+s1hgQ/uAxlYU4h0o0HS4NiQDud0NAUNI0aa8FJdmYHA5ZZTFHiV5FpmE3071e9pZx5j0QpVJW5zOCUA==} + stylelint-order@7.0.0: + resolution: {integrity: sha512-rSWxx0KscYfxU02wEskKXES9lkRzuuONMMNkZ7SUc6uiF3tDKm7e+sE0Ax/SBlG4TUf1sp1R6f3/SlsPGmzthg==} + engines: {node: '>=20.19.0'} peerDependencies: - stylelint: ^14.0.0 || ^15.0.0 || ^16.0.1 + stylelint: ^16.18.0 stylelint-scss@6.7.0: resolution: {integrity: sha512-RFIa2A+pVWS5wjNT+whtK7wsbZEWazyqesCuSaPbPlZ8lh2TujwVJSnCYJijg6ChZzwI8pZPRZS1L6A9aCbXDg==} @@ -1186,8 +1345,8 @@ packages: peerDependencies: stylelint: ^16.0.2 - stylelint@16.9.0: - resolution: {integrity: sha512-31Nm3WjxGOBGpQqF43o3wO9L5AC36TPIe6030Lnm13H3vDMTcS21DrLh69bMX+DBilKqMMVLian4iG6ybBoNRQ==} + stylelint@16.22.0: + resolution: {integrity: sha512-SVEMTdjKNV4ollUrIY9ordZ36zHv2/PHzPjfPMau370MlL2VYXeLgSNMMiEbLGRO8RmD2R8/BVUeF2DfnfkC0w==} engines: {node: '>=18.12.0'} hasBin: true @@ -1203,8 +1362,8 @@ packages: resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==} engines: {node: '>=8'} - supports-hyperlinks@3.1.0: - resolution: {integrity: sha512-2rn0BZ+/f7puLOHZm1HOJfwBggfaHXUpPUSSG/SWM4TWp5KCfmNYwnC3hruy2rZlMnmWZ+QAGpZfchu3f3695A==} + supports-hyperlinks@3.2.0: + resolution: {integrity: sha512-zFObLMyZeEwzAoKCyu1B91U79K2t7ApXuQfo8OuxwXLDgcKxuwM+YvcbIhm6QWqz7mHUH1TVytR1PwVVjEuMig==} engines: {node: '>=14.18'} supports-preserve-symlinks-flag@1.0.0: @@ -1224,8 +1383,8 @@ packages: engines: {node: '>=10.13.0'} hasBin: true - table@6.8.2: - resolution: {integrity: sha512-w2sfv80nrAh2VCbqR5AK27wswXhqcck2AhfnNW76beQXskGZ1V12GwS//yYVa3d3fcvAip2OUnbDAjW2k3v9fA==} + table@6.9.0: + resolution: {integrity: sha512-9kY+CygyYM6j02t5YFHbNz2FN5QmYGv9zAjVp4lCDjlCw7amdckXlEt/bjMhUIfj4ThGRE4gCUH5+yGnNuPo5A==} engines: {node: '>=10.0.0'} text-hex@1.0.0: @@ -1249,6 +1408,10 @@ packages: token-stream@1.0.0: resolution: {integrity: sha512-VSsyNPPW74RpHwR8Fc21uubwHY7wMDeJLys2IX5zJNih+OnAnaifKHo+1LHT7DAdloQ7apeaaWg8l7qnf/TnEg==} + touch@3.1.1: + resolution: {integrity: sha512-r0eojU4bI8MnHr8c5bNo7lJDdI2qXlWWJk6a9EAFG7vbhTjElYhBVS3/miuE0uOuoLdb8Mc/rVfsmm6eo5o9GA==} + hasBin: true + triple-beam@1.4.1: resolution: {integrity: sha512-aZbgViZrg1QNcG+LULa7nhZpJTZSLm/mXnHXnbAbjmN5aSa0y7V+wvv6+4WaBtpISJzThKy+PIPxc1Nq1EJ9mg==} engines: {node: '>= 14.0.0'} @@ -1261,6 +1424,9 @@ packages: uglify-to-browserify@1.0.2: resolution: {integrity: sha512-vb2s1lYx2xBtUgy+ta+b2J/GLVUR+wmpINwHePmPRhOsIVCG2wDzKJ0n14GslH1BifsqVzSOwQhRaCAsZ/nI4Q==} + undefsafe@2.0.5: + resolution: {integrity: sha512-WxONCrssBM8TSPRqN5EmsjVrsv4A8X12J4ArBiiayv3DyyG3ZlIg6yysuuSYdZsVz3TKcTg2fd//Ujd4CHV1iA==} + util-deprecate@1.0.2: resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==} @@ -1335,23 +1501,17 @@ packages: snapshots: - '@babel/code-frame@7.25.7': + '@babel/code-frame@7.27.1': dependencies: - '@babel/highlight': 7.25.7 - picocolors: 1.1.0 + '@babel/helper-validator-identifier': 7.27.1 + js-tokens: 4.0.0 + picocolors: 1.1.1 '@babel/helper-string-parser@7.24.7': {} '@babel/helper-validator-identifier@7.24.7': {} - '@babel/helper-validator-identifier@7.25.7': {} - - '@babel/highlight@7.25.7': - dependencies: - '@babel/helper-validator-identifier': 7.25.7 - chalk: 2.4.2 - js-tokens: 4.0.0 - picocolors: 1.1.0 + '@babel/helper-validator-identifier@7.27.1': {} '@babel/parser@7.24.7': dependencies: @@ -1369,16 +1529,27 @@ snapshots: dependencies: '@csstools/css-tokenizer': 3.0.1 + '@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4)': + dependencies: + '@csstools/css-tokenizer': 3.0.4 + '@csstools/css-tokenizer@3.0.1': {} + '@csstools/css-tokenizer@3.0.4': {} + '@csstools/media-query-list-parser@3.0.1(@csstools/css-parser-algorithms@3.0.1(@csstools/css-tokenizer@3.0.1))(@csstools/css-tokenizer@3.0.1)': dependencies: '@csstools/css-parser-algorithms': 3.0.1(@csstools/css-tokenizer@3.0.1) '@csstools/css-tokenizer': 3.0.1 - '@csstools/selector-specificity@4.0.0(postcss-selector-parser@6.1.2)': + '@csstools/media-query-list-parser@4.0.3(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)': dependencies: - postcss-selector-parser: 6.1.2 + '@csstools/css-parser-algorithms': 3.0.5(@csstools/css-tokenizer@3.0.4) + '@csstools/css-tokenizer': 3.0.4 + + '@csstools/selector-specificity@5.0.0(postcss-selector-parser@7.1.0)': + dependencies: + postcss-selector-parser: 7.1.0 '@dabh/diagnostics@2.0.3': dependencies: @@ -1388,6 +1559,8 @@ snapshots: '@dual-bundle/import-meta-resolve@4.1.0': {} + '@keyv/serialize@1.1.0': {} + '@nodelib/fs.scandir@2.1.5': dependencies: '@nodelib/fs.stat': 2.0.5 @@ -1398,7 +1571,68 @@ snapshots: '@nodelib/fs.walk@1.2.8': dependencies: '@nodelib/fs.scandir': 2.1.5 - fastq: 1.17.1 + fastq: 1.19.1 + + '@parcel/watcher-android-arm64@2.5.1': + optional: true + + '@parcel/watcher-darwin-arm64@2.5.1': + optional: true + + '@parcel/watcher-darwin-x64@2.5.1': + optional: true + + '@parcel/watcher-freebsd-x64@2.5.1': + optional: true + + '@parcel/watcher-linux-arm-glibc@2.5.1': + optional: true + + '@parcel/watcher-linux-arm-musl@2.5.1': + optional: true + + '@parcel/watcher-linux-arm64-glibc@2.5.1': + optional: true + + '@parcel/watcher-linux-arm64-musl@2.5.1': + optional: true + + '@parcel/watcher-linux-x64-glibc@2.5.1': + optional: true + + '@parcel/watcher-linux-x64-musl@2.5.1': + optional: true + + '@parcel/watcher-win32-arm64@2.5.1': + optional: true + + '@parcel/watcher-win32-ia32@2.5.1': + optional: true + + '@parcel/watcher-win32-x64@2.5.1': + optional: true + + '@parcel/watcher@2.5.1': + dependencies: + detect-libc: 1.0.3 + is-glob: 4.0.3 + micromatch: 4.0.8 + node-addon-api: 7.1.1 + optionalDependencies: + '@parcel/watcher-android-arm64': 2.5.1 + '@parcel/watcher-darwin-arm64': 2.5.1 + '@parcel/watcher-darwin-x64': 2.5.1 + '@parcel/watcher-freebsd-x64': 2.5.1 + '@parcel/watcher-linux-arm-glibc': 2.5.1 + '@parcel/watcher-linux-arm-musl': 2.5.1 + '@parcel/watcher-linux-arm64-glibc': 2.5.1 + '@parcel/watcher-linux-arm64-musl': 2.5.1 + '@parcel/watcher-linux-x64-glibc': 2.5.1 + '@parcel/watcher-linux-x64-musl': 2.5.1 + '@parcel/watcher-win32-arm64': 2.5.1 + '@parcel/watcher-win32-ia32': 2.5.1 + '@parcel/watcher-win32-x64': 2.5.1 + optional: true '@resvg/resvg-js-android-arm-eabi@2.6.2': optional: true @@ -1451,7 +1685,7 @@ snapshots: '@resvg/resvg-js-win32-ia32-msvc': 2.6.2 '@resvg/resvg-js-win32-x64-msvc': 2.6.2 - '@stylistic/stylelint-plugin@3.1.1(stylelint@16.9.0)': + '@stylistic/stylelint-plugin@3.1.1(stylelint@16.22.0)': dependencies: '@csstools/css-parser-algorithms': 3.0.1(@csstools/css-tokenizer@3.0.1) '@csstools/css-tokenizer': 3.0.1 @@ -1460,7 +1694,7 @@ snapshots: postcss-selector-parser: 6.1.2 postcss-value-parser: 4.2.0 style-search: 0.1.0 - stylelint: 16.9.0 + stylelint: 16.22.0 '@trysound/sax@0.2.0': {} @@ -1487,7 +1721,7 @@ snapshots: ajv@8.17.1: dependencies: fast-deep-equal: 3.1.3 - fast-uri: 3.0.2 + fast-uri: 3.0.6 json-schema-traverse: 1.0.0 require-from-string: 2.0.2 @@ -1501,18 +1735,17 @@ snapshots: ansi-regex@5.0.1: {} - ansi-regex@6.1.0: {} - ansi-styles@2.2.1: {} - ansi-styles@3.2.1: - dependencies: - color-convert: 1.9.3 - ansi-styles@4.3.0: dependencies: color-convert: 2.0.1 + anymatch@3.1.3: + dependencies: + normalize-path: 3.0.0 + picomatch: 2.3.1 + argparse@2.0.1: {} array-union@2.1.0: {} @@ -1547,6 +1780,8 @@ snapshots: balanced-match@2.0.0: {} + binary-extensions@2.3.0: {} + boolbase@1.0.0: {} brace-expansion@1.1.11: @@ -1558,6 +1793,11 @@ snapshots: dependencies: fill-range: 7.1.1 + cacheable@1.10.2: + dependencies: + hookified: 1.10.0 + keyv: 5.4.0 + call-bind@1.0.7: dependencies: es-define-property: 1.0.0 @@ -1583,19 +1823,25 @@ snapshots: strip-ansi: 3.0.1 supports-color: 2.0.0 - chalk@2.4.2: - dependencies: - ansi-styles: 3.2.1 - escape-string-regexp: 1.0.5 - supports-color: 5.5.0 - character-parser@2.2.0: dependencies: is-regex: 1.1.4 - chokidar@4.0.1: + chokidar@3.6.0: + dependencies: + anymatch: 3.1.3 + braces: 3.0.3 + glob-parent: 5.1.2 + is-binary-path: 2.1.0 + is-glob: 4.0.3 + normalize-path: 3.0.0 + readdirp: 3.6.0 + optionalDependencies: + fsevents: 2.3.3 + + chokidar@4.0.3: dependencies: - readdirp: 4.0.2 + readdirp: 4.1.2 clean-css@4.2.4: dependencies: @@ -1679,11 +1925,11 @@ snapshots: cosmiconfig@9.0.0: dependencies: env-paths: 2.2.1 - import-fresh: 3.3.0 + import-fresh: 3.3.1 js-yaml: 4.1.0 parse-json: 5.2.0 - css-functions-list@3.2.2: {} + css-functions-list@3.2.3: {} css-select@4.3.0: dependencies: @@ -1705,6 +1951,11 @@ snapshots: mdn-data: 2.0.30 source-map-js: 1.2.1 + css-tree@3.1.0: + dependencies: + mdn-data: 2.12.2 + source-map-js: 1.2.1 + css-what@6.1.0: {} cssesc@3.0.0: {} @@ -1715,9 +1966,11 @@ snapshots: cssom@0.5.0: {} - debug@4.3.7: + debug@4.4.1(supports-color@5.5.0): dependencies: ms: 2.1.3 + optionalDependencies: + supports-color: 5.5.0 decamelize@1.2.0: {} @@ -1727,6 +1980,9 @@ snapshots: es-errors: 1.3.0 gopd: 1.0.1 + detect-libc@1.0.3: + optional: true + dir-glob@3.0.1: dependencies: path-type: 4.0.0 @@ -1777,7 +2033,7 @@ snapshots: fast-deep-equal@3.1.3: {} - fast-glob@3.3.2: + fast-glob@3.3.3: dependencies: '@nodelib/fs.stat': 2.0.5 '@nodelib/fs.walk': 1.2.8 @@ -1785,35 +2041,39 @@ snapshots: merge2: 1.4.1 micromatch: 4.0.8 - fast-uri@3.0.2: {} + fast-uri@3.0.6: {} fastest-levenshtein@1.0.16: {} - fastq@1.17.1: + fastq@1.19.1: dependencies: - reusify: 1.0.4 + reusify: 1.1.0 fecha@4.2.3: {} - file-entry-cache@9.1.0: + file-entry-cache@10.1.1: dependencies: - flat-cache: 5.0.0 + flat-cache: 6.1.11 fill-range@7.1.1: dependencies: to-regex-range: 5.0.1 - flat-cache@5.0.0: + flat-cache@6.1.11: dependencies: - flatted: 3.3.1 - keyv: 4.5.4 + cacheable: 1.10.2 + flatted: 3.3.3 + hookified: 1.10.0 - flatted@3.3.1: {} + flatted@3.3.3: {} fn.name@1.1.0: {} fs.realpath@1.0.0: {} + fsevents@2.3.3: + optional: true + function-bind@1.1.2: {} get-caller-file@2.0.5: {} @@ -1853,7 +2113,7 @@ snapshots: dependencies: array-union: 2.1.0 dir-glob: 3.0.1 - fast-glob: 3.3.2 + fast-glob: 3.3.3 ignore: 5.3.2 merge2: 1.4.1 slash: 3.0.0 @@ -1888,13 +2148,19 @@ snapshots: dependencies: function-bind: 1.1.2 + hookified@1.10.0: {} + html-tags@3.3.1: {} + ignore-by-default@1.0.1: {} + ignore@5.3.2: {} - immutable@4.3.7: {} + ignore@7.0.5: {} + + immutable@5.1.2: {} - import-fresh@3.3.0: + import-fresh@3.3.1: dependencies: parent-module: 1.0.1 resolve-from: 4.0.0 @@ -1922,6 +2188,10 @@ snapshots: is-arrayish@0.3.2: {} + is-binary-path@2.1.0: + dependencies: + binary-extensions: 2.3.0 + is-buffer@1.1.6: {} is-core-module@2.14.0: @@ -1971,8 +2241,6 @@ snapshots: dependencies: argparse: 2.0.1 - json-buffer@3.0.1: {} - json-parse-even-better-errors@2.3.1: {} json-schema-traverse@1.0.0: {} @@ -1982,9 +2250,9 @@ snapshots: is-promise: 2.2.2 promise: 7.3.1 - keyv@4.5.4: + keyv@5.4.0: dependencies: - json-buffer: 3.0.1 + '@keyv/serialize': 1.1.0 kind-of@3.2.2: dependencies: @@ -1994,6 +2262,8 @@ snapshots: known-css-properties@0.34.0: {} + known-css-properties@0.37.0: {} + kuler@2.0.0: {} lazy-cache@1.0.4: {} @@ -2025,6 +2295,8 @@ snapshots: mdn-data@2.0.30: {} + mdn-data@2.12.2: {} + meow@13.2.0: {} merge2@1.4.1: {} @@ -2048,7 +2320,23 @@ snapshots: mustache@4.2.0: {} - nanoid@3.3.7: {} + nanoid@3.3.11: {} + + node-addon-api@7.1.1: + optional: true + + nodemon@3.1.10: + dependencies: + chokidar: 3.6.0 + debug: 4.4.1(supports-color@5.5.0) + ignore-by-default: 1.0.1 + minimatch: 3.1.2 + pstree.remy: 1.1.8 + semver: 7.7.2 + simple-update-notifier: 2.0.0 + supports-color: 5.5.0 + touch: 3.1.1 + undefsafe: 2.0.5 normalize-path@3.0.0: {} @@ -2072,7 +2360,7 @@ snapshots: parse-json@5.2.0: dependencies: - '@babel/code-frame': 7.25.7 + '@babel/code-frame': 7.27.1 error-ex: 1.3.2 json-parse-even-better-errors: 2.3.1 lines-and-columns: 1.2.4 @@ -2085,7 +2373,7 @@ snapshots: picocolors@1.0.1: {} - picocolors@1.1.0: {} + picocolors@1.1.1: {} picomatch@2.3.1: {} @@ -2093,35 +2381,40 @@ snapshots: postcss-resolve-nested-selector@0.1.6: {} - postcss-safe-parser@7.0.1(postcss@8.4.47): + postcss-safe-parser@7.0.1(postcss@8.5.6): dependencies: - postcss: 8.4.47 + postcss: 8.5.6 - postcss-scss@4.0.9(postcss@8.4.38): + postcss-scss@4.0.9(postcss@8.5.4): dependencies: - postcss: 8.4.38 + postcss: 8.5.4 postcss-selector-parser@6.1.2: dependencies: cssesc: 3.0.0 util-deprecate: 1.0.2 - postcss-sorting@8.0.2(postcss@8.4.38): + postcss-selector-parser@7.1.0: + dependencies: + cssesc: 3.0.0 + util-deprecate: 1.0.2 + + postcss-sorting@9.1.0(postcss@8.5.4): dependencies: - postcss: 8.4.38 + postcss: 8.5.4 postcss-value-parser@4.2.0: {} - postcss@8.4.38: + postcss@8.5.4: dependencies: - nanoid: 3.3.7 - picocolors: 1.0.1 + nanoid: 3.3.11 + picocolors: 1.1.1 source-map-js: 1.2.1 - postcss@8.4.47: + postcss@8.5.6: dependencies: - nanoid: 3.3.7 - picocolors: 1.1.0 + nanoid: 3.3.11 + picocolors: 1.1.1 source-map-js: 1.2.1 prettysize@2.0.0: {} @@ -2132,6 +2425,8 @@ snapshots: dependencies: asap: 2.0.6 + pstree.remy@1.1.8: {} + pug-attrs@2.0.4: dependencies: constantinople: 3.1.2 @@ -2293,7 +2588,11 @@ snapshots: string_decoder: 1.3.0 util-deprecate: 1.0.2 - readdirp@4.0.2: {} + readdirp@3.6.0: + dependencies: + picomatch: 2.3.1 + + readdirp@4.1.2: {} regenerator-runtime@0.11.1: {} @@ -2317,7 +2616,7 @@ snapshots: path-parse: 1.0.7 supports-preserve-symlinks-flag: 1.0.0 - reusify@1.0.4: {} + reusify@1.1.0: {} right-align@0.1.3: dependencies: @@ -2333,11 +2632,15 @@ snapshots: safe-stable-stringify@2.4.3: {} - sass@1.79.4: + sass@1.89.2: dependencies: - chokidar: 4.0.1 - immutable: 4.3.7 + chokidar: 4.0.3 + immutable: 5.1.2 source-map-js: 1.2.1 + optionalDependencies: + '@parcel/watcher': 2.5.1 + + semver@7.7.2: {} set-function-length@1.2.2: dependencies: @@ -2354,6 +2657,10 @@ snapshots: dependencies: is-arrayish: 0.3.2 + simple-update-notifier@2.0.0: + dependencies: + semver: 7.7.2 + slash@3.0.0: {} slice-ansi@4.0.0: @@ -2394,32 +2701,28 @@ snapshots: dependencies: ansi-regex: 5.0.1 - strip-ansi@7.1.0: - dependencies: - ansi-regex: 6.1.0 - style-search@0.1.0: {} - stylelint-config-recess-order@5.1.1(stylelint@16.9.0): + stylelint-config-recess-order@7.1.0(stylelint-order@7.0.0(stylelint@16.22.0))(stylelint@16.22.0): dependencies: - stylelint: 16.9.0 - stylelint-order: 6.0.4(stylelint@16.9.0) + stylelint: 16.22.0 + stylelint-order: 7.0.0(stylelint@16.22.0) - stylelint-config-sass-guidelines@12.1.0(postcss@8.4.38)(stylelint@16.9.0): + stylelint-config-sass-guidelines@12.1.0(postcss@8.5.4)(stylelint@16.22.0): dependencies: - '@stylistic/stylelint-plugin': 3.1.1(stylelint@16.9.0) - postcss: 8.4.38 - postcss-scss: 4.0.9(postcss@8.4.38) - stylelint: 16.9.0 - stylelint-scss: 6.7.0(stylelint@16.9.0) + '@stylistic/stylelint-plugin': 3.1.1(stylelint@16.22.0) + postcss: 8.5.4 + postcss-scss: 4.0.9(postcss@8.5.4) + stylelint: 16.22.0 + stylelint-scss: 6.7.0(stylelint@16.22.0) - stylelint-order@6.0.4(stylelint@16.9.0): + stylelint-order@7.0.0(stylelint@16.22.0): dependencies: - postcss: 8.4.38 - postcss-sorting: 8.0.2(postcss@8.4.38) - stylelint: 16.9.0 + postcss: 8.5.4 + postcss-sorting: 9.1.0(postcss@8.5.4) + stylelint: 16.22.0 - stylelint-scss@6.7.0(stylelint@16.9.0): + stylelint-scss@6.7.0(stylelint@16.22.0): dependencies: css-tree: 2.3.1 is-plain-object: 5.0.0 @@ -2428,48 +2731,47 @@ snapshots: postcss-resolve-nested-selector: 0.1.6 postcss-selector-parser: 6.1.2 postcss-value-parser: 4.2.0 - stylelint: 16.9.0 + stylelint: 16.22.0 - stylelint@16.9.0: + stylelint@16.22.0: dependencies: - '@csstools/css-parser-algorithms': 3.0.1(@csstools/css-tokenizer@3.0.1) - '@csstools/css-tokenizer': 3.0.1 - '@csstools/media-query-list-parser': 3.0.1(@csstools/css-parser-algorithms@3.0.1(@csstools/css-tokenizer@3.0.1))(@csstools/css-tokenizer@3.0.1) - '@csstools/selector-specificity': 4.0.0(postcss-selector-parser@6.1.2) + '@csstools/css-parser-algorithms': 3.0.5(@csstools/css-tokenizer@3.0.4) + '@csstools/css-tokenizer': 3.0.4 + '@csstools/media-query-list-parser': 4.0.3(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4) + '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.0) '@dual-bundle/import-meta-resolve': 4.1.0 balanced-match: 2.0.0 colord: 2.9.3 cosmiconfig: 9.0.0 - css-functions-list: 3.2.2 - css-tree: 2.3.1 - debug: 4.3.7 - fast-glob: 3.3.2 + css-functions-list: 3.2.3 + css-tree: 3.1.0 + debug: 4.4.1(supports-color@5.5.0) + fast-glob: 3.3.3 fastest-levenshtein: 1.0.16 - file-entry-cache: 9.1.0 + file-entry-cache: 10.1.1 global-modules: 2.0.0 globby: 11.1.0 globjoin: 0.1.4 html-tags: 3.3.1 - ignore: 5.3.2 + ignore: 7.0.5 imurmurhash: 0.1.4 is-plain-object: 5.0.0 - known-css-properties: 0.34.0 + known-css-properties: 0.37.0 mathml-tag-names: 2.1.3 meow: 13.2.0 micromatch: 4.0.8 normalize-path: 3.0.0 - picocolors: 1.1.0 - postcss: 8.4.47 + picocolors: 1.1.1 + postcss: 8.5.6 postcss-resolve-nested-selector: 0.1.6 - postcss-safe-parser: 7.0.1(postcss@8.4.47) - postcss-selector-parser: 6.1.2 + postcss-safe-parser: 7.0.1(postcss@8.5.6) + postcss-selector-parser: 7.1.0 postcss-value-parser: 4.2.0 resolve-from: 5.0.0 string-width: 4.2.3 - strip-ansi: 7.1.0 - supports-hyperlinks: 3.1.0 + supports-hyperlinks: 3.2.0 svg-tags: 1.0.0 - table: 6.8.2 + table: 6.9.0 write-file-atomic: 5.0.1 transitivePeerDependencies: - supports-color @@ -2485,7 +2787,7 @@ snapshots: dependencies: has-flag: 4.0.0 - supports-hyperlinks@3.1.0: + supports-hyperlinks@3.2.0: dependencies: has-flag: 4.0.0 supports-color: 7.2.0 @@ -2524,7 +2826,7 @@ snapshots: picocolors: 1.0.1 stable: 0.1.8 - table@6.8.2: + table@6.9.0: dependencies: ajv: 8.17.1 lodash.truncate: 4.4.2 @@ -2546,6 +2848,8 @@ snapshots: token-stream@1.0.0: {} + touch@3.1.1: {} + triple-beam@1.4.1: {} uglify-js@2.8.29: @@ -2558,6 +2862,8 @@ snapshots: uglify-to-browserify@1.0.2: optional: true + undefsafe@2.0.5: {} + util-deprecate@1.0.2: {} vinyl@2.2.1: diff --git a/src/_config.defaults.scss b/src/_config.defaults.scss index cf23f29..ac20cb9 100644 --- a/src/_config.defaults.scss +++ b/src/_config.defaults.scss @@ -127,7 +127,7 @@ $theme-light: ( )), --constants: ( - --shadow: rgba(#000, .15), + --shadow: rgba(#000, .1), ), ); @@ -182,6 +182,6 @@ $theme-dark: ( )), --constants: ( - --shadow: rgba(#000, .5), + --shadow: rgba(#000, .1), ), ); diff --git a/src/_core.vars.scss b/src/_core.vars.scss index 0a94534..04c0f63 100644 --- a/src/_core.vars.scss +++ b/src/_core.vars.scss @@ -89,11 +89,17 @@ $border-width--thick: props.def(--border-width--thick, 4px) !default; $border-width--medium: props.def(--border-width--medium, 2px) !default; $border-width--thin: props.def(--border-width--thin, 1px) !default; -$shadow--x: props.def(--shadow--x, 0) !default; -$shadow--y: props.def(--shadow--y, 1px) !default; -$shadow--blur: props.def(--shadow--blur, 4px) !default; +$shadow--l1--x: props.def(--shadow--l1--x, 0) !default; +$shadow--l1--y: props.def(--shadow--l1--y, 2px) !default; +$shadow--l1--blur: props.def(--shadow--l1--blur, 3px) !default; +$shadow--l1--grow: props.def(--shadow--l1--grow, -1px) !default; -$rounding: props.def(--rounding, 4px) !default; +$shadow--l2--x: props.def(--shadow--l2--x, 0) !default; +$shadow--l2--y: props.def(--shadow--l2--y, 4px) !default; +$shadow--l2--blur: props.def(--shadow--l2--blur, 8px) !default; +$shadow--l2--grow: props.def(--shadow--l2--grow, -3px) !default; + +$rounding: props.def(--rounding, 8px) !default; $key-focus--outline-width: props.def(--key-focus--outline-width, props.get($border-width--thick)) !default; $key-focus--border-width: props.def(--key-focus--border-width, props.get($border-width--medium)) !default; diff --git a/src/objects/_action-button.scss b/src/objects/_action-button.scss index 1dd4b84..7863f50 100644 --- a/src/objects/_action-button.scss +++ b/src/objects/_action-button.scss @@ -30,6 +30,12 @@ color: props.get($theme, list.join($key, --label-color)...); background-color: props.get($theme, list.join($key, --bg-color)...); border-color: props.get($theme, list.join($key, --border-color)...); + box-shadow: + props.get(vars.$shadow-x) + props.get(vars.$shadow-y) + props.get(vars.$shadow-blur) + props.get(vars.$shadow-grow) + props.get($theme, list.join($key, --shadow-color)...); &:hover, &:focus-visible { @@ -42,6 +48,7 @@ color: props.get($theme, list.join($key, --active --label-color)...); background-color: props.get($theme, list.join($key, --active --bg-color)...); border-color: props.get($theme, list.join($key, --active --border-color)...); + box-shadow: none; } } @@ -56,6 +63,7 @@ color: props.get($theme, list.join($key, --quiet --label-color)...); background-color: transparent; border-color: transparent; + box-shadow: none; &:hover, &:focus-visible { @@ -72,7 +80,7 @@ } } - @include bem.is('selected') { + @include bem.is('selected', 'badge') { color: props.get($theme, list.join($key, --selected --disabled --label-color)...); background-color: props.get($theme, list.join($key, --selected --disabled --bg-color)...); border-color: props.get($theme, list.join($key, --selected --disabled --border-color)...); @@ -98,6 +106,12 @@ } } } + + @include bem.is('badge') { + color: props.get($theme, list.join($key, --selected --label-color)...); + background-color: props.get($theme, list.join($key, --selected --bg-color)...); + border-color: props.get($theme, list.join($key, --selected --border-color)...); + } } @mixin styles { diff --git a/src/objects/_action-button.vars.scss b/src/objects/_action-button.vars.scss index 8c3d510..1a9be25 100644 --- a/src/objects/_action-button.vars.scss +++ b/src/objects/_action-button.vars.scss @@ -4,32 +4,38 @@ @use '../core.vars' as core; $line-height: props.def(--o-action-button--line-height, 1.4) !default; -$pad-i: props.def(--o-action-button--pad-i, props.get(core.$size--150)) !default; -$pad-i-label: props.def(--o-action-button--pad-i-label, props.get(core.$size--50)) !default; -$pad-i-pill: props.def(--o-action-button--pad-i-pill, props.get(core.$size--200)) !default; -$pad-b: props.def(--o-action-button--pad-b, props.get(core.$size--85)) !default; $border-width: props.def(--o-action-button--border-width, props.get(core.$border-width--thin)) !default; $rounding: props.def(--o-action-button--rounding, props.get(core.$rounding)) !default; -$font-size: props.def(--o-action-button--font-size, props.get(core.$font-size--100)) !default; -$pad-i--sm: props.def(--o-action-button--sm--pad-i, props.get(core.$size--100)) !default; +$pad-i--sm: props.def(--o-action-button--sm--pad-i, props.get(core.$size--75)) !default; $pad-i-label--sm: props.def(--o-action-button--sm--pad-i-label, props.get(core.$size--25)) !default; -$pad-i-pill--sm: props.def(--o-action-button--sm--pad-i-pill, props.get(core.$size--150)) !default; +$pad-i-pill--sm: props.def(--o-action-button--sm--pad-i-pill, props.get(core.$size--100)) !default; $pad-b--sm: props.def(--o-action-button--sm--pad-b, props.get(core.$size--40)) !default; $font-size--sm: props.def(--o-action-button--sm--font-size, props.get(core.$font-size--75)) !default; -$pad-i--lg: props.def(--o-action-button--lg--pad-i, props.get(core.$size--175)) !default; -$pad-i-label--lg: props.def(--o-action-button--lg--pad-i-label, props.get(core.$size--100)) !default; -$pad-i-pill--lg: props.def(--o-action-button--lg--pad-i-pill, props.get(core.$size--250)) !default; +$pad-i: props.def(--o-action-button--pad-i, props.get(core.$size--100)) !default; +$pad-i-label: props.def(--o-action-button--pad-i-label, props.get(core.$size--50)) !default; +$pad-i-pill: props.def(--o-action-button--pad-i-pill, props.get(core.$size--150)) !default; +$pad-b: props.def(--o-action-button--pad-b, props.get(core.$size--85)) !default; +$font-size: props.def(--o-action-button--font-size, props.get(core.$font-size--100)) !default; + +$pad-i--lg: props.def(--o-action-button--lg--pad-i, props.get(core.$size--150)) !default; +$pad-i-label--lg: props.def(--o-action-button--lg--pad-i-label, props.get(core.$size--75)) !default; +$pad-i-pill--lg: props.def(--o-action-button--lg--pad-i-pill, props.get(core.$size--175)) !default; $pad-b--lg: props.def(--o-action-button--lg--pad-b, props.get(core.$size--115)) !default; $font-size--lg: props.def(--o-action-button--lg--font-size, props.get(core.$font-size--150)) !default; -$pad-i--xl: props.def(--o-action-button--xl--pad-i, props.get(core.$size--225)) !default; -$pad-i-label--xl: props.def(--o-action-button--xl--pad-i-label, props.get(core.$size--150)) !default; -$pad-i-pill--xl: props.def(--o-action-button--xl--pad-i-pill, props.get(core.$size--300)) !default; +$pad-i--xl: props.def(--o-action-button--xl--pad-i, props.get(core.$size--175)) !default; +$pad-i-label--xl: props.def(--o-action-button--xl--pad-i-label, props.get(core.$size--100)) !default; +$pad-i-pill--xl: props.def(--o-action-button--xl--pad-i-pill, props.get(core.$size--225)) !default; $pad-b--xl: props.def(--o-action-button--xl--pad-b, props.get(core.$size--150)) !default; $font-size--xl: props.def(--o-action-button--xl--font-size, props.get(core.$font-size--200)) !default; +$shadow-x: props.def(--o-action-button--shadow-x, props.get(core.$shadow--l1--x)) !default; +$shadow-y: props.def(--o-action-button--shadow-y, props.get(core.$shadow--l1--y)) !default; +$shadow-blur: props.def(--o-action-button--shadow-blur, props.get(core.$shadow--l1--blur)) !default; +$shadow-grow: props.def(--o-action-button--shadow-grow, props.get(core.$shadow--l1--grow)) !default; + $key-focus--border-width: props.def(--o-action-button--key-focus--border-width, props.get(core.$key-focus--border-width)) !default; $key-focus--border-offset: props.def(--o-action-button--key-focus--border-offset, props.get(core.$key-focus--border-offset)) !default; $key-focus--outline-width: props.def(--o-action-button--key-focus--outline-width, props.get(core.$key-focus--outline-width)) !default; @@ -44,24 +50,25 @@ $themes: props.def(--o-action-button, (), 'color'); $default-theme-override: () !default; $default-theme: map.deep-merge(( - --bg-color: props.get(core.$theme, --base, --75), - --label-color: props.get(core.$theme, --text), - --border-color: props.get(core.$theme, --border-strong), + --bg-color: props.get(core.$theme, --bg-l2), + --label-color: props.get(core.$theme, --text), + --border-color: props.get(core.$theme, --border-mute) props.get(core.$theme, --border-mute) props.get(core.$theme, --border), + --shadow-color: props.get(core.$theme, --shadow), --hover: ( --bg-color: props.get(core.$theme, --border-mute), --label-color: props.get(core.$theme, --heading), - --border-color: props.get(core.$theme, --text-mute-more), + --border-color: props.get(core.$theme, --border-strong), ), --active: ( --bg-color: props.get(core.$theme, --border), --label-color: props.get(core.$theme, --heading), - --border-color: props.get(core.$theme, --text-mute), + --border-color: props.get(core.$theme, --text-mute-more), ), --disabled: ( - --bg-color: props.get(core.$theme, --bg-l1), + --bg-color: transparent, --label-color: props.get(core.$theme, --border-strong), --border-color: props.get(core.$theme, --border), ), @@ -72,20 +79,20 @@ $default-theme: map.deep-merge(( ), --selected: ( - --bg-color: props.get(core.$theme, --heading), + --bg-color: props.get(core.$theme, --text), --label-color: props.get(core.$theme, --base, --50), - --border-color: props.get(core.$theme, --heading), + --border-color: props.get(core.$theme, --text) props.get(core.$theme, --text) props.get(core.$theme, --heading), --hover: ( - --bg-color: props.get(core.$theme, --text), + --bg-color: props.get(core.$theme, --heading), --label-color: props.get(core.$theme, --base, --50), - --border-color: props.get(core.$theme, --text), + --border-color: props.get(core.$theme, --heading), ), --active: ( - --bg-color: props.get(core.$theme, --text-mute), + --bg-color: props.get(core.$theme, --heading), --label-color: props.get(core.$theme, --base, --50), - --border-color: props.get(core.$theme, --text-mute), + --border-color: props.get(core.$theme, --heading), ), --disabled: ( @@ -115,25 +122,47 @@ $default-theme: map.deep-merge(( ), $default-theme-override) !default; $default-theme: props.def(--o-action-button, $default-theme, 'color'); +$default-theme-dark-override: () !default; +$default-theme-dark: map.deep-merge(( + --bg-color: props.get(core.$theme, --border-mute), + --border-color: props.get(core.$theme, --border-mute), + + --hover: ( + --bg-color: props.get(core.$theme, --border), + --border-color: props.get(core.$theme, --border), + ), + + --active: ( + --bg-color: props.get(core.$theme, --border-strong), + --border-color: props.get(core.$theme, --border-strong), + ), + + --selected: ( + --border-color: props.get(core.$theme, --text), + ), +), $default-theme-override) !default; +$default-theme-dark: props.def(--o-action-button, $default-theme-dark, 'dark'); + @each $theme in map.keys(props.get(core.$transparent-colors)) { $button-theme: --static-#{string.slice($theme, 3)}; $themes: props.merge($themes, ( $button-theme: ( - --bg-color: props.get(core.$transparent-colors, $theme, --100), + --bg-color: props.get(core.$transparent-colors, $theme, --200), --label-color: props.get(core.$transparent-colors, $theme, --900), - --border-color: props.get(core.$transparent-colors, $theme, --400), + --border-color: props.get(core.$transparent-colors, $theme, --300) props.get(core.$transparent-colors, $theme, --300) props.get(core.$transparent-colors, $theme, --400), + --shadow-color: props.get(core.$transparent-colors, --black, --200), --hover: ( --bg-color: props.get(core.$transparent-colors, $theme, --300), --label-color: props.get(core.$transparent-colors, $theme, --900), - --border-color: props.get(core.$transparent-colors, $theme, --500), + --border-color: props.get(core.$transparent-colors, $theme, --400), ), --active: ( --bg-color: props.get(core.$transparent-colors, $theme, --400), --label-color: props.get(core.$transparent-colors, $theme, --900), - --border-color: props.get(core.$transparent-colors, $theme, --600), + --border-color: props.get(core.$transparent-colors, $theme, --500), ), --disabled: ( @@ -150,7 +179,7 @@ $default-theme: props.def(--o-action-button, $default-theme, 'color'); --selected: ( --bg-color: props.get(core.$transparent-colors, $theme, --800), --label-color: props.get(core.$transparent-colors, $theme, --text), - --border-color: props.get(core.$transparent-colors, $theme, --100), + --border-color: props.get(core.$transparent-colors, $theme, --100) props.get(core.$transparent-colors, $theme, --100) props.get(core.$transparent-colors, $theme, --200), --hover: ( --bg-color: props.get(core.$transparent-colors, $theme, --900), @@ -175,12 +204,12 @@ $default-theme: props.def(--o-action-button, $default-theme, 'color'); --label-color: props.get(core.$transparent-colors, $theme, --900), --hover: ( - --bg-color: props.get(core.$transparent-colors, $theme, --300), + --bg-color: props.get(core.$transparent-colors, $theme, --200), --label-color: props.get(core.$transparent-colors, $theme, --900), ), --active: ( - --bg-color: props.get(core.$transparent-colors, $theme, --400), + --bg-color: props.get(core.$transparent-colors, $theme, --300), --label-color: props.get(core.$transparent-colors, $theme, --900), ), @@ -191,3 +220,86 @@ $default-theme: props.def(--o-action-button, $default-theme, 'color'); ) )); } + +$themes-config: ( + accent: --accent, + positive: --positive, + negative: --negative, + warning: --warning, +) !default; + +@each $theme, $key in $themes-config { + $themes: props.merge($themes, ( + --#{$theme}: ( + --bg-color: props.get(core.$theme, $key, --200), + --label-color: props.get(core.$theme, $key, --1100), + --border-color: props.get(core.$theme, $key, --500) props.get(core.$theme, $key, --500) props.get(core.$theme, $key, --600), + --shadow-color: props.get(core.$theme, $key, --200), + + --hover: ( + --bg-color: props.get(core.$theme, $key, --300), + --label-color: props.get(core.$theme, $key, --1200), + --border-color: props.get(core.$theme, $key, --600), + ), + + --active: ( + --bg-color: props.get(core.$theme, $key, --400), + --label-color: props.get(core.$theme, $key, --1300), + --border-color: props.get(core.$theme, $key, --800), + ), + + --disabled: ( + --bg-color: props.get(core.$theme, --bg-l1), + --label-color: props.get(core.$theme, --border-strong), + --border-color: props.get(core.$theme, --border), + ), + + --key-focus: ( + --border-color: props.get(core.$theme, --focus, --border), + --outline-color: props.get(core.$theme, --focus, --outline), + ), + + --selected: ( + --bg-color: props.get(core.$theme, #{$key}-static, --900), + --label-color: props.get(core.$theme, #{$key}-static, --900-text), + --border-color: props.get(core.$theme, #{$key}-static, --900) props.get(core.$theme, #{$key}-static, --900) props.get(core.$theme, #{$key}-static, --1000), + + --hover: ( + --bg-color: props.get(core.$theme, #{$key}-static, --1000), + --label-color: props.get(core.$theme, #{$key}-static, --1000-text), + --border-color: props.get(core.$theme, #{$key}-static, --1000), + ), + + --active: ( + --bg-color: props.get(core.$theme, #{$key}-static, --1100), + --label-color: props.get(core.$theme, #{$key}-static, --1100-text), + --border-color: props.get(core.$theme, #{$key}-static, --1100), + ), + + --disabled: ( + --bg-color: props.get(core.$theme, --border-mute), + --label-color: props.get(core.$theme, --border-strong), + --border-color: props.get(core.$theme, --border-mute), + ), + ), + + --quiet: ( + --label-color: props.get(core.$theme, $key, --1100), + + --hover: ( + --bg-color: props.get(core.$theme, $key, --200), + --label-color: props.get(core.$theme, $key, --1200), + ), + + --active: ( + --bg-color: props.get(core.$theme, $key, --300), + --label-color: props.get(core.$theme, $key, --1300), + ), + + --disabled: ( + --label-color: props.get(core.$theme, --border-strong), + ), + ), + ) + )); +} diff --git a/src/objects/_alert.scss b/src/objects/_alert.scss index 825f7ce..de0e913 100644 --- a/src/objects/_alert.scss +++ b/src/objects/_alert.scss @@ -14,12 +14,26 @@ padding-block: props.get(vars.$pad-b); padding-inline: props.get(vars.$pad-i); background-color: props.get(vars.$bg-color); - border: props.get(vars.$border-width) solid props.get(vars.$border-color); + border: props.get(vars.$border-width) solid transparent; + border-color: props.get(vars.$border-color); border-radius: props.get(vars.$rounding); + box-shadow: + props.get(vars.$shadow-x) + props.get(vars.$shadow-y) + props.get(vars.$shadow-blur) + props.get(vars.$shadow-grow) + props.get(vars.$shadow-color); @each $mod, $theme in vars.$themes-config { @include bem.modifier($mod) { + background-color: props.get(vars.$themes, $theme, --bg-color); border-color: props.get(vars.$themes, $theme, --border-color); + box-shadow: + props.get(vars.$shadow-x) + props.get(vars.$shadow-y) + props.get(vars.$shadow-blur) + props.get(vars.$shadow-grow) + props.get(vars.$themes, $theme, --shadow-color); } } } diff --git a/src/objects/_alert.vars.scss b/src/objects/_alert.vars.scss index 53c9e68..f23928d 100644 --- a/src/objects/_alert.vars.scss +++ b/src/objects/_alert.vars.scss @@ -6,8 +6,15 @@ $pad-i: props.def(--o-alert--pad-i, props.get(core.$size--250)) !default; $pad-b: props.def(--o-alert--pad-b, props.get(core.$size--200)) !default; $rounding: props.def(--o-alert--rounding, props.get(core.$rounding)) !default; +$shadow-x: props.def(--o-alert--shadow-x, props.get(core.$shadow--l2--x)) !default; +$shadow-y: props.def(--o-alert--shadow-y, props.get(core.$shadow--l2--y)) !default; +$shadow-blur: props.def(--o-alert--shadow-blur, props.get(core.$shadow--l2--blur)) !default; +$shadow-grow: props.def(--o-alert--shadow-grow, props.get(core.$shadow--l2--grow)) !default; + $bg-color: props.def(--o-alert--bg-color, props.get(core.$theme, --bg-l2), 'color') !default; -$border-color: props.def(--o-alert--border-color, props.get(core.$theme, --text-mute-more), 'color') !default; +$border-color: props.def(--o-alert--border-color, props.get(core.$theme, --text-mute-more) props.get(core.$theme, --text-mute-more) props.get(core.$theme, --text-mute), 'color') !default; + +$shadow-color: props.def(--o-alert--shadow-color, props.get(core.$transparent-colors, --black, --200), 'color') !default; $themes-config: ( accent: --accent, @@ -21,7 +28,9 @@ $themes: props.def(--o-alert, (), 'color'); @each $theme, $key in $themes-config { $themes: props.merge($themes, ( $key: ( - --border-color: props.get(core.$theme, $key, --700), + --bg-color: props.get(core.$theme, --bg-l2), + --border-color: props.get(core.$theme, $key, --700) props.get(core.$theme, $key, --700) props.get(core.$theme, $key, --800), + --shadow-color: props.get(core.$theme, $key, --200), ) )); } diff --git a/src/objects/_card.scss b/src/objects/_card.scss index c87e676..9f70420 100644 --- a/src/objects/_card.scss +++ b/src/objects/_card.scss @@ -14,12 +14,18 @@ position: relative; display: flex; flex-direction: column; - margin: calc(-1 * props.get(vars.$key-focus--border-width)); background-color: props.get(vars.$bg-color); background-clip: content-box; - border: props.get(vars.$key-focus--border-offset) solid transparent; - border-radius: calc(props.get(vars.$rounding) + props.get(vars.$key-focus--border-offset)); + border: 1px solid transparent; + border-color: props.get(vars.$border-color); + border-radius: props.get(vars.$rounding); transition: transform .2s; + box-shadow: + props.get(vars.$shadow-x) + props.get(vars.$shadow-y) + props.get(vars.$shadow-blur) + props.get(vars.$shadow-grow) + props.get(vars.$shadow-color); @include bem.multi('&:link, &:visited, &:enabled', 'modifier' 'interactive') { &:hover, @@ -39,7 +45,10 @@ } &:focus-visible { - outline: props.get(vars.$key-focus--border-color) solid props.get(vars.$key-focus--border-width); + margin: calc(-1 * props.get(vars.$key-focus--border-width)); + border: props.get(vars.$key-focus--border-offset) solid transparent; + border-radius: calc(props.get(vars.$rounding) + props.get(vars.$key-focus--border-offset)); + outline: props.get(vars.$key-focus--border-color) solid props.get(vars.$key-focus--border-width); box-shadow: 0 0 @@ -64,13 +73,13 @@ transition: background-color .2s, transform .2s, opacity .2s; &:first-child { - border-start-start-radius: props.get(vars.$rounding); - border-start-end-radius: props.get(vars.$rounding); + border-start-start-radius: calc(props.get(vars.$rounding) - 1px); + border-start-end-radius: calc(props.get(vars.$rounding) - 1px); } &:last-child { - border-end-start-radius: props.get(vars.$rounding); - border-end-end-radius: props.get(vars.$rounding); + border-end-start-radius: calc(props.get(vars.$rounding) - 1px); + border-end-end-radius: calc(props.get(vars.$rounding) - 1px); } @include bem.next-elem('avatar') { @@ -119,8 +128,8 @@ visibility 0s .2s linear; @include bem.next-elem('image') { - border-start-start-radius: props.get(vars.$rounding); - border-start-end-radius: props.get(vars.$rounding); + border-start-start-radius: calc(props.get(vars.$rounding) - 1px); + border-start-end-radius: calc(props.get(vars.$rounding) - 1px); } } } @@ -148,6 +157,7 @@ margin-inline: 0; background-color: transparent; border: 0; + box-shadow: none; @include bem.multi('&:link, &:visited, &:enabled', 'modifier' 'interactive') { &:hover, @@ -173,6 +183,9 @@ box-shadow: none; @include bem.elem('image') { + margin: calc(-1 * props.get(vars.$key-focus--border-width)); + border: props.get(vars.$key-focus--border-offset) solid transparent; + border-radius: calc(props.get(vars.$rounding) + props.get(vars.$key-focus--border-offset)); background-color: props.get(vars.$quiet--hover--image-color); outline: props.get(vars.$key-focus--border-color) solid props.get(vars.$key-focus--border-width); box-shadow: @@ -188,11 +201,15 @@ @include bem.elem('image') { position: relative; - margin: calc(-1 * props.get(vars.$key-focus--border-width)); background-color: props.get(vars.$quiet--image-color); background-clip: padding-box; - border: props.get(vars.$key-focus--border-offset) solid transparent; - border-radius: calc(props.get(vars.$rounding) + props.get(vars.$key-focus--border-offset)); + border-radius: props.get(vars.$rounding); + box-shadow: + props.get(vars.$shadow-x) + props.get(vars.$shadow-y) + props.get(vars.$shadow-blur) + props.get(vars.$shadow-grow) + props.get(vars.$shadow-color); } @include bem.elem('body') { @@ -220,11 +237,11 @@ &:first-child { border-start-end-radius: 0; - border-end-start-radius: props.get(vars.$rounding); + border-end-start-radius: calc(props.get(vars.$rounding) - 1px); } &:last-child { - border-start-end-radius: props.get(vars.$rounding); + border-start-end-radius: calc(props.get(vars.$rounding) - 1px); border-end-start-radius: 0; } } diff --git a/src/objects/_card.vars.scss b/src/objects/_card.vars.scss index 8adbcde..3859b12 100644 --- a/src/objects/_card.vars.scss +++ b/src/objects/_card.vars.scss @@ -16,7 +16,14 @@ $key-focus--border-width: props.def(--o-card--key-focus--border-width, props.ge $key-focus--border-offset: props.def(--o-card--key-focus--border-offset, props.get(core.$key-focus--border-offset)) !default; $key-focus--outline-width: props.def(--o-card--key-focus--outline-width, props.get(core.$key-focus--outline-width)) !default; +$shadow-x: props.def(--o-card--shadow-x, props.get(core.$shadow--l2--x)) !default; +$shadow-y: props.def(--o-card--shadow-y, props.get(core.$shadow--l2--y)) !default; +$shadow-blur: props.def(--o-card--shadow-blur, props.get(core.$shadow--l2--blur)) !default; +$shadow-grow: props.def(--o-card--shadow-grow, props.get(core.$shadow--l2--grow)) !default; + +$shadow-color: props.def(--o-card--shadow-color, props.get(core.$theme, --shadow), 'color') !default; $bg-color: props.def(--o-card--bg-color, props.get(core.$theme, --bg-l2), 'color') !default; +$border-color: props.def(--o-card--border-color, props.get(core.$theme, --border-mute) props.get(core.$theme, --border-mute) props.get(core.$theme, --border), 'color') !default; $divider-color: props.def(--o-card--divider-color, props.get(core.$theme, --border-mute), 'color') !default; $key-focus--label-color: props.def(--o-card--key-focus--label-color, props.get(core.$theme, --focus, --text), 'color') !default; @@ -25,3 +32,5 @@ $key-focus--outline-color: props.def(--o-card--key-focus--outline-color, props.g $quiet--image-color: props.def(--o-card--quiet--image-color, props.get(core.$theme, --bg-base), 'color') !default; $quiet--hover--image-color: props.def(--o-card--quiet--hover--image-color, props.get(core.$theme, --border), 'color') !default; + +$border-color-dark: props.def(--o-card--border-color, props.get(core.$theme, --border-mute), 'dark') !default; diff --git a/src/objects/_popover.scss b/src/objects/_popover.scss index 3fe6310..4356dff 100644 --- a/src/objects/_popover.scss +++ b/src/objects/_popover.scss @@ -19,10 +19,16 @@ margin: 0; color: currentColor; background-color: props.get(vars.$bg-color); - filter: props.get(vars.$filter); - border: props.get(vars.$border-width) solid props.get(vars.$border-color); + border: props.get(vars.$border-width) solid transparent; + border-color: props.get(vars.$border-color); border-radius: props.get(vars.$rounding); transform: translate(var(--x), var(--y)); + box-shadow: + props.get(vars.$shadow-x) + props.get(vars.$shadow-y) + props.get(vars.$shadow-blur) + props.get(vars.$shadow-grow) + props.get(vars.$shadow-color); @include bem.modifier('up-left') { transform: translate(var(--x), calc(var(--y) - 100%)); diff --git a/src/objects/_popover.vars.scss b/src/objects/_popover.vars.scss index b76112e..451cc18 100644 --- a/src/objects/_popover.vars.scss +++ b/src/objects/_popover.vars.scss @@ -9,6 +9,14 @@ $separator-width: props.def(--o-popover--separator-width, props.get(core.$size-- $rounding: props.def(--o-popover--rounding, props.get(core.$rounding)) !default; $border-width: props.def(--o-popover--border-width, props.get(core.$border-width--thin)) !default; +$shadow-x: props.def(--o-popover--shadow-x, props.get(core.$shadow--l2--x)) !default; +$shadow-y: props.def(--o-popover--shadow-y, props.get(core.$shadow--l2--y)) !default; +$shadow-blur: props.def(--o-popover--shadow-blur, props.get(core.$shadow--l2--blur)) !default; +$shadow-grow: props.def(--o-popover--shadow-grow, props.get(core.$shadow--l2--grow)) !default; + $bg-color: props.def(--o-popover--bg-color, props.get(core.$theme, --bg-l2), 'color') !default; -$border-color: props.def(--o-popover--border-color, props.get(core.$theme, --border), 'color') !default; -$filter: props.def(--o-popover--filter, drop-shadow(props.get(core.$shadow--x) props.get(core.$shadow--y) props.get(core.$shadow--blur) props.get(core.$theme, --shadow)), 'color') !default; +$border-color: props.def(--o-popover--border-color, props.get(core.$theme, --border-mute) props.get(core.$theme, --border-mute) props.get(core.$theme, --border), 'color') !default; + +$shadow-color: props.def(--o-popover--shadow-color, props.get(core.$transparent-colors, --black, --200), 'color') !default; + +$border-color-dark: props.def(--o-popover--border-color, props.get(core.$theme, --border-mute), 'dark') !default; diff --git a/tpl/objects/action-button.pug b/tpl/objects/action-button.pug index e9b6fe3..0ab084e 100644 --- a/tpl/objects/action-button.pug +++ b/tpl/objects/action-button.pug @@ -3,12 +3,14 @@ include icon.pug mixin action-button - let classes = { - 'o-action-button': true, - 'u-d-block': attributes.block, - 'o-action-button--quiet': attributes.quiet, - 'o-action-button--pill': attributes.pill, - 'o-action-button--icon': !!attributes.icon && !block, - 'is-selected': attributes.selected + 'o-action-button': true, + 'u-d-block': attributes.block, + 'o-action-button--secondary': attributes.secondary, + 'o-action-button--quiet': attributes.quiet, + 'o-action-button--pill': attributes.pill, + 'o-action-button--badge': attributes.badge, + 'o-action-button--icon': !!attributes.icon && !block, + 'is-selected': attributes.selected, } if (attributes.theme) { classes['o-action-button--' + attributes.theme] = true diff --git a/tpl/views/action-button.pug b/tpl/views/action-button.pug index 8fbf9ea..025bd78 100644 --- a/tpl/views/action-button.pug +++ b/tpl/views/action-button.pug @@ -8,8 +8,8 @@ mixin view-action-button +action-button(size='lg')= 'Idle' = ' ' +action-button(size='xl')= 'Idle' - - .c-box + br + br +action-button(icon='trash' size='sm') = ' ' +action-button(icon='trash') @@ -17,6 +17,15 @@ mixin view-action-button +action-button(icon='trash' size='lg') = ' ' +action-button(icon='trash' size='xl') + br + br + +action-button(icon='user' size='sm')= 'Idle' + = ' ' + +action-button(icon='user')= 'Idle' + = ' ' + +action-button(icon='user' size='lg')= 'Idle' + = ' ' + +action-button(icon='user' size='xl')= 'Idle' .c-box +action-button(pill=true size='sm')= 'Idle' @@ -26,8 +35,8 @@ mixin view-action-button +action-button(pill=true size='lg')= 'Idle' = ' ' +action-button(pill=true size='xl')= 'Idle' - - .c-box + br + br +action-button(pill=true icon='trash' size='sm') = ' ' +action-button(pill=true icon='trash') @@ -35,6 +44,15 @@ mixin view-action-button +action-button(pill=true icon='trash' size='lg') = ' ' +action-button(pill=true icon='trash' size='xl') + br + br + +action-button(pill=true icon='user' size='sm')= 'Idle' + = ' ' + +action-button(pill=true icon='user')= 'Idle' + = ' ' + +action-button(pill=true icon='user' size='lg')= 'Idle' + = ' ' + +action-button(pill=true icon='user' size='xl')= 'Idle' .c-box +action-button= 'Label' @@ -42,8 +60,15 @@ mixin view-action-button +action-button(icon='trash')= 'Label' = ' ' +action-button(icon='trash') - - .c-box + br + br + +action-button(secondary=true)= 'Label' + = ' ' + +action-button(secondary=true icon='trash')= 'Label' + = ' ' + +action-button(secondary=true icon='trash') + br + br +action-button(quiet=true)= 'Label' = ' ' +action-button(quiet=true icon='trash')= 'Label' @@ -58,8 +83,8 @@ mixin view-action-button +action-button(disabled=true)= 'Disabled' = ' ' +action-button(selected=true disabled=true)= 'Selected + disabled' - - .c-box + br + br +action-button(quiet=true )= 'Idle' = ' ' +action-button(quiet=true selected=true)= 'Selected' @@ -76,8 +101,8 @@ mixin view-action-button +action-button(pill=true disabled=true)= 'Disabled' = ' ' +action-button(pill=true selected=true disabled=true)= 'Selected + disabled' - - .c-box + br + br +action-button(pill=true quiet=true)= 'Idle' = ' ' +action-button(pill=true quiet=true selected=true)= 'Selected' @@ -86,6 +111,25 @@ mixin view-action-button = ' ' +action-button(pill=true quiet=true selected=true disabled=true)= 'Selected + disabled' + each theme, i in ['accent', 'positive', 'negative', 'warning'] + .c-box + +action-button(theme=theme)= 'Idle' + = ' ' + +action-button(theme=theme selected=true)= 'Selected' + = ' ' + +action-button(theme=theme disabled=true)= 'Disabled' + = ' ' + +action-button(theme=theme selected=true disabled=true)= 'Selected + disabled' + br + br + +action-button(theme=theme quiet=true)= 'Idle' + = ' ' + +action-button(theme=theme quiet=true selected=true)= 'Selected' + = ' ' + +action-button(theme=theme quiet=true disabled=true)= 'Disabled' + = ' ' + +action-button(theme=theme quiet=true selected=true disabled=true)= 'Selected + disabled' + each theme in ['static-black', 'static-white'] - const bg = theme.startsWith('static-black') ? 500 : 1000; @@ -98,8 +142,8 @@ mixin view-action-button +action-button(theme=theme disabled=true)= 'Disabled' = ' ' +action-button(theme=theme selected=true disabled=true)= 'Selected + disabled' - - .c-box(style=`background-color: var(--colors--blue-static--${bg});`) + br + br +action-button(theme=theme quiet=true)= 'Idle' = ' ' +action-button(theme=theme quiet=true selected=true)= 'Selected' diff --git a/tpl/views/button.pug b/tpl/views/button.pug index edd8ef6..da7531b 100644 --- a/tpl/views/button.pug +++ b/tpl/views/button.pug @@ -34,6 +34,7 @@ mixin view-button +a-button(outline=true)= 'Button' +a-button(outline=true disabled=true)= 'Button' br + br .l-button-group +a-button(icon='trash') +a-button(disabled=true icon='trash') @@ -48,6 +49,7 @@ mixin view-button +a-button(variant=theme outline=true)= 'Button' +a-button(variant=theme outline=true disabled=true)= 'Button' br + br .l-button-group +a-button(variant=theme icon='trash') +a-button(variant=theme disabled=true icon='trash') @@ -65,6 +67,7 @@ mixin view-button +a-button(variant=theme outline=true)= 'Button' +a-button(variant=theme outline=true disabled=true)= 'Button' br + br .l-button-group +a-button(variant=theme icon='trash') +a-button(variant=theme disabled=true icon='trash') @@ -78,6 +81,7 @@ mixin view-button +a-button(variant=theme primary=true outline=true)= 'Button' +a-button(variant=theme primary=true outline=true disabled=true)= 'Button' br + br .l-button-group +a-button(variant=theme primary=true icon='trash') +a-button(variant=theme primary=true disabled=true icon='trash') -- cgit v1.2.3-70-g09d2