Update index.test.js

Kelvin-GohKengBoon · Kelvin-GohKengBoon · commit 37ef80735b53 · 2022-02-10T14:25:12.000+08:00
diff --git a/src/index.test.js b/src/index.test.js
@@ -104,85 +104,108 @@ test('specificity', async () => {
          --tw-backdrop-sepia: ;
       }
         .border-primary {
-            border-color: rgba(222, 32, 106, 1);
+            --tw-border-opacity: 1;
+            border-color: rgb(222 32 106 / var(--tw-border-opacity));
         }
         .border-yellow-400 {
-            border-color: rgba(251, 191, 36, 1);
+            --tw-border-opacity: 1;
+            border-color: rgb(251 191 36 / var(--tw-border-opacity));
         }
         .border-green-500 {
-            border-color: rgba(16, 185, 129, 1);
+            --tw-border-opacity: 1;
+            border-color: rgb(16 185 129 / var(--tw-border-opacity));
         }
         .border-white {
              --tw-border-opacity: 1;
              border-color: rgb(255 255 255 / var(--tw-border-opacity));
         }
         .bg-primary {
-            background-color: rgba(222, 32, 106, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(222 32 106 / var(--tw-bg-opacity));
         }
         .bg-yellow-400 {
-            background-color: rgba(251, 191, 36, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(251 191 36 / var(--tw-bg-opacity));
         }
         .bg-green-500 {
-            background-color: rgba(16, 185, 129, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(16 185 129 / var(--tw-bg-opacity));
         }
         .bg-white {
             --tw-bg-opacity: 1;
             background-color: rgb(255 255 255 / var(--tw-bg-opacity));
         }
         .bg-slate-100 {
-            background-color: rgba(241, 245, 249, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(241 245 249 / var(--tw-bg-opacity));
         }
         .bg-slate-700 {
-            background-color: rgba(51, 65, 85, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(51 65 85 / var(--tw-bg-opacity));
         }
         .bg-neutral-100 {
-            background-color: rgba(245, 245, 245, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(245 245 245 / var(--tw-bg-opacity));
         }
         .bg-neutral-300 {
-            background-color: rgba(212, 212, 212, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(212 212 212 / var(--tw-bg-opacity));
         }
         .bg-neutral-400 {
-            background-color: rgba(163, 163, 163, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(163 163 163 / var(--tw-bg-opacity));
         }
         .bg-neutral-500 {
-            background-color: rgba(115, 115, 115, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(115 115 115 / var(--tw-bg-opacity));
         }
         .bg-neutral-700 {
-            background-color: rgba(64, 64, 64, 1);
+            --tw-bg-opacity: 1;
+            background-color: rgb(64 64 64 / var(--tw-bg-opacity));
         }
         .text-primary {
-            color: rgba(222, 32, 106, 1);
+            --tw-text-opacity: 1;
+            color: rgb(222 32 106 / var(--tw-text-opacity));
         }
         .text-yellow-400 {
-            color: rgba(251, 191, 36, 1);
+            --tw-text-opacity: 1;
+            color: rgb(251 191 36 / var(--tw-text-opacity));
         }
         .text-green-500 {
-            color: rgba(16, 185, 129, 1);
+            --tw-text-opacity: 1;
+            color: rgb(16 185 129 / var(--tw-text-opacity));
         }
         .text-white {
             --tw-text-opacity: 1;
             color: rgb(255 255 255 / var(--tw-text-opacity));
         }
         .text-slate-100 {
-            color: rgba(241, 245, 249, 1);
+            --tw-text-opacity: 1;
+            color: rgb(241 245 249 / var(--tw-text-opacity));
         }
         .text-slate-700 {
-            color: rgba(51, 65, 85, 1);
+            --tw-text-opacity: 1;
+            color: rgb(51 65 85 / var(--tw-text-opacity));
         }
         .text-neutral-100 {
-            color: rgba(245, 245, 245, 1);
+            --tw-text-opacity: 1;
+            color: rgb(245 245 245 / var(--tw-text-opacity));
         }
         .text-neutral-300 {
-            color: rgba(212, 212, 212, 1);
+            --tw-text-opacity: 1;
+            color: rgb(212 212 212 / var(--tw-text-opacity));
         }
         .text-neutral-400 {
-            color: rgba(163, 163, 163, 1);
+            --tw-text-opacity: 1;
+            color: rgb(163 163 163 / var(--tw-text-opacity));
         }
         .text-neutral-500 {
-            color: rgba(115, 115, 115, 1);
+            --tw-text-opacity: 1;
+            color: rgb(115 115 115 / var(--tw-text-opacity));
         }
         .text-neutral-700 {
-            color: rgba(64, 64, 64, 1);
+            --tw-text-opacity: 1;
+            color: rgb(64 64 64 / var(--tw-text-opacity));
         }
         .shadow-sm {
             --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
@@ -220,47 +243,47 @@ test('specificity', async () => {
             box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
         }
         .shadow-primary {
-            --tw-shadow-color: rgba(222, 32, 106, 1);
+            --tw-shadow-color: rgb(222, 32, 106);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-yellow-400 {
-            --tw-shadow-color: rgba(251, 191, 36, 1);
+            --tw-shadow-color: rgb(251, 191, 36);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-green-500 {
-            --tw-shadow-color: rgba(16, 185, 129, 1);
+            --tw-shadow-color: rgb(16, 185, 129);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-white {
             --tw-shadow-color: #ffffff;
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-slate-100 {
-            --tw-shadow-color: rgba(241, 245, 249, 1);
+            --tw-shadow-color: rgb(241, 245, 249);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-slate-700 {
-            --tw-shadow-color: rgba(51, 65, 85, 1);
+            --tw-shadow-color: rgb(51, 65, 85);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-neutral-100 {
-            --tw-shadow-color: rgba(245, 245, 245, 1);
+            --tw-shadow-color: rgb(245, 245, 245);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-neutral-300 {
-            --tw-shadow-color: rgba(212, 212, 212, 1);
+            --tw-shadow-color: rgb(212, 212, 212);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-neutral-400 {
-            --tw-shadow-color: rgba(163, 163, 163, 1);
+            --tw-shadow-color: rgb(163, 163, 163);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-neutral-500 {
-            --tw-shadow-color: rgba(115, 115, 115, 1);
+            --tw-shadow-color: rgb(115, 115, 115);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .shadow-neutral-700 {
-            --tw-shadow-color: rgba(64, 64, 64, 1);
+            --tw-shadow-color: rgb(64, 64, 64);
             --tw-shadow: var(--tw-shadow-colored);
         }
         .h1 {

Original file line number	Diff line number	Diff line change
`@@ -104,85 +104,108 @@ test('specificity', async () => {`
`104`	`104`	`--tw-backdrop-sepia: ;`
`105`	`105`	`}`
`106`	`106`	`.border-primary {`
`107`		`- border-color: rgba(222, 32, 106, 1);`
	`107`	`+ --tw-border-opacity: 1;`
	`108`	`+ border-color: rgb(222 32 106 / var(--tw-border-opacity));`
`108`	`109`	`}`
`109`	`110`	`.border-yellow-400 {`
`110`		`- border-color: rgba(251, 191, 36, 1);`
	`111`	`+ --tw-border-opacity: 1;`
	`112`	`+ border-color: rgb(251 191 36 / var(--tw-border-opacity));`
`111`	`113`	`}`
`112`	`114`	`.border-green-500 {`
`113`		`- border-color: rgba(16, 185, 129, 1);`
	`115`	`+ --tw-border-opacity: 1;`
	`116`	`+ border-color: rgb(16 185 129 / var(--tw-border-opacity));`
`114`	`117`	`}`
`115`	`118`	`.border-white {`
`116`	`119`	`--tw-border-opacity: 1;`
`117`	`120`	`border-color: rgb(255 255 255 / var(--tw-border-opacity));`
`118`	`121`	`}`
`119`	`122`	`.bg-primary {`
`120`		`- background-color: rgba(222, 32, 106, 1);`
	`123`	`+ --tw-bg-opacity: 1;`
	`124`	`+ background-color: rgb(222 32 106 / var(--tw-bg-opacity));`
`121`	`125`	`}`
`122`	`126`	`.bg-yellow-400 {`
`123`		`- background-color: rgba(251, 191, 36, 1);`
	`127`	`+ --tw-bg-opacity: 1;`
	`128`	`+ background-color: rgb(251 191 36 / var(--tw-bg-opacity));`
`124`	`129`	`}`
`125`	`130`	`.bg-green-500 {`
`126`		`- background-color: rgba(16, 185, 129, 1);`
	`131`	`+ --tw-bg-opacity: 1;`
	`132`	`+ background-color: rgb(16 185 129 / var(--tw-bg-opacity));`
`127`	`133`	`}`
`128`	`134`	`.bg-white {`
`129`	`135`	`--tw-bg-opacity: 1;`
`130`	`136`	`background-color: rgb(255 255 255 / var(--tw-bg-opacity));`
`131`	`137`	`}`
`132`	`138`	`.bg-slate-100 {`
`133`		`- background-color: rgba(241, 245, 249, 1);`
	`139`	`+ --tw-bg-opacity: 1;`
	`140`	`+ background-color: rgb(241 245 249 / var(--tw-bg-opacity));`
`134`	`141`	`}`
`135`	`142`	`.bg-slate-700 {`
`136`		`- background-color: rgba(51, 65, 85, 1);`
	`143`	`+ --tw-bg-opacity: 1;`
	`144`	`+ background-color: rgb(51 65 85 / var(--tw-bg-opacity));`
`137`	`145`	`}`
`138`	`146`	`.bg-neutral-100 {`
`139`		`- background-color: rgba(245, 245, 245, 1);`
	`147`	`+ --tw-bg-opacity: 1;`
	`148`	`+ background-color: rgb(245 245 245 / var(--tw-bg-opacity));`
`140`	`149`	`}`
`141`	`150`	`.bg-neutral-300 {`
`142`		`- background-color: rgba(212, 212, 212, 1);`
	`151`	`+ --tw-bg-opacity: 1;`
	`152`	`+ background-color: rgb(212 212 212 / var(--tw-bg-opacity));`
`143`	`153`	`}`
`144`	`154`	`.bg-neutral-400 {`
`145`		`- background-color: rgba(163, 163, 163, 1);`
	`155`	`+ --tw-bg-opacity: 1;`
	`156`	`+ background-color: rgb(163 163 163 / var(--tw-bg-opacity));`
`146`	`157`	`}`
`147`	`158`	`.bg-neutral-500 {`
`148`		`- background-color: rgba(115, 115, 115, 1);`
	`159`	`+ --tw-bg-opacity: 1;`
	`160`	`+ background-color: rgb(115 115 115 / var(--tw-bg-opacity));`
`149`	`161`	`}`
`150`	`162`	`.bg-neutral-700 {`
`151`		`- background-color: rgba(64, 64, 64, 1);`
	`163`	`+ --tw-bg-opacity: 1;`
	`164`	`+ background-color: rgb(64 64 64 / var(--tw-bg-opacity));`
`152`	`165`	`}`
`153`	`166`	`.text-primary {`
`154`		`- color: rgba(222, 32, 106, 1);`
	`167`	`+ --tw-text-opacity: 1;`
	`168`	`+ color: rgb(222 32 106 / var(--tw-text-opacity));`
`155`	`169`	`}`
`156`	`170`	`.text-yellow-400 {`
`157`		`- color: rgba(251, 191, 36, 1);`
	`171`	`+ --tw-text-opacity: 1;`
	`172`	`+ color: rgb(251 191 36 / var(--tw-text-opacity));`
`158`	`173`	`}`
`159`	`174`	`.text-green-500 {`
`160`		`- color: rgba(16, 185, 129, 1);`
	`175`	`+ --tw-text-opacity: 1;`
	`176`	`+ color: rgb(16 185 129 / var(--tw-text-opacity));`
`161`	`177`	`}`
`162`	`178`	`.text-white {`
`163`	`179`	`--tw-text-opacity: 1;`
`164`	`180`	`color: rgb(255 255 255 / var(--tw-text-opacity));`
`165`	`181`	`}`
`166`	`182`	`.text-slate-100 {`
`167`		`- color: rgba(241, 245, 249, 1);`
	`183`	`+ --tw-text-opacity: 1;`
	`184`	`+ color: rgb(241 245 249 / var(--tw-text-opacity));`
`168`	`185`	`}`
`169`	`186`	`.text-slate-700 {`
`170`		`- color: rgba(51, 65, 85, 1);`
	`187`	`+ --tw-text-opacity: 1;`
	`188`	`+ color: rgb(51 65 85 / var(--tw-text-opacity));`
`171`	`189`	`}`
`172`	`190`	`.text-neutral-100 {`
`173`		`- color: rgba(245, 245, 245, 1);`
	`191`	`+ --tw-text-opacity: 1;`
	`192`	`+ color: rgb(245 245 245 / var(--tw-text-opacity));`
`174`	`193`	`}`
`175`	`194`	`.text-neutral-300 {`
`176`		`- color: rgba(212, 212, 212, 1);`
	`195`	`+ --tw-text-opacity: 1;`
	`196`	`+ color: rgb(212 212 212 / var(--tw-text-opacity));`
`177`	`197`	`}`
`178`	`198`	`.text-neutral-400 {`
`179`		`- color: rgba(163, 163, 163, 1);`
	`199`	`+ --tw-text-opacity: 1;`
	`200`	`+ color: rgb(163 163 163 / var(--tw-text-opacity));`
`180`	`201`	`}`
`181`	`202`	`.text-neutral-500 {`
`182`		`- color: rgba(115, 115, 115, 1);`
	`203`	`+ --tw-text-opacity: 1;`
	`204`	`+ color: rgb(115 115 115 / var(--tw-text-opacity));`
`183`	`205`	`}`
`184`	`206`	`.text-neutral-700 {`
`185`		`- color: rgba(64, 64, 64, 1);`
	`207`	`+ --tw-text-opacity: 1;`
	`208`	`+ color: rgb(64 64 64 / var(--tw-text-opacity));`
`186`	`209`	`}`
`187`	`210`	`.shadow-sm {`
`188`	`211`	`--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);`
`@@ -220,47 +243,47 @@ test('specificity', async () => {`
`220`	`243`	`box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);`
`221`	`244`	`}`
`222`	`245`	`.shadow-primary {`
`223`		`- --tw-shadow-color: rgba(222, 32, 106, 1);`
	`246`	`+ --tw-shadow-color: rgb(222, 32, 106);`
`224`	`247`	`--tw-shadow: var(--tw-shadow-colored);`
`225`	`248`	`}`
`226`	`249`	`.shadow-yellow-400 {`
`227`		`- --tw-shadow-color: rgba(251, 191, 36, 1);`
	`250`	`+ --tw-shadow-color: rgb(251, 191, 36);`
`228`	`251`	`--tw-shadow: var(--tw-shadow-colored);`
`229`	`252`	`}`
`230`	`253`	`.shadow-green-500 {`
`231`		`- --tw-shadow-color: rgba(16, 185, 129, 1);`
	`254`	`+ --tw-shadow-color: rgb(16, 185, 129);`
`232`	`255`	`--tw-shadow: var(--tw-shadow-colored);`
`233`	`256`	`}`
`234`	`257`	`.shadow-white {`
`235`	`258`	`--tw-shadow-color: #ffffff;`
`236`	`259`	`--tw-shadow: var(--tw-shadow-colored);`
`237`	`260`	`}`
`238`	`261`	`.shadow-slate-100 {`
`239`		`- --tw-shadow-color: rgba(241, 245, 249, 1);`
	`262`	`+ --tw-shadow-color: rgb(241, 245, 249);`
`240`	`263`	`--tw-shadow: var(--tw-shadow-colored);`
`241`	`264`	`}`
`242`	`265`	`.shadow-slate-700 {`
`243`		`- --tw-shadow-color: rgba(51, 65, 85, 1);`
	`266`	`+ --tw-shadow-color: rgb(51, 65, 85);`
`244`	`267`	`--tw-shadow: var(--tw-shadow-colored);`
`245`	`268`	`}`
`246`	`269`	`.shadow-neutral-100 {`
`247`		`- --tw-shadow-color: rgba(245, 245, 245, 1);`
	`270`	`+ --tw-shadow-color: rgb(245, 245, 245);`
`248`	`271`	`--tw-shadow: var(--tw-shadow-colored);`
`249`	`272`	`}`
`250`	`273`	`.shadow-neutral-300 {`
`251`		`- --tw-shadow-color: rgba(212, 212, 212, 1);`
	`274`	`+ --tw-shadow-color: rgb(212, 212, 212);`
`252`	`275`	`--tw-shadow: var(--tw-shadow-colored);`
`253`	`276`	`}`
`254`	`277`	`.shadow-neutral-400 {`
`255`		`- --tw-shadow-color: rgba(163, 163, 163, 1);`
	`278`	`+ --tw-shadow-color: rgb(163, 163, 163);`
`256`	`279`	`--tw-shadow: var(--tw-shadow-colored);`
`257`	`280`	`}`
`258`	`281`	`.shadow-neutral-500 {`
`259`		`- --tw-shadow-color: rgba(115, 115, 115, 1);`
	`282`	`+ --tw-shadow-color: rgb(115, 115, 115);`
`260`	`283`	`--tw-shadow: var(--tw-shadow-colored);`
`261`	`284`	`}`
`262`	`285`	`.shadow-neutral-700 {`
`263`		`- --tw-shadow-color: rgba(64, 64, 64, 1);`
	`286`	`+ --tw-shadow-color: rgb(64, 64, 64);`
`264`	`287`	`--tw-shadow: var(--tw-shadow-colored);`
`265`	`288`	`}`
`266`	`289`	`.h1 {`