From e8d5841853c12022534b7b6f356ae6f1ec8e96b9 Mon Sep 17 00:00:00 2001 From: Brian Helba Date: Fri, 30 Sep 2022 16:20:04 -0400 Subject: [PATCH] Use PostCSS instead of SCSS --- .editorconfig | 2 +- tailwind/package.json | 21 +++--- tailwind/src/icons.css | 2 +- tailwind/src/{styles.scss => styles.pcss} | 33 ++++----- tailwind/yarn.lock | 82 ++++------------------- 5 files changed, 41 insertions(+), 99 deletions(-) rename tailwind/src/{styles.scss => styles.pcss} (76%) diff --git a/.editorconfig b/.editorconfig index a0cb1cc..b17ccad 100644 --- a/.editorconfig +++ b/.editorconfig @@ -14,7 +14,7 @@ max_line_length = 100 [*.html] indent_size = 2 -[*.css] +[{*.css,*.pcss}] indent_size = 2 [{*.yml,*.yaml}] diff --git a/tailwind/package.json b/tailwind/package.json index 357a155..8ce461d 100644 --- a/tailwind/package.json +++ b/tailwind/package.json @@ -3,20 +3,20 @@ "private": true, "license": "Apache-2.0", "devDependencies": { - "@parcel/transformer-sass": "2.7.0", "@tailwindcss/forms": "^0.5.3", "daisyui": "^2.31.0", "npm-run-all": "^4.1.5", "parcel": "^2.7.0", "postcss": "^8.4.16", + "postcss-nested": "^5.0.6", "remixicon": "^2.5.0", "rimraf": "^3.0.2", "stylelint": "^14.13.0", - "stylelint-config-sass-guidelines": "^9.0.1", + "stylelint-config-standard": "^28.0.0", "tailwindcss": "^3.1.8" }, "scripts": { - "lint": "stylelint **/*.scss", + "lint": "stylelint src/*", "watch": "parcel watch --no-cache", "build:clean": "rimraf ../auth_style/static/auth_style/dist", "build:compile": "parcel build --no-cache", @@ -25,7 +25,7 @@ "targets": { "styles": { "source": [ - "./src/styles.scss", + "./src/styles.pcss", "./src/icons.css" ], "distDir": "../auth_style/static/auth_style/dist" @@ -33,20 +33,14 @@ }, "browserslist": "> 0.5%", "stylelint": { - "extends": "stylelint-config-sass-guidelines", + "extends": "stylelint-config-standard", "rules": { - "max-nesting-depth": null, - "selector-no-qualifying-type": null, - "scss/at-rule-no-unknown": [ + "at-rule-no-unknown": [ true, { "ignoreAtRules": [ "apply", - "layer", - "responsive", - "screen", - "tailwind", - "variants" + "tailwind" ] } ] @@ -54,6 +48,7 @@ }, "postcss": { "plugins": { + "postcss-nested": {}, "tailwindcss": {} } } diff --git a/tailwind/src/icons.css b/tailwind/src/icons.css index 2175639..260ce3d 100644 --- a/tailwind/src/icons.css +++ b/tailwind/src/icons.css @@ -1 +1 @@ -@import 'npm:remixicon/fonts/remixicon.css'; +@import "npm:remixicon/fonts/remixicon.css"; diff --git a/tailwind/src/styles.scss b/tailwind/src/styles.pcss similarity index 76% rename from tailwind/src/styles.scss rename to tailwind/src/styles.pcss index 4e16d3f..d7bff2e 100644 --- a/tailwind/src/styles.scss +++ b/tailwind/src/styles.pcss @@ -3,8 +3,7 @@ @tailwind utilities; @layer base { - - // Heading Styles + /* Heading Styles */ h1, h2, h3, @@ -37,14 +36,10 @@ h6 { @apply font-semibold text-base text-gray-400 uppercase; } +} - .card-body { - > p { - @apply pb-4; - } - } - - // Form styles +@layer components { + /* Form styles */ form { .errorlist { @apply space-y-1; @@ -62,13 +57,13 @@ } input { - &[type='text'], - &[type='email'], - &[type='password'], - &[type='date'], - &[type='datetime-local'], - &[type='month'], - &[type='number'] { + &[type="text"], + &[type="email"], + &[type="password"], + &[type="date"], + &[type="datetime-local"], + &[type="month"], + &[type="number"] { @apply input input-bordered; } } @@ -78,4 +73,10 @@ } } } + + .card-body { + > p { + @apply pb-4; + } + } } diff --git a/tailwind/yarn.lock b/tailwind/yarn.lock index 4f2bf88..e64bac7 100644 --- a/tailwind/yarn.lock +++ b/tailwind/yarn.lock @@ -676,15 +676,6 @@ "@parcel/utils" "2.7.0" react-refresh "^0.9.0" -"@parcel/transformer-sass@2.7.0": - version "2.7.0" - resolved "https://registry.yarnpkg.com/@parcel/transformer-sass/-/transformer-sass-2.7.0.tgz#651b7a88bbc1ef452ace90ccb0883c1ad8cff721" - integrity sha512-6m2T6Y5eQLX7ckIeuOjXXIZbzhyovnl69AvJ2FujoWb2nA55H/kg6ZdbKjo3CfXkOfg9LyG3nVnOE5PMgMpRFQ== - dependencies: - "@parcel/plugin" "2.7.0" - "@parcel/source-map" "^2.0.0" - sass "^1.38.0" - "@parcel/transformer-svg@2.7.0": version "2.7.0" resolved "https://registry.yarnpkg.com/@parcel/transformer-svg/-/transformer-svg-2.7.0.tgz#c2a7d10bdbc6aeb2ae7ef85db5b583574807071c" @@ -976,7 +967,7 @@ chalk@^4.1.0: ansi-styles "^4.1.0" supports-color "^7.1.0" -"chokidar@>=3.0.0 <4.0.0", chokidar@^3.5.3: +chokidar@^3.5.3: version "3.5.3" resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.3.tgz#1cf37c8707b932bd1af1ae22c0432e2acd1903bd" integrity sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw== @@ -1600,11 +1591,6 @@ ignore@^5.2.0: resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.0.tgz#6d3bac8fa7fe0d45d9f9be7bac2fc279577e345a" integrity sha512-CmxgYGiEPCLhfLnpPp1MoRmifwEIOgjcHXxOBjv7mY96c+eWScsOP9c112ZyLdWHi0FxHjI+4uVhKYp/gcdRmQ== -immutable@^4.0.0: - version "4.1.0" - resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.1.0.tgz#f795787f0db780183307b9eb2091fcac1f6fafef" - integrity sha512-oNkuqVTA8jqG1Q6c+UglTOD1xhC1BtjKI7XkCXRkZHrN5m18/XsnUp8Q89GkQO/z+0WjonSvl0FLhDYftp46nQ== - import-fresh@^3.2.1: version "3.3.0" resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b" @@ -1937,11 +1923,6 @@ lodash.truncate@^4.4.2: resolved "https://registry.yarnpkg.com/lodash.truncate/-/lodash.truncate-4.4.2.tgz#5a350da0b1113b837ecfffd5812cbe58d6eae193" integrity sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw== -lodash@^4.17.21: - version "4.17.21" - resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" - integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== - lru-cache@^6.0.0: version "6.0.0" resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94" @@ -2336,7 +2317,7 @@ postcss-media-query-parser@^0.2.3: resolved "https://registry.yarnpkg.com/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz#27b39c6f4d94f81b1a73b8f76351c609e5cef244" integrity sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig== -postcss-nested@5.0.6: +postcss-nested@5.0.6, postcss-nested@^5.0.6: version "5.0.6" resolved "https://registry.yarnpkg.com/postcss-nested/-/postcss-nested-5.0.6.tgz#466343f7fc8d3d46af3e7dba3fcd47d052a945bc" integrity sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA== @@ -2353,11 +2334,6 @@ postcss-safe-parser@^6.0.0: resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-6.0.0.tgz#bb4c29894171a94bc5c996b9a30317ef402adaa1" integrity sha512-FARHN8pwH+WiS2OPCxJI8FuRJpTVnn6ZNFiqAM2aeW2LwTHWWmWgIyKC6cUo0L8aeKiF/14MNvnpls6R2PBeMQ== -postcss-scss@^4.0.2: - version "4.0.5" - resolved "https://registry.yarnpkg.com/postcss-scss/-/postcss-scss-4.0.5.tgz#8ee33c1dda8d9d4753b565ec79014803dc6edabf" - integrity sha512-F7xpB6TrXyqUh3GKdyB4Gkp3QL3DDW1+uI+gxx/oJnUt/qXI4trj5OGlp9rOKdoABGULuqtqeG+3HEVQk4DjmA== - postcss-selector-parser@^6.0.10, postcss-selector-parser@^6.0.6: version "6.0.10" resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz#79b61e2c0d1bfc2602d549e11d0876256f8df88d" @@ -2366,17 +2342,12 @@ postcss-selector-parser@^6.0.10, postcss-selector-parser@^6.0.6: cssesc "^3.0.0" util-deprecate "^1.0.2" -postcss-sorting@^7.0.1: - version "7.0.1" - resolved "https://registry.yarnpkg.com/postcss-sorting/-/postcss-sorting-7.0.1.tgz#923b5268451cf2d93ebf8835e17a6537757049a5" - integrity sha512-iLBFYz6VRYyLJEJsBJ8M3TCqNcckVzz4wFounSc5Oez35ogE/X+aoC5fFu103Ot7NyvjU3/xqIXn93Gp3kJk4g== - -postcss-value-parser@^4.0.0, postcss-value-parser@^4.1.0, postcss-value-parser@^4.2.0: +postcss-value-parser@^4.0.0, postcss-value-parser@^4.2.0: version "4.2.0" resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514" integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ== -postcss@^8.3.11, postcss@^8.4.14, postcss@^8.4.16: +postcss@^8.4.14, postcss@^8.4.16: version "8.4.16" resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.16.tgz#33a1d675fac39941f5f445db0de4db2b6e01d43c" integrity sha512-ipHE1XBvKzm5xI7hiHCZJCSugxvsdq2mPnsq5+UF+VHCjiBvtDrlxJfMBToWaP9D5XlgNmcFGqoHmUn0EYEaRQ== @@ -2570,15 +2541,6 @@ safe-regex-test@^1.0.0: get-intrinsic "^1.1.3" is-regex "^1.1.4" -sass@^1.38.0: - version "1.55.0" - resolved "https://registry.yarnpkg.com/sass/-/sass-1.55.0.tgz#0c4d3c293cfe8f8a2e8d3b666e1cf1bff8065d1c" - integrity sha512-Pk+PMy7OGLs9WaxZGJMn7S96dvlyVBwwtToX895WmCpAOr5YiJYEUJfiJidMuKb613z2xNWcXCHEuOvjZbqC6A== - dependencies: - chokidar ">=3.0.0 <4.0.0" - immutable "^4.0.0" - source-map-js ">=0.6.2 <2.0.0" - "semver@2 || 3 || 4 || 5", semver@^5.5.0, semver@^5.7.0, semver@^5.7.1: version "5.7.1" resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7" @@ -2643,7 +2605,7 @@ slice-ansi@^4.0.0: astral-regex "^2.0.0" is-fullwidth-code-point "^3.0.0" -"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.0.2: +source-map-js@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c" integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw== @@ -2752,33 +2714,17 @@ style-search@^0.1.0: resolved "https://registry.yarnpkg.com/style-search/-/style-search-0.1.0.tgz#7958c793e47e32e07d2b5cafe5c0bf8e12e77902" integrity sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg== -stylelint-config-sass-guidelines@^9.0.1: - version "9.0.1" - resolved "https://registry.yarnpkg.com/stylelint-config-sass-guidelines/-/stylelint-config-sass-guidelines-9.0.1.tgz#3114ce780f2085ba9ea5da2b7d97a1e85e968fa7" - integrity sha512-N06PsVsrgKijQ3YT5hqKA7x3NUkgELTRI1cbWMqcYiCGG6MjzvNk6Cb5YYA1PrvrksBV76BvY9P9bAswojVMqA== - dependencies: - postcss-scss "^4.0.2" - stylelint-order "^5.0.0" - stylelint-scss "^4.0.0" - -stylelint-order@^5.0.0: - version "5.0.0" - resolved "https://registry.yarnpkg.com/stylelint-order/-/stylelint-order-5.0.0.tgz#abd20f6b85ac640774cbe40e70d3fe9c6fdf4400" - integrity sha512-OWQ7pmicXufDw5BlRqzdz3fkGKJPgLyDwD1rFY3AIEfIH/LQY38Vu/85v8/up0I+VPiuGRwbc2Hg3zLAsJaiyw== - dependencies: - postcss "^8.3.11" - postcss-sorting "^7.0.1" +stylelint-config-recommended@^9.0.0: + version "9.0.0" + resolved "https://registry.yarnpkg.com/stylelint-config-recommended/-/stylelint-config-recommended-9.0.0.tgz#1c9e07536a8cd875405f8ecef7314916d94e7e40" + integrity sha512-9YQSrJq4NvvRuTbzDsWX3rrFOzOlYBmZP+o513BJN/yfEmGSr0AxdvrWs0P/ilSpVV/wisamAHu5XSk8Rcf4CQ== -stylelint-scss@^4.0.0: - version "4.3.0" - resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-4.3.0.tgz#638800faf823db11fff60d537c81051fe74c90fa" - integrity sha512-GvSaKCA3tipzZHoz+nNO7S02ZqOsdBzMiCx9poSmLlb3tdJlGddEX/8QzCOD8O7GQan9bjsvLMsO5xiw6IhhIQ== +stylelint-config-standard@^28.0.0: + version "28.0.0" + resolved "https://registry.yarnpkg.com/stylelint-config-standard/-/stylelint-config-standard-28.0.0.tgz#7e1926c232631a8445eafee7b186d276d42d7b15" + integrity sha512-q/StuowDdDmFCravzGHAwgS9pjX0bdOQUEBBDIkIWsQuYGgYz/xsO8CM6eepmIQ1fc5bKdDVimlJZ6MoOUcJ5Q== dependencies: - lodash "^4.17.21" - postcss-media-query-parser "^0.2.3" - postcss-resolve-nested-selector "^0.1.1" - postcss-selector-parser "^6.0.6" - postcss-value-parser "^4.1.0" + stylelint-config-recommended "^9.0.0" stylelint@^14.13.0: version "14.13.0"