From 6d30cf21dbbccfdaa20b0959c1f635e541494331 Mon Sep 17 00:00:00 2001 From: Jeff Sagal Date: Tue, 19 Oct 2021 21:25:09 -0700 Subject: [PATCH] convert to css custom properties --- build/webpack.base.conf.js | 7 +- package.json | 5 +- postcss.config.js | 1 + src/components/Select.vue | 4 +- src/css/global/_animations.css | 37 +-- src/css/global/_states.css | 54 ++-- src/css/global/_variables.css | 43 ++- src/css/modules/_clear.css | 12 +- src/css/modules/_dropdown-menu.css | 52 ++-- src/css/modules/_dropdown-option.css | 28 +- src/css/modules/_dropdown-toggle.css | 47 ++- src/css/modules/_open-indicator.css | 19 +- src/css/modules/_search-input.css | 51 ++-- src/css/modules/_selected.css | 63 ++-- src/css/modules/_spinner.css | 34 ++- yarn.lock | 442 +++++---------------------- 16 files changed, 309 insertions(+), 590 deletions(-) diff --git a/build/webpack.base.conf.js b/build/webpack.base.conf.js index 84d00f9..1bcabfa 100644 --- a/build/webpack.base.conf.js +++ b/build/webpack.base.conf.js @@ -42,12 +42,7 @@ module.exports = { }, { test: /\.s?css$/, - use: [ - extractOrInjectStyles, - 'css-loader', - 'postcss-loader', - 'sass-loader', - ], + use: [extractOrInjectStyles, 'css-loader', 'postcss-loader'], }, ], }, diff --git a/package.json b/package.json index e14c29c..a6c1b31 100644 --- a/package.json +++ b/package.json @@ -67,11 +67,12 @@ "jest-serializer-vue": "^2.0.2", "jest-transform-stub": "^2.0.0", "mini-css-extract-plugin": "^0.5.0", - "node-sass": "^4.12.0", + "postcss": "^8.3.9", + "postcss-import": "^14.0.2", "postcss-loader": "^3.0.0", + "postcss-nested": "^5.0.6", "postcss-scss": "^2.0.0", "prettier": "2.2.1", - "sass-loader": "^7.1.0", "semantic-release": "^17.0.4", "terser-webpack-plugin": "^1.2.3", "url-loader": "^1.1.2", diff --git a/postcss.config.js b/postcss.config.js index 82a74b0..3fab8ca 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -1,5 +1,6 @@ module.exports = { plugins: [ + require('postcss-nested'), require('autoprefixer'), require('cssnano')({ preset: 'default', diff --git a/src/components/Select.vue b/src/components/Select.vue index 5da5ffe..acce569 100644 --- a/src/components/Select.vue +++ b/src/components/Select.vue @@ -1,5 +1,5 @@ -