⚡ rem over px

pluralcom · Jan 27, 2023 · bb6bc67 · bb6bc67
1 parent 662120c
commit bb6bc67
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 18 deletions.
diff --git a/README.md b/README.md
@@ -106,13 +106,13 @@ _Note: the config is tested against this example, as such the example contains p
 ## Installation
 
 ```bash
-npm install --save-dev stylelint-config-plural stylelint-config-prettier stylelint-config-standard stylelint-config-standard-scss stylelint-high-performance-animation stylelint-images stylelint-order stylelint-8-point-grid
+npm install --save-dev stylelint-config-plural stylelint-config-prettier stylelint-config-standard stylelint-config-standard-scss stylelint-high-performance-animation stylelint-images stylelint-order stylelint-8-point-grid stylelint-rem-over-px
 ```
 
 OR
 
 ```bash
-yarn add -D stylelint-config-plural stylelint-config-prettier stylelint-config-standard stylelint-config-standard-scss stylelint-high-performance-animation stylelint-images stylelint-order stylelint-8-point-grid
+yarn add -D stylelint-config-plural stylelint-config-prettier stylelint-config-standard stylelint-config-standard-scss stylelint-high-performance-animation stylelint-images stylelint-order stylelint-8-point-grid stylelint-rem-over-px
 ```
 
 ## Usage

diff --git a/__tests__/index.test.js b/__tests__/index.test.js
@@ -46,7 +46,7 @@ describe('css', () => {
 
 		it('correct warning text', () => {
 			expect(result.results[0].warnings.map((w) => w.text)).toEqual([
-				'Use rem instead of px (meowtec/no-px)',
+				'Expected px unit in "width: 10px" to be rem. (rem-over-px/rem-over-px)',
 				'Expected "color" to come before "background-color" (order/properties-order)',
 				'Invalid `width: 10px`. Pixel values should be divisible by 4. (plugin/8-point-grid)',
 				'Expected custom media query name "--FOO" to be kebab-case',
@@ -59,7 +59,7 @@ describe('css', () => {
 
 		it('correct rule flagged', () => {
 			expect(result.results[0].warnings.map((w) => w.rule)).toEqual([
-				'meowtec/no-px',
+				'rem-over-px/rem-over-px',
 				'order/properties-order',
 				'plugin/8-point-grid',
 				'custom-media-pattern',
@@ -126,7 +126,7 @@ describe('scss', () => {
 
 		it('correct warning text', () => {
 			expect(result.results[0].warnings.map((w) => w.text)).toEqual([
-				'Use rem instead of px (meowtec/no-px)',
+				'Expected px unit in "width: 10px" to be rem. (rem-over-px/rem-over-px)',
 				'Expected "color" to come before "background-color" (order/properties-order)',
 				'Invalid `width: 10px`. Pixel values should be divisible by 4. (plugin/8-point-grid)',
 				'Invalid `width: 0.1rem`. Rem values should be divisible by 0.25. (plugin/8-point-grid)',
@@ -141,7 +141,7 @@ describe('scss', () => {
 
 		it('correct rule flagged', () => {
 			expect(result.results[0].warnings.map((w) => w.rule)).toEqual([
-				'meowtec/no-px',
+				'rem-over-px/rem-over-px',
 				'order/properties-order',
 				'plugin/8-point-grid',
 				'plugin/8-point-grid',

diff --git a/index.js b/index.js
@@ -13,7 +13,7 @@ module.exports = {
 	plugins: [
 		'stylelint-high-performance-animation',
 		'stylelint-images',
-		'stylelint-no-px',
+		'stylelint-rem-over-px',
 		'stylelint-order',
 	],
 	/**
@@ -31,7 +31,13 @@ module.exports = {
 		// /** allow us to go as precise as needed */
 		// 'number-max-precision': null,
 		/** no px - enforce rem */
-		'meowtec/no-px': [true, { ignore: ['1px'], ignoreFunctions: ['rem'] }],
+		'rem-over-px/rem-over-px': [
+			true,
+			{
+				ignore: ['1px'],
+				ignoreFunctions: ['rem'],
+			},
+		],
 		/** properties order */
 		'order/properties-order': propertyOrder,
 		// /** 8 point grid system - 4 point base and 8 point main grid system */

diff --git a/package.json b/package.json
@@ -81,8 +81,8 @@
     "stylelint-config-standard-scss": "^6.1.0",
     "stylelint-high-performance-animation": "^1.7.0",
     "stylelint-images": "^2.0.1",
-    "stylelint-no-px": "^1.0.1",
-    "stylelint-order": "^6.0.1"
+    "stylelint-order": "^6.0.1",
+    "stylelint-rem-over-px": "^0.0.2"
   },
   "devDependencies": {
     "@stylelint/prettier-config": "^2.0.0",
@@ -110,6 +110,7 @@
     "stylelint-high-performance-animation": ">=1",
     "stylelint-images": ">=2",
     "stylelint-no-unresolved-module": ">=2",
-    "stylelint-order": ">=6"
+    "stylelint-order": ">=6",
+    "stylelint-rem-over-px": ">=0"
   }
 }
diff --git a/yarn.lock b/yarn.lock
@@ -6373,13 +6373,6 @@ stylelint-images@^2.0.1:
     axios "^0.19.0"
     lodash "^4.17.4"
 
-stylelint-no-px@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/stylelint-no-px/-/stylelint-no-px-1.0.1.tgz#4d137c60a02c60514a958b43d3bb41805405a3ca"
-  integrity sha512-33+Gd5WFeSvEiOV8IwWMVgjzYieFg/Q4ETKeZkahSYl2V7+WMtgNT32IYYEspN402ZJv16bOciwEnG1GY2qrPA==
-  dependencies:
-    postcss-value-parser "^3.3.0 || ^4.0.2"
-
 stylelint-order@^6.0.1:
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/stylelint-order/-/stylelint-order-6.0.1.tgz#a43349d99b38dd4e00bc9c5045794f2a73754e51"
@@ -6388,6 +6381,13 @@ stylelint-order@^6.0.1:
     postcss "^8.4.20"
     postcss-sorting "^8.0.1"
 
+stylelint-rem-over-px@^0.0.2:
+  version "0.0.2"
+  resolved "https://registry.yarnpkg.com/stylelint-rem-over-px/-/stylelint-rem-over-px-0.0.2.tgz#699241f9b109ac2d6bd4b52d6ac6d40779bc129b"
+  integrity sha512-RDL7Y89h7Km4QIyAnPxE+ARAqm3NnHuIR4krtjA7CTBr5H0zHgOW1T4d9hBFBwNujKCtIAsSfkHwVftmv5fkdQ==
+  dependencies:
+    postcss-value-parser "^3.3.0 || ^4.0.2"
+
 stylelint-scss@^4.0.0:
   version "4.3.0"
   resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-4.3.0.tgz#638800faf823db11fff60d537c81051fe74c90fa"