diff --git a/tests/jit/basic-usage.test.css b/tests/jit/basic-usage.test.css
index c610a3bcb..0438acf9e 100644
--- a/tests/jit/basic-usage.test.css
+++ b/tests/jit/basic-usage.test.css
@@ -1,12 +1,6 @@
-.translate-x-5,
-.-translate-x-4,
-.translate-y-6,
-.-translate-x-3,
-.rotate-3,
-.skew-y-12,
-.skew-x-12,
-.scale-95,
-.transform {
+*,
+::before,
+::after {
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
@@ -17,23 +11,11 @@
--tw-transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y))
rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-.border,
-.border-2,
-.border-t,
-.border-b-4 {
--tw-border-opacity: 1;
border-color: rgba(229, 231, 235, var(--tw-border-opacity));
-}
-.shadow,
-.shadow-md,
-.shadow-lg {
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;
-}
-.ring,
-.ring-4 {
--tw-ring-inset: var(--tw-empty, /*!*/ /*!*/);
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
@@ -41,17 +23,6 @@
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;
-}
-.blur-md,
-.brightness-150,
-.contrast-50,
-.drop-shadow-md,
-.grayscale,
-.hue-rotate-60,
-.invert,
-.saturate-200,
-.sepia,
-.filter {
--tw-blur: var(--tw-empty, /*!*/ /*!*/);
--tw-brightness: var(--tw-empty, /*!*/ /*!*/);
--tw-contrast: var(--tw-empty, /*!*/ /*!*/);
@@ -63,17 +34,6 @@
--tw-drop-shadow: var(--tw-empty, /*!*/ /*!*/);
--tw-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale)
var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-.backdrop-blur-lg,
-.backdrop-brightness-50,
-.backdrop-contrast-0,
-.backdrop-grayscale,
-.backdrop-hue-rotate-90,
-.backdrop-invert,
-.backdrop-opacity-75,
-.backdrop-saturate-150,
-.backdrop-sepia,
-.backdrop-filter {
--tw-backdrop-blur: var(--tw-empty, /*!*/ /*!*/);
--tw-backdrop-brightness: var(--tw-empty, /*!*/ /*!*/);
--tw-backdrop-contrast: var(--tw-empty, /*!*/ /*!*/);
diff --git a/tests/jit/basic-usage.test.js b/tests/jit/basic-usage.test.js
index 7c75f71d9..f45295192 100644
--- a/tests/jit/basic-usage.test.js
+++ b/tests/jit/basic-usage.test.js
@@ -9,6 +9,10 @@ function run(input, config = {}) {
})
}
+function css(templates) {
+ return templates.join('')
+}
+
test('basic usage', () => {
let config = {
mode: 'jit',
@@ -18,13 +22,13 @@ test('basic usage', () => {
plugins: [],
}
- let css = `
+ let input = css`
@tailwind base;
@tailwind components;
@tailwind utilities;
`
- return run(css, config).then((result) => {
+ return run(input, config).then((result) => {
let expectedPath = path.resolve(__dirname, './basic-usage.test.css')
let expected = fs.readFileSync(expectedPath, 'utf8')
diff --git a/tests/jit/kitchen-sink.test.css b/tests/jit/kitchen-sink.test.css
index 4d81eae9a..ffd0e7dc6 100644
--- a/tests/jit/kitchen-sink.test.css
+++ b/tests/jit/kitchen-sink.test.css
@@ -126,9 +126,9 @@
}
}
}
-.scale-50,
-.transform,
-.hover\:scale-75 {
+*,
+::before,
+::after {
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
@@ -139,16 +139,9 @@
--tw-transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y))
rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-.shadow-sm,
-.shadow-md,
-.hover\:shadow-lg,
-.md\:shadow-sm {
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;
-}
-.focus\:ring-2 {
--tw-ring-inset: var(--tw-empty, /*!*/ /*!*/);
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
diff --git a/tests/jit/kitchen-sink.test.js b/tests/jit/kitchen-sink.test.js
index 7e3b8ee3c..4f6194faa 100644
--- a/tests/jit/kitchen-sink.test.js
+++ b/tests/jit/kitchen-sink.test.js
@@ -9,6 +9,10 @@ function run(input, config = {}) {
})
}
+function css(templates) {
+ return templates.join('')
+}
+
test('it works', () => {
let config = {
darkMode: 'class',
@@ -71,100 +75,101 @@ test('it works', () => {
],
}
- let css = `
- @layer utilities {
- .custom-util {
- background: #abcdef;
+ let input = css`
+ @layer utilities {
+ .custom-util {
+ background: #abcdef;
+ }
+ *,
+ ::before,
+ ::after {
+ margin: 10px;
+ }
}
- *,
-::before,
-::after {
- margin: 10px;
+ @layer components {
+ .test-apply-font-variant {
+ @apply ordinal tabular-nums;
+ }
+ .custom-component {
+ background: #123456;
+ }
+ *,
+ ::before,
+ ::after {
+ padding: 5px;
+ }
+ .foo .bg-black {
+ appearance: none;
+ }
}
- }
- @layer components {
- .test-apply-font-variant {
- @apply ordinal tabular-nums;
+ @layer base {
+ div {
+ background: #654321;
+ }
}
- .custom-component {
- background: #123456;
+ .theme-test {
+ font-family: theme('fontFamily.sans');
+ color: theme('colors.blue.500');
}
- *,
-::before,
-::after {
- padding: 5px;
+ @screen lg {
+ .screen-test {
+ color: purple;
+ }
}
- .foo .bg-black {
- appearance: none;
+ .apply-1 {
+ @apply mt-6;
}
- }
- @layer base {
- div {
- background: #654321;
+ .apply-2 {
+ @apply mt-6;
}
- }
- .theme-test {
- font-family: theme('fontFamily.sans');
- color: theme('colors.blue.500');
- }
- @screen lg {
- .screen-test {
- color: purple;
+ .apply-test {
+ @apply mt-6 bg-pink-500 hover:font-bold focus:hover:font-bold sm:bg-green-500 sm:focus:even:bg-pink-200;
}
- }
- .apply-1 {
- @apply mt-6;
- }
- .apply-2 {
- @apply mt-6;
- }
- .apply-test {
- @apply mt-6 bg-pink-500 hover:font-bold focus:hover:font-bold sm:bg-green-500 sm:focus:even:bg-pink-200;
- }
- .apply-components {
- @apply container mx-auto;
- }
- .drop-empty-rules {
- @apply hover:font-bold;
- }
- .apply-group {
- @apply group-hover:font-bold;
- }
- .apply-dark-mode {
- @apply dark:font-bold;
- }
- .apply-with-existing:hover {
- @apply font-normal sm:bg-green-500;
- }
- .multiple, .selectors {
- @apply font-bold group-hover:font-normal;
- }
- .list {
- @apply space-x-4;
- }
- .nested {
- .example {
- @apply font-bold hover:font-normal;
+ .apply-components {
+ @apply container mx-auto;
}
- }
- .apply-order-a {
- @apply m-5 mt-6;
- }
- .apply-order-b {
- @apply mt-6 m-5;
- }
- .apply-dark-group-example-a {
- @apply dark:group-hover:bg-green-500;
- }
- .crazy-example {
- @apply sm:motion-safe:group-active:focus:opacity-10;
- }
- @tailwind base;
- @tailwind components;
- @tailwind utilities;
-`
+ .drop-empty-rules {
+ @apply hover:font-bold;
+ }
+ .apply-group {
+ @apply group-hover:font-bold;
+ }
+ .apply-dark-mode {
+ @apply dark:font-bold;
+ }
+ .apply-with-existing:hover {
+ @apply font-normal sm:bg-green-500;
+ }
+ .multiple,
+ .selectors {
+ @apply font-bold group-hover:font-normal;
+ }
+ .list {
+ @apply space-x-4;
+ }
+ .nested {
+ .example {
+ @apply font-bold hover:font-normal;
+ }
+ }
+ .apply-order-a {
+ @apply m-5 mt-6;
+ }
+ .apply-order-b {
+ @apply mt-6 m-5;
+ }
+ .apply-dark-group-example-a {
+ @apply dark:group-hover:bg-green-500;
+ }
+ .crazy-example {
+ @apply sm:motion-safe:group-active:focus:opacity-10;
+ }
+ @tailwind base;
+ @tailwind components;
+ @tailwind utilities;
+ `
- return run(css, config).then((result) => {
+ return run(input, config).then((result) => {
let expectedPath = path.resolve(__dirname, './kitchen-sink.test.css')
let expected = fs.readFileSync(expectedPath, 'utf8')
diff --git a/tests/jit/relative-purge-paths.test.css b/tests/jit/relative-purge-paths.test.css
deleted file mode 100644
index bc32fb75a..000000000
--- a/tests/jit/relative-purge-paths.test.css
+++ /dev/null
@@ -1,825 +0,0 @@
-.translate-x-5,
-.-translate-x-4,
-.translate-y-6,
-.-translate-x-3,
-.rotate-3,
-.skew-y-12,
-.skew-x-12,
-.scale-95,
-.transform {
- --tw-translate-x: 0;
- --tw-translate-y: 0;
- --tw-rotate: 0;
- --tw-skew-x: 0;
- --tw-skew-y: 0;
- --tw-scale-x: 1;
- --tw-scale-y: 1;
- --tw-transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y))
- rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
- scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-.border,
-.border-2 {
- --tw-border-opacity: 1;
- border-color: rgba(229, 231, 235, var(--tw-border-opacity));
-}
-.shadow,
-.shadow-md,
-.shadow-lg {
- --tw-ring-offset-shadow: 0 0 #0000;
- --tw-ring-shadow: 0 0 #0000;
- --tw-shadow: 0 0 #0000;
-}
-.ring,
-.ring-4 {
- --tw-ring-inset: var(--tw-empty, /*!*/ /*!*/);
- --tw-ring-offset-width: 0px;
- --tw-ring-offset-color: #fff;
- --tw-ring-color: rgba(59, 130, 246, 0.5);
- --tw-ring-offset-shadow: 0 0 #0000;
- --tw-ring-shadow: 0 0 #0000;
- --tw-shadow: 0 0 #0000;
-}
-.blur-md,
-.brightness-150,
-.contrast-50,
-.drop-shadow-md,
-.grayscale,
-.hue-rotate-60,
-.invert,
-.saturate-200,
-.sepia,
-.filter {
- --tw-blur: var(--tw-empty, /*!*/ /*!*/);
- --tw-brightness: var(--tw-empty, /*!*/ /*!*/);
- --tw-contrast: var(--tw-empty, /*!*/ /*!*/);
- --tw-grayscale: var(--tw-empty, /*!*/ /*!*/);
- --tw-hue-rotate: var(--tw-empty, /*!*/ /*!*/);
- --tw-invert: var(--tw-empty, /*!*/ /*!*/);
- --tw-saturate: var(--tw-empty, /*!*/ /*!*/);
- --tw-sepia: var(--tw-empty, /*!*/ /*!*/);
- --tw-drop-shadow: var(--tw-empty, /*!*/ /*!*/);
- --tw-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale)
- var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-.backdrop-blur-lg,
-.backdrop-brightness-50,
-.backdrop-contrast-0,
-.backdrop-grayscale,
-.backdrop-hue-rotate-90,
-.backdrop-invert,
-.backdrop-opacity-75,
-.backdrop-saturate-150,
-.backdrop-sepia,
-.backdrop-filter {
- --tw-backdrop-blur: var(--tw-empty, /*!*/ /*!*/);
- --tw-backdrop-brightness: var(--tw-empty, /*!*/ /*!*/);
- --tw-backdrop-contrast: var(--tw-empty, /*!*/ /*!*/);
- --tw-backdrop-grayscale: var(--tw-empty, /*!*/ /*!*/);
- --tw-backdrop-hue-rotate: var(--tw-empty, /*!*/ /*!*/);
- --tw-backdrop-invert: var(--tw-empty, /*!*/ /*!*/);
- --tw-backdrop-opacity: var(--tw-empty, /*!*/ /*!*/);
- --tw-backdrop-saturate: var(--tw-empty, /*!*/ /*!*/);
- --tw-backdrop-sepia: var(--tw-empty, /*!*/ /*!*/);
- --tw-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness)
- var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
- var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate)
- var(--tw-backdrop-sepia);
-}
-.container {
- width: 100%;
-}
-@media (min-width: 640px) {
- .container {
- max-width: 640px;
- }
-}
-@media (min-width: 768px) {
- .container {
- max-width: 768px;
- }
-}
-@media (min-width: 1024px) {
- .container {
- max-width: 1024px;
- }
-}
-@media (min-width: 1280px) {
- .container {
- max-width: 1280px;
- }
-}
-@media (min-width: 1536px) {
- .container {
- max-width: 1536px;
- }
-}
-.sr-only {
- position: absolute;
- width: 1px;
- height: 1px;
- padding: 0;
- margin: -1px;
- overflow: hidden;
- clip: rect(0, 0, 0, 0);
- white-space: nowrap;
- border-width: 0;
-}
-.pointer-events-none {
- pointer-events: none;
-}
-.invisible {
- visibility: hidden;
-}
-.absolute {
- position: absolute;
-}
-.inset-0 {
- top: 0px;
- right: 0px;
- bottom: 0px;
- left: 0px;
-}
-.inset-y-4 {
- top: 1rem;
- bottom: 1rem;
-}
-.inset-x-2 {
- left: 0.5rem;
- right: 0.5rem;
-}
-.top-6 {
- top: 1.5rem;
-}
-.right-8 {
- right: 2rem;
-}
-.bottom-12 {
- bottom: 3rem;
-}
-.left-16 {
- left: 4rem;
-}
-.isolate {
- isolation: isolate;
-}
-.isolation-auto {
- isolation: auto;
-}
-.z-30 {
- z-index: 30;
-}
-.order-last {
- order: 9999;
-}
-.order-2 {
- order: 2;
-}
-.col-span-3 {
- grid-column: span 3 / span 3;
-}
-.col-start-1 {
- grid-column-start: 1;
-}
-.col-end-4 {
- grid-column-end: 4;
-}
-.row-span-2 {
- grid-row: span 2 / span 2;
-}
-.row-start-3 {
- grid-row-start: 3;
-}
-.row-end-5 {
- grid-row-end: 5;
-}
-.float-right {
- float: right;
-}
-.clear-left {
- clear: left;
-}
-.m-4 {
- margin: 1rem;
-}
-.my-2 {
- margin-top: 0.5rem;
- margin-bottom: 0.5rem;
-}
-.mx-auto {
- margin-left: auto;
- margin-right: auto;
-}
-.mt-0 {
- margin-top: 0px;
-}
-.mr-1 {
- margin-right: 0.25rem;
-}
-.mb-3 {
- margin-bottom: 0.75rem;
-}
-.ml-4 {
- margin-left: 1rem;
-}
-.box-border {
- box-sizing: border-box;
-}
-.inline-grid {
- display: inline-grid;
-}
-.hidden {
- display: none;
-}
-.h-16 {
- height: 4rem;
-}
-.max-h-screen {
- max-height: 100vh;
-}
-.min-h-0 {
- min-height: 0px;
-}
-.w-12 {
- width: 3rem;
-}
-.min-w-min {
- min-width: min-content;
-}
-.max-w-full {
- max-width: 100%;
-}
-.flex-1 {
- flex: 1 1 0%;
-}
-.flex-shrink {
- flex-shrink: 1;
-}
-.flex-shrink-0 {
- flex-shrink: 0;
-}
-.flex-grow {
- flex-grow: 1;
-}
-.flex-grow-0 {
- flex-grow: 0;
-}
-.table-fixed {
- table-layout: fixed;
-}
-.border-collapse {
- border-collapse: collapse;
-}
-.origin-top-right {
- transform-origin: top right;
-}
-.translate-x-5 {
- --tw-translate-x: 1.25rem;
- transform: var(--tw-transform);
-}
-.-translate-x-4 {
- --tw-translate-x: -1rem;
- transform: var(--tw-transform);
-}
-.translate-y-6 {
- --tw-translate-y: 1.5rem;
- transform: var(--tw-transform);
-}
-.-translate-x-3 {
- --tw-translate-x: -0.75rem;
- transform: var(--tw-transform);
-}
-.rotate-3 {
- --tw-rotate: 3deg;
- transform: var(--tw-transform);
-}
-.skew-y-12 {
- --tw-skew-y: 12deg;
- transform: var(--tw-transform);
-}
-.skew-x-12 {
- --tw-skew-x: 12deg;
- transform: var(--tw-transform);
-}
-.scale-95 {
- --tw-scale-x: 0.95;
- --tw-scale-y: 0.95;
- transform: var(--tw-transform);
-}
-.transform {
- transform: var(--tw-transform);
-}
-.transform-gpu {
- --tw-transform: translate3d(var(--tw-translate-x), var(--tw-translate-y), 0)
- rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
- scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-.animate-none {
- animation: none;
-}
-@keyframes spin {
- to {
- transform: rotate(360deg);
- }
-}
-.animate-spin {
- animation: spin 1s linear infinite;
-}
-.cursor-pointer {
- cursor: pointer;
-}
-.select-none {
- user-select: none;
-}
-.resize-none {
- resize: none;
-}
-.list-inside {
- list-style-position: inside;
-}
-.list-disc {
- list-style-type: disc;
-}
-.appearance-none {
- appearance: none;
-}
-.auto-cols-min {
- grid-auto-columns: min-content;
-}
-.grid-flow-row {
- grid-auto-flow: row;
-}
-.auto-rows-max {
- grid-auto-rows: max-content;
-}
-.grid-cols-4 {
- grid-template-columns: repeat(4, minmax(0, 1fr));
-}
-.grid-rows-3 {
- grid-template-rows: repeat(3, minmax(0, 1fr));
-}
-.flex-row-reverse {
- flex-direction: row-reverse;
-}
-.flex-wrap {
- flex-wrap: wrap;
-}
-.place-content-start {
- place-content: start;
-}
-.place-items-end {
- place-items: end;
-}
-.content-center {
- align-content: center;
-}
-.items-start {
- align-items: flex-start;
-}
-.justify-center {
- justify-content: center;
-}
-.justify-items-end {
- justify-items: end;
-}
-.gap-4 {
- gap: 1rem;
-}
-.gap-x-2 {
- column-gap: 0.5rem;
-}
-.gap-y-3 {
- row-gap: 0.75rem;
-}
-.space-x-4 > :not([hidden]) ~ :not([hidden]) {
- --tw-space-x-reverse: 0;
- margin-right: calc(1rem * var(--tw-space-x-reverse));
- margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
-}
-.space-y-3 > :not([hidden]) ~ :not([hidden]) {
- --tw-space-y-reverse: 0;
- margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
- margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
-}
-.space-y-reverse > :not([hidden]) ~ :not([hidden]) {
- --tw-space-y-reverse: 1;
-}
-.space-x-reverse > :not([hidden]) ~ :not([hidden]) {
- --tw-space-x-reverse: 1;
-}
-.divide-x-2 > :not([hidden]) ~ :not([hidden]) {
- --tw-divide-x-reverse: 0;
- border-right-width: calc(2px * var(--tw-divide-x-reverse));
- border-left-width: calc(2px * calc(1 - var(--tw-divide-x-reverse)));
-}
-.divide-y-4 > :not([hidden]) ~ :not([hidden]) {
- --tw-divide-y-reverse: 0;
- border-top-width: calc(4px * calc(1 - var(--tw-divide-y-reverse)));
- border-bottom-width: calc(4px * var(--tw-divide-y-reverse));
-}
-.divide-x-0 > :not([hidden]) ~ :not([hidden]) {
- --tw-divide-x-reverse: 0;
- border-right-width: calc(0px * var(--tw-divide-x-reverse));
- border-left-width: calc(0px * calc(1 - var(--tw-divide-x-reverse)));
-}
-.divide-y-0 > :not([hidden]) ~ :not([hidden]) {
- --tw-divide-y-reverse: 0;
- border-top-width: calc(0px * calc(1 - var(--tw-divide-y-reverse)));
- border-bottom-width: calc(0px * var(--tw-divide-y-reverse));
-}
-.divide-dotted > :not([hidden]) ~ :not([hidden]) {
- border-style: dotted;
-}
-.divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
- --tw-divide-opacity: 1;
- border-color: rgba(229, 231, 235, var(--tw-divide-opacity));
-}
-.divide-opacity-50 > :not([hidden]) ~ :not([hidden]) {
- --tw-divide-opacity: 0.5;
-}
-.place-self-center {
- place-self: center;
-}
-.self-end {
- align-self: flex-end;
-}
-.justify-self-start {
- justify-self: start;
-}
-.overflow-hidden {
- overflow: hidden;
-}
-.overscroll-contain {
- overscroll-behavior: contain;
-}
-.truncate {
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
-}
-.overflow-ellipsis {
- text-overflow: ellipsis;
-}
-.whitespace-nowrap {
- white-space: nowrap;
-}
-.break-words {
- overflow-wrap: break-word;
-}
-.rounded-md {
- border-radius: 0.375rem;
-}
-.border {
- border-width: 1px;
-}
-.border-2 {
- border-width: 2px;
-}
-.border-solid {
- border-style: solid;
-}
-.border-black {
- --tw-border-opacity: 1;
- border-color: rgba(0, 0, 0, var(--tw-border-opacity));
-}
-.border-opacity-10 {
- --tw-border-opacity: 0.1;
-}
-.bg-green-500 {
- --tw-bg-opacity: 1;
- background-color: rgba(16, 185, 129, var(--tw-bg-opacity));
-}
-.bg-opacity-20 {
- --tw-bg-opacity: 0.2;
-}
-.bg-gradient-to-r {
- background-image: linear-gradient(to right, var(--tw-gradient-stops));
-}
-.from-red-300 {
- --tw-gradient-from: #fca5a5;
- --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(252, 165, 165, 0));
-}
-.via-purple-200 {
- --tw-gradient-stops: var(--tw-gradient-from), #ddd6fe,
- var(--tw-gradient-to, rgba(221, 214, 254, 0));
-}
-.to-blue-400 {
- --tw-gradient-to: #60a5fa;
-}
-.decoration-slice {
- box-decoration-break: slice;
-}
-.decoration-clone {
- box-decoration-break: clone;
-}
-.bg-cover {
- background-size: cover;
-}
-.bg-local {
- background-attachment: local;
-}
-.bg-clip-border {
- background-clip: border-box;
-}
-.bg-top {
- background-position: top;
-}
-.bg-no-repeat {
- background-repeat: no-repeat;
-}
-.bg-origin-border {
- background-origin: border-box;
-}
-.bg-origin-padding {
- background-origin: padding-box;
-}
-.bg-origin-content {
- background-origin: content-box;
-}
-.fill-current {
- fill: currentColor;
-}
-.stroke-current {
- stroke: currentColor;
-}
-.stroke-2 {
- stroke-width: 2;
-}
-.object-cover {
- object-fit: cover;
-}
-.object-bottom {
- object-position: bottom;
-}
-.p-4 {
- padding: 1rem;
-}
-.py-2 {
- padding-top: 0.5rem;
- padding-bottom: 0.5rem;
-}
-.px-3 {
- padding-left: 0.75rem;
- padding-right: 0.75rem;
-}
-.pt-1 {
- padding-top: 0.25rem;
-}
-.pr-2 {
- padding-right: 0.5rem;
-}
-.pb-3 {
- padding-bottom: 0.75rem;
-}
-.pl-4 {
- padding-left: 1rem;
-}
-.text-center {
- text-align: center;
-}
-.align-middle {
- vertical-align: middle;
-}
-.font-sans {
- font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
- 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
- 'Segoe UI Symbol', 'Noto Color Emoji';
-}
-.text-2xl {
- font-size: 1.5rem;
- line-height: 2rem;
-}
-.font-medium {
- font-weight: 500;
-}
-.uppercase {
- text-transform: uppercase;
-}
-.not-italic {
- font-style: normal;
-}
-.ordinal,
-.slashed-zero,
-.lining-nums,
-.oldstyle-nums,
-.proportional-nums,
-.tabular-nums,
-.diagonal-fractions,
-.stacked-fractions {
- --tw-ordinal: var(--tw-empty, /*!*/ /*!*/);
- --tw-slashed-zero: var(--tw-empty, /*!*/ /*!*/);
- --tw-numeric-figure: var(--tw-empty, /*!*/ /*!*/);
- --tw-numeric-spacing: var(--tw-empty, /*!*/ /*!*/);
- --tw-numeric-fraction: var(--tw-empty, /*!*/ /*!*/);
- font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure)
- var(--tw-numeric-spacing) var(--tw-numeric-fraction);
-}
-.ordinal {
- --tw-ordinal: ordinal;
-}
-.tabular-nums {
- --tw-numeric-spacing: tabular-nums;
-}
-.diagonal-fractions {
- --tw-numeric-fraction: diagonal-fractions;
-}
-.leading-relaxed {
- line-height: 1.625;
-}
-.leading-5 {
- line-height: 1.25rem;
-}
-.tracking-tight {
- letter-spacing: -0.025em;
-}
-.text-indigo-500 {
- --tw-text-opacity: 1;
- color: rgba(99, 102, 241, var(--tw-text-opacity));
-}
-.text-opacity-10 {
- --tw-text-opacity: 0.1;
-}
-.underline {
- text-decoration: underline;
-}
-.antialiased {
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
-}
-.placeholder-green-300::placeholder {
- --tw-placeholder-opacity: 1;
- color: rgba(110, 231, 183, var(--tw-placeholder-opacity));
-}
-.placeholder-opacity-60::placeholder {
- --tw-placeholder-opacity: 0.6;
-}
-.opacity-90 {
- opacity: 0.9;
-}
-.bg-blend-darken {
- background-blend-mode: darken;
-}
-.bg-blend-difference {
- background-blend-mode: difference;
-}
-.mix-blend-multiply {
- mix-blend-mode: multiply;
-}
-.mix-blend-saturation {
- mix-blend-mode: saturation;
-}
-.shadow {
- --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
- var(--tw-shadow);
-}
-.shadow-md {
- --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
- var(--tw-shadow);
-}
-.shadow-lg {
- --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
- var(--tw-shadow);
-}
-.outline-none {
- outline: 2px solid transparent;
- outline-offset: 2px;
-}
-.outline-black {
- outline: 2px dotted black;
- outline-offset: 2px;
-}
-.ring {
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width)
- var(--tw-ring-offset-color);
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width))
- var(--tw-ring-color);
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
-}
-.ring-4 {
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width)
- var(--tw-ring-offset-color);
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width))
- var(--tw-ring-color);
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
-}
-.ring-white {
- --tw-ring-opacity: 1;
- --tw-ring-color: rgba(255, 255, 255, var(--tw-ring-opacity));
-}
-.ring-opacity-40 {
- --tw-ring-opacity: 0.4;
-}
-.ring-offset-2 {
- --tw-ring-offset-width: 2px;
-}
-.ring-offset-blue-300 {
- --tw-ring-offset-color: #93c5fd;
-}
-.blur-md {
- --tw-blur: blur(12px);
- filter: var(--tw-filter);
-}
-.brightness-150 {
- --tw-brightness: brightness(1.5);
- filter: var(--tw-filter);
-}
-.contrast-50 {
- --tw-contrast: contrast(0.5);
- filter: var(--tw-filter);
-}
-.drop-shadow-md {
- --tw-drop-shadow: drop-shadow(0 4px 3px rgba(0, 0, 0, 0.07))
- drop-shadow(0 2px 2px rgba(0, 0, 0, 0.06));
- filter: var(--tw-filter);
-}
-.grayscale {
- --tw-grayscale: grayscale(100%);
- filter: var(--tw-filter);
-}
-.hue-rotate-60 {
- --tw-hue-rotate: hue-rotate(60deg);
- filter: var(--tw-filter);
-}
-.invert {
- --tw-invert: invert(100%);
- filter: var(--tw-filter);
-}
-.saturate-200 {
- --tw-saturate: saturate(2);
- filter: var(--tw-filter);
-}
-.sepia {
- --tw-sepia: sepia(100%);
- filter: var(--tw-filter);
-}
-.filter {
- filter: var(--tw-filter);
-}
-.filter-none {
- filter: none;
-}
-.backdrop-blur-lg {
- --tw-backdrop-blur: blur(16px);
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-brightness-50 {
- --tw-backdrop-brightness: brightness(0.5);
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-contrast-0 {
- --tw-backdrop-contrast: contrast(0);
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-grayscale {
- --tw-backdrop-grayscale: grayscale(100%);
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-hue-rotate-90 {
- --tw-backdrop-hue-rotate: hue-rotate(90deg);
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-invert {
- --tw-backdrop-invert: invert(100%);
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-opacity-75 {
- --tw-backdrop-opacity: opacity(0.75);
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-saturate-150 {
- --tw-backdrop-saturate: saturate(1.5);
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-sepia {
- --tw-backdrop-sepia: sepia(100%);
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-filter {
- backdrop-filter: var(--tw-backdrop-filter);
-}
-.backdrop-filter-none {
- backdrop-filter: none;
-}
-.transition {
- transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow,
- transform, filter, backdrop-filter;
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
- transition-duration: 150ms;
-}
-.transition-all {
- transition-property: all;
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
- transition-duration: 150ms;
-}
-.delay-300 {
- transition-delay: 300ms;
-}
-.duration-200 {
- transition-duration: 200ms;
-}
-.ease-in-out {
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-}
diff --git a/tests/jit/relative-purge-paths.test.html b/tests/jit/relative-purge-paths.test.html
index 1e97f5fdf..45b844045 100644
--- a/tests/jit/relative-purge-paths.test.html
+++ b/tests/jit/relative-purge-paths.test.html
@@ -8,140 +8,6 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+