From f1fc052f9891c6652816fbc398f3f6155dffdd90 Mon Sep 17 00:00:00 2001 From: Brandon McConnell Date: Thu, 28 Mar 2024 03:05:51 -0700 Subject: [PATCH 1/4] Add first-class support for height media/container queries --- .../__snapshots__/intellisense.test.ts.snap | 46 + .../backup__snapshots__/index.test.ts.snap | 525 ++++ .../intellisense.test.ts.snap | 2428 +++++++++++++++++ .../utilities.test.ts.snap | 1082 ++++++++ packages/tailwindcss/src/variants.test.ts | 137 +- packages/tailwindcss/src/variants.ts | 157 ++ 6 files changed, 4374 insertions(+), 1 deletion(-) create mode 100644 packages/tailwindcss/src/backup__snapshots__/index.test.ts.snap create mode 100644 packages/tailwindcss/src/backup__snapshots__/intellisense.test.ts.snap create mode 100644 packages/tailwindcss/src/backup__snapshots__/utilities.test.ts.snap diff --git a/packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap b/packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap index 8978f5123b5e..dc44850c5cb2 100644 --- a/packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap +++ b/packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap @@ -2327,6 +2327,15 @@ exports[`getVariants 1`] = ` "sm", ], }, + { + "hasDash": true, + "isArbitrary": true, + "name": "max-h", + "selectors": [Function], + "values": [ + "sm", + ], + }, { "hasDash": true, "isArbitrary": false, @@ -2343,6 +2352,22 @@ exports[`getVariants 1`] = ` "sm", ], }, + { + "hasDash": true, + "isArbitrary": false, + "name": "h-sm", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "min-h", + "selectors": [Function], + "values": [ + "sm", + ], + }, { "hasDash": true, "isArbitrary": true, @@ -2368,6 +2393,27 @@ exports[`getVariants 1`] = ` "4", ], }, + { + "hasDash": true, + "isArbitrary": true, + "name": "@max-h", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "@-h", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "@min-h", + "selectors": [Function], + "values": [], + }, { "hasDash": true, "isArbitrary": false, diff --git a/packages/tailwindcss/src/backup__snapshots__/index.test.ts.snap b/packages/tailwindcss/src/backup__snapshots__/index.test.ts.snap new file mode 100644 index 000000000000..7eaf27dd9ef1 --- /dev/null +++ b/packages/tailwindcss/src/backup__snapshots__/index.test.ts.snap @@ -0,0 +1,525 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using the default theme 1`] = ` +":root { + --default-transition-duration: .15s; + --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1); + --default-font-family: var(--font-family-sans); + --default-font-feature-settings: var(--font-family-sans--font-feature-settings); + --default-font-variation-settings: var(--font-family-sans--font-variation-settings); + --default-mono-font-family: var(--font-family-mono); + --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings); + --default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings); + --breakpoint-sm: 640px; + --breakpoint-md: 768px; + --breakpoint-lg: 1024px; + --breakpoint-xl: 1280px; + --breakpoint-2xl: 1536px; + --color-black: #000; + --color-white: #fff; + --color-slate-50: #f8fafc; + --color-slate-100: #f1f5f9; + --color-slate-200: #e2e8f0; + --color-slate-300: #cbd5e1; + --color-slate-400: #94a3b8; + --color-slate-500: #64748b; + --color-slate-600: #475569; + --color-slate-700: #334155; + --color-slate-800: #1e293b; + --color-slate-900: #0f172a; + --color-slate-950: #020617; + --color-gray-50: #f9fafb; + --color-gray-100: #f3f4f6; + --color-gray-200: #e5e7eb; + --color-gray-300: #d1d5db; + --color-gray-400: #9ca3af; + --color-gray-500: #6b7280; + --color-gray-600: #4b5563; + --color-gray-700: #374151; + --color-gray-800: #1f2937; + --color-gray-900: #111827; + --color-gray-950: #030712; + --color-zinc-50: #fafafa; + --color-zinc-100: #f4f4f5; + --color-zinc-200: #e4e4e7; + --color-zinc-300: #d4d4d8; + --color-zinc-400: #a1a1aa; + --color-zinc-500: #71717a; + --color-zinc-600: #52525b; + --color-zinc-700: #3f3f46; + --color-zinc-800: #27272a; + --color-zinc-900: #18181b; + --color-zinc-950: #09090b; + --color-neutral-50: #fafafa; + --color-neutral-100: #f5f5f5; + --color-neutral-200: #e5e5e5; + --color-neutral-300: #d4d4d4; + --color-neutral-400: #a3a3a3; + --color-neutral-500: #737373; + --color-neutral-600: #525252; + --color-neutral-700: #404040; + --color-neutral-800: #262626; + --color-neutral-900: #171717; + --color-neutral-950: #0a0a0a; + --color-stone-50: #fafaf9; + --color-stone-100: #f5f5f4; + --color-stone-200: #e7e5e4; + --color-stone-300: #d6d3d1; + --color-stone-400: #a8a29e; + --color-stone-500: #78716c; + --color-stone-600: #57534e; + --color-stone-700: #44403c; + --color-stone-800: #292524; + --color-stone-900: #1c1917; + --color-stone-950: #0c0a09; + --color-red-50: #fef2f2; + --color-red-100: #fee2e2; + --color-red-200: #fecaca; + --color-red-300: #fca5a5; + --color-red-400: #f87171; + --color-red-500: #ef4444; + --color-red-600: #dc2626; + --color-red-700: #b91c1c; + --color-red-800: #991b1b; + --color-red-900: #7f1d1d; + --color-red-950: #450a0a; + --color-orange-50: #fff7ed; + --color-orange-100: #ffedd5; + --color-orange-200: #fed7aa; + --color-orange-300: #fdba74; + --color-orange-400: #fb923c; + --color-orange-500: #f97316; + --color-orange-600: #ea580c; + --color-orange-700: #c2410c; + --color-orange-800: #9a3412; + --color-orange-900: #7c2d12; + --color-orange-950: #431407; + --color-amber-50: #fffbeb; + --color-amber-100: #fef3c7; + --color-amber-200: #fde68a; + --color-amber-300: #fcd34d; + --color-amber-400: #fbbf24; + --color-amber-500: #f59e0b; + --color-amber-600: #d97706; + --color-amber-700: #b45309; + --color-amber-800: #92400e; + --color-amber-900: #78350f; + --color-amber-950: #451a03; + --color-yellow-50: #fefce8; + --color-yellow-100: #fef9c3; + --color-yellow-200: #fef08a; + --color-yellow-300: #fde047; + --color-yellow-400: #facc15; + --color-yellow-500: #eab308; + --color-yellow-600: #ca8a04; + --color-yellow-700: #a16207; + --color-yellow-800: #854d0e; + --color-yellow-900: #713f12; + --color-yellow-950: #422006; + --color-lime-50: #f7fee7; + --color-lime-100: #ecfccb; + --color-lime-200: #d9f99d; + --color-lime-300: #bef264; + --color-lime-400: #a3e635; + --color-lime-500: #84cc16; + --color-lime-600: #65a30d; + --color-lime-700: #4d7c0f; + --color-lime-800: #3f6212; + --color-lime-900: #365314; + --color-lime-950: #1a2e05; + --color-green-50: #f0fdf4; + --color-green-100: #dcfce7; + --color-green-200: #bbf7d0; + --color-green-300: #86efac; + --color-green-400: #4ade80; + --color-green-500: #22c55e; + --color-green-600: #16a34a; + --color-green-700: #15803d; + --color-green-800: #166534; + --color-green-900: #14532d; + --color-green-950: #052e16; + --color-emerald-50: #ecfdf5; + --color-emerald-100: #d1fae5; + --color-emerald-200: #a7f3d0; + --color-emerald-300: #6ee7b7; + --color-emerald-400: #34d399; + --color-emerald-500: #10b981; + --color-emerald-600: #059669; + --color-emerald-700: #047857; + --color-emerald-800: #065f46; + --color-emerald-900: #064e3b; + --color-emerald-950: #022c22; + --color-teal-50: #f0fdfa; + --color-teal-100: #ccfbf1; + --color-teal-200: #99f6e4; + --color-teal-300: #5eead4; + --color-teal-400: #2dd4bf; + --color-teal-500: #14b8a6; + --color-teal-600: #0d9488; + --color-teal-700: #0f766e; + --color-teal-800: #115e59; + --color-teal-900: #134e4a; + --color-teal-950: #042f2e; + --color-cyan-50: #ecfeff; + --color-cyan-100: #cffafe; + --color-cyan-200: #a5f3fc; + --color-cyan-300: #67e8f9; + --color-cyan-400: #22d3ee; + --color-cyan-500: #06b6d4; + --color-cyan-600: #0891b2; + --color-cyan-700: #0e7490; + --color-cyan-800: #155e75; + --color-cyan-900: #164e63; + --color-cyan-950: #083344; + --color-sky-50: #f0f9ff; + --color-sky-100: #e0f2fe; + --color-sky-200: #bae6fd; + --color-sky-300: #7dd3fc; + --color-sky-400: #38bdf8; + --color-sky-500: #0ea5e9; + --color-sky-600: #0284c7; + --color-sky-700: #0369a1; + --color-sky-800: #075985; + --color-sky-900: #0c4a6e; + --color-sky-950: #082f49; + --color-blue-50: #eff6ff; + --color-blue-100: #dbeafe; + --color-blue-200: #bfdbfe; + --color-blue-300: #93c5fd; + --color-blue-400: #60a5fa; + --color-blue-500: #3b82f6; + --color-blue-600: #2563eb; + --color-blue-700: #1d4ed8; + --color-blue-800: #1e40af; + --color-blue-900: #1e3a8a; + --color-blue-950: #172554; + --color-indigo-50: #eef2ff; + --color-indigo-100: #e0e7ff; + --color-indigo-200: #c7d2fe; + --color-indigo-300: #a5b4fc; + --color-indigo-400: #818cf8; + --color-indigo-500: #6366f1; + --color-indigo-600: #4f46e5; + --color-indigo-700: #4338ca; + --color-indigo-800: #3730a3; + --color-indigo-900: #312e81; + --color-indigo-950: #1e1b4b; + --color-violet-50: #f5f3ff; + --color-violet-100: #ede9fe; + --color-violet-200: #ddd6fe; + --color-violet-300: #c4b5fd; + --color-violet-400: #a78bfa; + --color-violet-500: #8b5cf6; + --color-violet-600: #7c3aed; + --color-violet-700: #6d28d9; + --color-violet-800: #5b21b6; + --color-violet-900: #4c1d95; + --color-violet-950: #2e1065; + --color-purple-50: #faf5ff; + --color-purple-100: #f3e8ff; + --color-purple-200: #e9d5ff; + --color-purple-300: #d8b4fe; + --color-purple-400: #c084fc; + --color-purple-500: #a855f7; + --color-purple-600: #9333ea; + --color-purple-700: #7e22ce; + --color-purple-800: #6b21a8; + --color-purple-900: #581c87; + --color-purple-950: #3b0764; + --color-fuchsia-50: #fdf4ff; + --color-fuchsia-100: #fae8ff; + --color-fuchsia-200: #f5d0fe; + --color-fuchsia-300: #f0abfc; + --color-fuchsia-400: #e879f9; + --color-fuchsia-500: #d946ef; + --color-fuchsia-600: #c026d3; + --color-fuchsia-700: #a21caf; + --color-fuchsia-800: #86198f; + --color-fuchsia-900: #701a75; + --color-fuchsia-950: #4a044e; + --color-pink-50: #fdf2f8; + --color-pink-100: #fce7f3; + --color-pink-200: #fbcfe8; + --color-pink-300: #f9a8d4; + --color-pink-400: #f472b6; + --color-pink-500: #ec4899; + --color-pink-600: #db2777; + --color-pink-700: #be185d; + --color-pink-800: #9d174d; + --color-pink-900: #831843; + --color-pink-950: #500724; + --color-rose-50: #fff1f2; + --color-rose-100: #ffe4e6; + --color-rose-200: #fecdd3; + --color-rose-300: #fda4af; + --color-rose-400: #fb7185; + --color-rose-500: #f43f5e; + --color-rose-600: #e11d48; + --color-rose-700: #be123c; + --color-rose-800: #9f1239; + --color-rose-900: #881337; + --color-rose-950: #4c0519; + --animate-spin: spin 1s linear infinite; + --animate-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite; + --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; + --animate-bounce: bounce 1s infinite; + --blur: 8px; + --blur-sm: 4px; + --blur-md: 12px; + --blur-lg: 16px; + --blur-xl: 24px; + --blur-2xl: 40px; + --blur-3xl: 64px; + --radius: .25rem; + --radius-sm: .125rem; + --radius-md: .375rem; + --radius-lg: .5rem; + --radius-xl: .75rem; + --radius-2xl: 1rem; + --radius-3xl: 1.5rem; + --shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a; + --shadow-xs: 0 1px #0000000d; + --shadow-sm: 0 1px 2px 0 #0000000d; + --shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a; + --shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a; + --shadow-xl: 0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a; + --shadow-2xl: 0 25px 50px -12px #00000040; + --shadow-inner: inset 0 2px 4px 0 #0000000d; + --inset-shadow-xs: inset 0 1px #0000000d; + --inset-shadow-sm: inset 0 1px 1px #0000000d; + --inset-shadow: inset 0 2px 4px #0000000d; + --drop-shadow: 0 1px 2px #0000001a, 0 1px 1px #0000000f; + --drop-shadow-sm: 0 1px 1px #0000000d; + --drop-shadow-md: 0 4px 3px #00000012, 0 2px 2px #0000000f; + --drop-shadow-lg: 0 10px 8px #0000000a, 0 4px 3px #0000001a; + --drop-shadow-xl: 0 20px 13px #00000008, 0 8px 5px #00000014; + --drop-shadow-2xl: 0 25px 25px #00000026; + --spacing-px: 1px; + --spacing-0: 0px; + --spacing-0_5: .125rem; + --spacing-1: .25rem; + --spacing-1_5: .375rem; + --spacing-2: .5rem; + --spacing-2_5: .625rem; + --spacing-3: .75rem; + --spacing-3_5: .875rem; + --spacing-4: 1rem; + --spacing-5: 1.25rem; + --spacing-6: 1.5rem; + --spacing-7: 1.75rem; + --spacing-8: 2rem; + --spacing-9: 2.25rem; + --spacing-10: 2.5rem; + --spacing-11: 2.75rem; + --spacing-12: 3rem; + --spacing-14: 3.5rem; + --spacing-16: 4rem; + --spacing-20: 5rem; + --spacing-24: 6rem; + --spacing-28: 7rem; + --spacing-32: 8rem; + --spacing-36: 9rem; + --spacing-40: 10rem; + --spacing-44: 11rem; + --spacing-48: 12rem; + --spacing-52: 13rem; + --spacing-56: 14rem; + --spacing-60: 15rem; + --spacing-64: 16rem; + --spacing-72: 18rem; + --spacing-80: 20rem; + --spacing-96: 24rem; + --width-3xs: 16rem; + --width-2xs: 18rem; + --width-xs: 20rem; + --width-sm: 24rem; + --width-md: 28rem; + --width-lg: 32rem; + --width-xl: 36rem; + --width-2xl: 42rem; + --width-3xl: 48rem; + --width-4xl: 56rem; + --width-5xl: 64rem; + --width-6xl: 72rem; + --width-7xl: 80rem; + --width-prose: 65ch; + --font-family-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; + --font-family-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif; + --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; + --font-size-xs: .75rem; + --font-size-xs--line-height: 1rem; + --font-size-sm: .875rem; + --font-size-sm--line-height: 1.25rem; + --font-size-base: 1rem; + --font-size-base--line-height: 1.5rem; + --font-size-lg: 1.125rem; + --font-size-lg--line-height: 1.75rem; + --font-size-xl: 1.25rem; + --font-size-xl--line-height: 1.75rem; + --font-size-2xl: 1.5rem; + --font-size-2xl--line-height: 2rem; + --font-size-3xl: 1.875rem; + --font-size-3xl--line-height: 2.25rem; + --font-size-4xl: 2.25rem; + --font-size-4xl--line-height: 2.5rem; + --font-size-5xl: 3rem; + --font-size-5xl--line-height: 1; + --font-size-6xl: 3.75rem; + --font-size-6xl--line-height: 1; + --font-size-7xl: 4.5rem; + --font-size-7xl--line-height: 1; + --font-size-8xl: 6rem; + --font-size-8xl--line-height: 1; + --font-size-9xl: 8rem; + --font-size-9xl--line-height: 1; + --letter-spacing-tighter: -.05em; + --letter-spacing-tight: -.025em; + --letter-spacing-normal: 0em; + --letter-spacing-wide: .025em; + --letter-spacing-wider: .05em; + --letter-spacing-widest: .1em; + --line-height-none: 1; + --line-height-tight: 1.25; + --line-height-snug: 1.375; + --line-height-normal: 1.5; + --line-height-relaxed: 1.625; + --line-height-loose: 2; + --line-height-3: .75rem; + --line-height-4: 1rem; + --line-height-5: 1.25rem; + --line-height-6: 1.5rem; + --line-height-7: 1.75rem; + --line-height-8: 2rem; + --line-height-9: 2.25rem; + --line-height-10: 2.5rem; + --perspective-dramatic: 100px; + --perspective-near: 300px; + --perspective-normal: 500px; + --perspective-midrange: 800px; + --perspective-distant: 1200px; + --transition-timing-function-linear: linear; + --transition-timing-function-in: cubic-bezier(.4, 0, 1, 1); + --transition-timing-function-out: cubic-bezier(0, 0, .2, 1); + --transition-timing-function-in-out: cubic-bezier(.4, 0, .2, 1); +} + +.w-4 { + width: var(--spacing-4, 1rem); +} + +.bg-red-500 { + background-color: var(--color-red-500, #ef4444); +} + +.shadow { + --tw-shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a; + --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); +} + +@media (width >= 640px) { + .sm\\:flex { + display: flex; + } +} + +@keyframes spin { + to { + transform: rotate(360deg); + } +} + +@keyframes ping { + 75%, 100% { + opacity: 0; + transform: scale(2); + } +} + +@keyframes pulse { + 50% { + opacity: .5; + } +} + +@keyframes bounce { + 0%, 100% { + animation-timing-function: cubic-bezier(.8, 0, 1, 1); + transform: translateY(-25%); + } + + 50% { + animation-timing-function: cubic-bezier(0, 0, .2, 1); + transform: none; + } +} + +@property --tw-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} + +@property --tw-shadow-colored { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} + +@property --tw-inset-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} + +@property --tw-inset-shadow-colored { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} + +@property --tw-ring-color { + syntax: "*"; + inherits: false +} + +@property --tw-ring-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} + +@property --tw-inset-ring-color { + syntax: "*"; + inherits: false +} + +@property --tw-inset-ring-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} + +@property --tw-ring-inset { + syntax: "*"; + inherits: false +} + +@property --tw-ring-offset-width { + syntax: ""; + inherits: false; + initial-value: 0; +} + +@property --tw-ring-offset-color { + syntax: "*"; + inherits: false; + initial-value: #fff; +} + +@property --tw-ring-offset-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +}" +`; diff --git a/packages/tailwindcss/src/backup__snapshots__/intellisense.test.ts.snap b/packages/tailwindcss/src/backup__snapshots__/intellisense.test.ts.snap new file mode 100644 index 000000000000..8978f5123b5e --- /dev/null +++ b/packages/tailwindcss/src/backup__snapshots__/intellisense.test.ts.snap @@ -0,0 +1,2428 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`getClassList 1`] = ` +[ + "-bottom-0.5", + "-bottom-1", + "-bottom-3", + "-bottom-4", + "-end-0.5", + "-end-1", + "-end-3", + "-end-4", + "-indent-0.5", + "-indent-1", + "-indent-3", + "-indent-4", + "-inset-0.5", + "-inset-1", + "-inset-3", + "-inset-4", + "-inset-x-0.5", + "-inset-x-1", + "-inset-x-3", + "-inset-x-4", + "-inset-y-0.5", + "-inset-y-1", + "-inset-y-3", + "-inset-y-4", + "-left-0.5", + "-left-1", + "-left-3", + "-left-4", + "-m-0.5", + "-m-1", + "-m-3", + "-m-4", + "-mb-0.5", + "-mb-1", + "-mb-3", + "-mb-4", + "-me-0.5", + "-me-1", + "-me-3", + "-me-4", + "-ml-0.5", + "-ml-1", + "-ml-3", + "-ml-4", + "-mr-0.5", + "-mr-1", + "-mr-3", + "-mr-4", + "-ms-0.5", + "-ms-1", + "-ms-3", + "-ms-4", + "-mt-0.5", + "-mt-1", + "-mt-3", + "-mt-4", + "-mx-0.5", + "-mx-1", + "-mx-3", + "-mx-4", + "-my-0.5", + "-my-1", + "-my-3", + "-my-4", + "-order-1", + "-order-10", + "-order-11", + "-order-12", + "-order-2", + "-order-3", + "-order-4", + "-order-5", + "-order-6", + "-order-7", + "-order-8", + "-order-9", + "-right-0.5", + "-right-1", + "-right-3", + "-right-4", + "-rotate-0", + "-rotate-1", + "-rotate-12", + "-rotate-180", + "-rotate-2", + "-rotate-3", + "-rotate-45", + "-rotate-6", + "-rotate-90", + "-rotate-x-0", + "-rotate-x-1", + "-rotate-x-12", + "-rotate-x-180", + "-rotate-x-2", + "-rotate-x-3", + "-rotate-x-45", + "-rotate-x-6", + "-rotate-x-90", + "-rotate-y-0", + "-rotate-y-1", + "-rotate-y-12", + "-rotate-y-180", + "-rotate-y-2", + "-rotate-y-3", + "-rotate-y-45", + "-rotate-y-6", + "-rotate-y-90", + "-rotate-z-0", + "-rotate-z-1", + "-rotate-z-12", + "-rotate-z-180", + "-rotate-z-2", + "-rotate-z-3", + "-rotate-z-45", + "-rotate-z-6", + "-rotate-z-90", + "-scale-0", + "-scale-100", + "-scale-105", + "-scale-110", + "-scale-125", + "-scale-150", + "-scale-200", + "-scale-50", + "-scale-75", + "-scale-90", + "-scale-95", + "-scale-x-0", + "-scale-x-100", + "-scale-x-105", + "-scale-x-110", + "-scale-x-125", + "-scale-x-150", + "-scale-x-200", + "-scale-x-50", + "-scale-x-75", + "-scale-x-90", + "-scale-x-95", + "-scale-y-0", + "-scale-y-100", + "-scale-y-105", + "-scale-y-110", + "-scale-y-125", + "-scale-y-150", + "-scale-y-200", + "-scale-y-50", + "-scale-y-75", + "-scale-y-90", + "-scale-y-95", + "-scale-z-0", + "-scale-z-100", + "-scale-z-105", + "-scale-z-110", + "-scale-z-125", + "-scale-z-150", + "-scale-z-200", + "-scale-z-50", + "-scale-z-75", + "-scale-z-90", + "-scale-z-95", + "-scroll-m-0.5", + "-scroll-m-1", + "-scroll-m-3", + "-scroll-m-4", + "-scroll-mb-0.5", + "-scroll-mb-1", + "-scroll-mb-3", + "-scroll-mb-4", + "-scroll-me-0.5", + "-scroll-me-1", + "-scroll-me-3", + "-scroll-me-4", + "-scroll-ml-0.5", + "-scroll-ml-1", + "-scroll-ml-3", + "-scroll-ml-4", + "-scroll-mr-0.5", + "-scroll-mr-1", + "-scroll-mr-3", + "-scroll-mr-4", + "-scroll-ms-0.5", + "-scroll-ms-1", + "-scroll-ms-3", + "-scroll-ms-4", + "-scroll-mt-0.5", + "-scroll-mt-1", + "-scroll-mt-3", + "-scroll-mt-4", + "-scroll-mx-0.5", + "-scroll-mx-1", + "-scroll-mx-3", + "-scroll-mx-4", + "-scroll-my-0.5", + "-scroll-my-1", + "-scroll-my-3", + "-scroll-my-4", + "-scroll-p-0.5", + "-scroll-p-1", + "-scroll-p-3", + "-scroll-p-4", + "-scroll-pb-0.5", + "-scroll-pb-1", + "-scroll-pb-3", + "-scroll-pb-4", + "-scroll-pe-0.5", + "-scroll-pe-1", + "-scroll-pe-3", + "-scroll-pe-4", + "-scroll-pl-0.5", + "-scroll-pl-1", + "-scroll-pl-3", + "-scroll-pl-4", + "-scroll-pr-0.5", + "-scroll-pr-1", + "-scroll-pr-3", + "-scroll-pr-4", + "-scroll-ps-0.5", + "-scroll-ps-1", + "-scroll-ps-3", + "-scroll-ps-4", + "-scroll-pt-0.5", + "-scroll-pt-1", + "-scroll-pt-3", + "-scroll-pt-4", + "-scroll-px-0.5", + "-scroll-px-1", + "-scroll-px-3", + "-scroll-px-4", + "-scroll-py-0.5", + "-scroll-py-1", + "-scroll-py-3", + "-scroll-py-4", + "-skew-0", + "-skew-1", + "-skew-12", + "-skew-2", + "-skew-3", + "-skew-6", + "-skew-x-0", + "-skew-x-1", + "-skew-x-12", + "-skew-x-2", + "-skew-x-3", + "-skew-x-6", + "-skew-y-0", + "-skew-y-1", + "-skew-y-12", + "-skew-y-2", + "-skew-y-3", + "-skew-y-6", + "-space-x-0.5", + "-space-x-1", + "-space-x-3", + "-space-x-4", + "-space-y-0.5", + "-space-y-1", + "-space-y-3", + "-space-y-4", + "-start-0.5", + "-start-1", + "-start-3", + "-start-4", + "-top-0.5", + "-top-1", + "-top-3", + "-top-4", + "-translate-0.5", + "-translate-1", + "-translate-3", + "-translate-4", + "-translate-x-0.5", + "-translate-x-1", + "-translate-x-3", + "-translate-x-4", + "-translate-y-0.5", + "-translate-y-1", + "-translate-y-3", + "-translate-y-4", + "-translate-z-0.5", + "-translate-z-1", + "-translate-z-3", + "-translate-z-4", + "-underline-offset-0", + "-underline-offset-1", + "-underline-offset-2", + "-underline-offset-4", + "-underline-offset-8", + "-z-0", + "-z-10", + "-z-20", + "-z-30", + "-z-40", + "-z-50", + "@container-normal", + "absolute", + "accent-current", + "accent-inherit", + "accent-transparent", + "align-baseline", + "align-bottom", + "align-middle", + "align-sub", + "align-super", + "align-text-bottom", + "align-text-top", + "align-top", + "animate-none", + "antialiased", + "appearance-auto", + "appearance-none", + "aspect-auto", + "aspect-square", + "aspect-video", + "auto-cols-auto", + "auto-cols-fr", + "auto-cols-max", + "auto-cols-min", + "auto-rows-auto", + "auto-rows-fr", + "auto-rows-max", + "auto-rows-min", + "backdrop-brightness-0", + "backdrop-brightness-100", + "backdrop-brightness-105", + "backdrop-brightness-110", + "backdrop-brightness-125", + "backdrop-brightness-150", + "backdrop-brightness-200", + "backdrop-brightness-50", + "backdrop-brightness-75", + "backdrop-brightness-90", + "backdrop-brightness-95", + "backdrop-contrast-0", + "backdrop-contrast-100", + "backdrop-contrast-125", + "backdrop-contrast-150", + "backdrop-contrast-200", + "backdrop-contrast-50", + "backdrop-contrast-75", + "backdrop-grayscale", + "backdrop-grayscale-0", + "backdrop-grayscale-100", + "backdrop-grayscale-25", + "backdrop-grayscale-50", + "backdrop-grayscale-75", + "backdrop-hue-rotate-0", + "backdrop-hue-rotate-15", + "backdrop-hue-rotate-180", + "backdrop-hue-rotate-30", + "backdrop-hue-rotate-60", + "backdrop-hue-rotate-90", + "backdrop-invert", + "backdrop-invert-0", + "backdrop-invert-100", + "backdrop-invert-25", + "backdrop-invert-50", + "backdrop-invert-75", + "backdrop-opacity-0", + "backdrop-opacity-10", + "backdrop-opacity-100", + "backdrop-opacity-15", + "backdrop-opacity-20", + "backdrop-opacity-25", + "backdrop-opacity-30", + "backdrop-opacity-35", + "backdrop-opacity-40", + "backdrop-opacity-45", + "backdrop-opacity-5", + "backdrop-opacity-50", + "backdrop-opacity-55", + "backdrop-opacity-60", + "backdrop-opacity-65", + "backdrop-opacity-70", + "backdrop-opacity-75", + "backdrop-opacity-80", + "backdrop-opacity-85", + "backdrop-opacity-90", + "backdrop-opacity-95", + "backdrop-saturate-0", + "backdrop-saturate-100", + "backdrop-saturate-150", + "backdrop-saturate-200", + "backdrop-saturate-50", + "backdrop-sepia", + "backdrop-sepia-0", + "backdrop-sepia-100", + "backdrop-sepia-50", + "backface-hidden", + "backface-visible", + "basis-0.5", + "basis-1", + "basis-3", + "basis-4", + "basis-4", + "basis-auto", + "basis-full", + "bg-auto", + "bg-blend-color", + "bg-blend-color-burn", + "bg-blend-color-dodge", + "bg-blend-darken", + "bg-blend-difference", + "bg-blend-exclusion", + "bg-blend-hard-light", + "bg-blend-hue", + "bg-blend-lighten", + "bg-blend-luminosity", + "bg-blend-multiply", + "bg-blend-normal", + "bg-blend-overlay", + "bg-blend-saturation", + "bg-blend-screen", + "bg-blend-soft-light", + "bg-bottom", + "bg-center", + "bg-clip-border", + "bg-clip-content", + "bg-clip-padding", + "bg-clip-text", + "bg-contain", + "bg-cover", + "bg-current", + "bg-fixed", + "bg-gradient-to-b", + "bg-gradient-to-bl", + "bg-gradient-to-br", + "bg-gradient-to-l", + "bg-gradient-to-r", + "bg-gradient-to-t", + "bg-gradient-to-tl", + "bg-gradient-to-tr", + "bg-inherit", + "bg-inherit", + "bg-left", + "bg-left-bottom", + "bg-left-top", + "bg-local", + "bg-no-repeat", + "bg-none", + "bg-origin-border", + "bg-origin-content", + "bg-origin-padding", + "bg-repeat", + "bg-repeat-x", + "bg-repeat-y", + "bg-right", + "bg-right-bottom", + "bg-right-top", + "bg-round", + "bg-scroll", + "bg-space", + "bg-top", + "bg-transparent", + "bg-transparent", + "block", + "border", + "border-b", + "border-b-current", + "border-b-inherit", + "border-b-transparent", + "border-collapse", + "border-current", + "border-dashed", + "border-dotted", + "border-double", + "border-e", + "border-e-current", + "border-e-inherit", + "border-e-transparent", + "border-hidden", + "border-inherit", + "border-l", + "border-l-current", + "border-l-inherit", + "border-l-transparent", + "border-none", + "border-r", + "border-r-current", + "border-r-inherit", + "border-r-transparent", + "border-s", + "border-s-current", + "border-s-inherit", + "border-s-transparent", + "border-separate", + "border-solid", + "border-spacing-0.5", + "border-spacing-1", + "border-spacing-3", + "border-spacing-4", + "border-spacing-x-0.5", + "border-spacing-x-1", + "border-spacing-x-3", + "border-spacing-x-4", + "border-spacing-y-0.5", + "border-spacing-y-1", + "border-spacing-y-3", + "border-spacing-y-4", + "border-t", + "border-t-current", + "border-t-inherit", + "border-t-transparent", + "border-transparent", + "border-x", + "border-x-current", + "border-x-inherit", + "border-x-transparent", + "border-y", + "border-y-current", + "border-y-inherit", + "border-y-transparent", + "bottom-0.5", + "bottom-1", + "bottom-3", + "bottom-4", + "bottom-auto", + "bottom-full", + "box-border", + "box-content", + "box-decoration-clone", + "box-decoration-slice", + "break-after-all", + "break-after-auto", + "break-after-avoid", + "break-after-avoid-page", + "break-after-column", + "break-after-left", + "break-after-page", + "break-after-right", + "break-all", + "break-before-all", + "break-before-auto", + "break-before-avoid", + "break-before-avoid-page", + "break-before-column", + "break-before-left", + "break-before-page", + "break-before-right", + "break-inside-auto", + "break-inside-avoid", + "break-inside-avoid-column", + "break-inside-avoid-page", + "break-keep", + "break-normal", + "break-words", + "brightness-0", + "brightness-100", + "brightness-105", + "brightness-110", + "brightness-125", + "brightness-150", + "brightness-200", + "brightness-50", + "brightness-75", + "brightness-90", + "brightness-95", + "capitalize", + "caption-bottom", + "caption-top", + "caret-current", + "caret-inherit", + "caret-transparent", + "clear-both", + "clear-end", + "clear-left", + "clear-none", + "clear-right", + "clear-start", + "col-auto", + "col-end-1", + "col-end-10", + "col-end-11", + "col-end-12", + "col-end-13", + "col-end-2", + "col-end-3", + "col-end-4", + "col-end-5", + "col-end-6", + "col-end-7", + "col-end-8", + "col-end-9", + "col-end-auto", + "col-span-1", + "col-span-10", + "col-span-11", + "col-span-12", + "col-span-2", + "col-span-3", + "col-span-4", + "col-span-5", + "col-span-6", + "col-span-7", + "col-span-8", + "col-span-9", + "col-span-full", + "col-start-1", + "col-start-10", + "col-start-11", + "col-start-12", + "col-start-13", + "col-start-2", + "col-start-3", + "col-start-4", + "col-start-5", + "col-start-6", + "col-start-7", + "col-start-8", + "col-start-9", + "col-start-auto", + "collapse", + "columns-1", + "columns-10", + "columns-11", + "columns-12", + "columns-2", + "columns-3", + "columns-4", + "columns-4", + "columns-5", + "columns-6", + "columns-7", + "columns-8", + "columns-9", + "columns-auto", + "contain-content", + "contain-inline-size", + "contain-layout", + "contain-none", + "contain-paint", + "contain-size", + "contain-strict", + "contain-style", + "content-around", + "content-baseline", + "content-between", + "content-center", + "content-end", + "content-evenly", + "content-none", + "content-normal", + "content-start", + "content-stretch", + "contents", + "contrast-0", + "contrast-100", + "contrast-125", + "contrast-150", + "contrast-200", + "contrast-50", + "contrast-75", + "cursor-alias", + "cursor-all-scroll", + "cursor-auto", + "cursor-cell", + "cursor-col-resize", + "cursor-context-menu", + "cursor-copy", + "cursor-crosshair", + "cursor-default", + "cursor-e-resize", + "cursor-ew-resize", + "cursor-grab", + "cursor-grabbing", + "cursor-help", + "cursor-move", + "cursor-n-resize", + "cursor-ne-resize", + "cursor-nesw-resize", + "cursor-no-drop", + "cursor-none", + "cursor-not-allowed", + "cursor-ns-resize", + "cursor-nw-resize", + "cursor-nwse-resize", + "cursor-pointer", + "cursor-progress", + "cursor-row-resize", + "cursor-s-resize", + "cursor-se-resize", + "cursor-sw-resize", + "cursor-text", + "cursor-vertical-text", + "cursor-w-resize", + "cursor-wait", + "cursor-zoom-in", + "cursor-zoom-out", + "decoration-0", + "decoration-1", + "decoration-2", + "decoration-auto", + "decoration-current", + "decoration-dashed", + "decoration-dotted", + "decoration-double", + "decoration-from-font", + "decoration-inherit", + "decoration-solid", + "decoration-transparent", + "decoration-wavy", + "delay-100", + "delay-1000", + "delay-150", + "delay-200", + "delay-300", + "delay-500", + "delay-700", + "delay-75", + "diagonal-fractions", + "divide-current", + "divide-dashed", + "divide-dotted", + "divide-double", + "divide-inherit", + "divide-none", + "divide-solid", + "divide-transparent", + "divide-x", + "divide-x-0", + "divide-x-2", + "divide-x-4", + "divide-x-8", + "divide-x-reverse", + "divide-y", + "divide-y-0", + "divide-y-2", + "divide-y-4", + "divide-y-8", + "divide-y-reverse", + "duration-100", + "duration-1000", + "duration-150", + "duration-200", + "duration-300", + "duration-500", + "duration-700", + "duration-75", + "end-0.5", + "end-1", + "end-3", + "end-4", + "end-auto", + "end-full", + "fill-current", + "fill-inherit", + "fill-transparent", + "fixed", + "flex-auto", + "flex-col", + "flex-col-reverse", + "flex-initial", + "flex-none", + "flex-nowrap", + "flex-row", + "flex-row-reverse", + "flex-wrap", + "flex-wrap-reverse", + "float-end", + "float-left", + "float-none", + "float-right", + "float-start", + "flow-root", + "font-black", + "font-bold", + "font-extrabold", + "font-extralight", + "font-light", + "font-medium", + "font-normal", + "font-semibold", + "font-stretch-100%", + "font-stretch-105%", + "font-stretch-110%", + "font-stretch-125%", + "font-stretch-150%", + "font-stretch-200%", + "font-stretch-50%", + "font-stretch-75%", + "font-stretch-90%", + "font-stretch-95%", + "font-stretch-condensed", + "font-stretch-expanded", + "font-stretch-extra-condensed", + "font-stretch-extra-expanded", + "font-stretch-normal", + "font-stretch-semi-condensed", + "font-stretch-semi-expanded", + "font-stretch-ultra-condensed", + "font-stretch-ultra-expanded", + "font-thin", + "forced-color-adjust-auto", + "forced-color-adjust-none", + "from-0%", + "from-10%", + "from-100%", + "from-15%", + "from-20%", + "from-25%", + "from-30%", + "from-35%", + "from-40%", + "from-45%", + "from-5%", + "from-50%", + "from-55%", + "from-60%", + "from-65%", + "from-70%", + "from-75%", + "from-80%", + "from-85%", + "from-90%", + "from-95%", + "from-current", + "from-inherit", + "from-transparent", + "gap-0.5", + "gap-1", + "gap-3", + "gap-4", + "gap-x-0.5", + "gap-x-1", + "gap-x-3", + "gap-x-4", + "gap-y-0.5", + "gap-y-1", + "gap-y-3", + "gap-y-4", + "grayscale", + "grayscale-0", + "grayscale-100", + "grayscale-25", + "grayscale-50", + "grayscale-75", + "grid", + "grid-cols-1", + "grid-cols-10", + "grid-cols-11", + "grid-cols-12", + "grid-cols-2", + "grid-cols-3", + "grid-cols-4", + "grid-cols-5", + "grid-cols-6", + "grid-cols-7", + "grid-cols-8", + "grid-cols-9", + "grid-cols-none", + "grid-cols-subgrid", + "grid-flow-col", + "grid-flow-col-dense", + "grid-flow-dense", + "grid-flow-row", + "grid-flow-row-dense", + "grid-rows-1", + "grid-rows-10", + "grid-rows-11", + "grid-rows-12", + "grid-rows-2", + "grid-rows-3", + "grid-rows-4", + "grid-rows-5", + "grid-rows-6", + "grid-rows-7", + "grid-rows-8", + "grid-rows-9", + "grid-rows-none", + "grid-rows-subgrid", + "grow", + "grow-0", + "h-0.5", + "h-1", + "h-3", + "h-4", + "h-auto", + "h-dvh", + "h-fit", + "h-full", + "h-lvh", + "h-max", + "h-min", + "h-screen", + "h-svh", + "hidden", + "hue-rotate-0", + "hue-rotate-15", + "hue-rotate-180", + "hue-rotate-30", + "hue-rotate-60", + "hue-rotate-90", + "hyphens-auto", + "hyphens-manual", + "hyphens-none", + "indent-0.5", + "indent-1", + "indent-3", + "indent-4", + "inline", + "inline-block", + "inline-flex", + "inline-grid", + "inline-table", + "inset-0.5", + "inset-1", + "inset-3", + "inset-4", + "inset-auto", + "inset-full", + "inset-ring", + "inset-ring-0", + "inset-ring-1", + "inset-ring-2", + "inset-ring-4", + "inset-ring-8", + "inset-ring-current", + "inset-ring-inherit", + "inset-ring-transparent", + "inset-shadow", + "inset-shadow-current", + "inset-shadow-inherit", + "inset-shadow-transparent", + "inset-x-0.5", + "inset-x-1", + "inset-x-3", + "inset-x-4", + "inset-x-auto", + "inset-x-full", + "inset-y-0.5", + "inset-y-1", + "inset-y-3", + "inset-y-4", + "inset-y-auto", + "inset-y-full", + "invert", + "invert-0", + "invert-100", + "invert-25", + "invert-50", + "invert-75", + "invisible", + "isolate", + "isolation-auto", + "italic", + "items-baseline", + "items-center", + "items-end", + "items-start", + "items-stretch", + "justify-around", + "justify-baseline", + "justify-between", + "justify-center", + "justify-end", + "justify-evenly", + "justify-items-center", + "justify-items-end", + "justify-items-normal", + "justify-items-start", + "justify-items-stretch", + "justify-normal", + "justify-self-auto", + "justify-self-center", + "justify-self-end", + "justify-self-start", + "justify-self-stretch", + "justify-start", + "justify-stretch", + "left-0.5", + "left-1", + "left-3", + "left-4", + "left-auto", + "left-full", + "line-clamp-1", + "line-clamp-2", + "line-clamp-3", + "line-clamp-4", + "line-clamp-5", + "line-clamp-6", + "line-clamp-none", + "line-through", + "lining-nums", + "list-decimal", + "list-disc", + "list-image-none", + "list-inside", + "list-item", + "list-none", + "list-outside", + "lowercase", + "m-0.5", + "m-1", + "m-3", + "m-4", + "m-auto", + "max-h-0.5", + "max-h-1", + "max-h-3", + "max-h-4", + "max-h-dvh", + "max-h-fit", + "max-h-full", + "max-h-lvh", + "max-h-max", + "max-h-min", + "max-h-none", + "max-h-screen", + "max-h-svh", + "max-w-0.5", + "max-w-1", + "max-w-3", + "max-w-4", + "max-w-4", + "max-w-fit", + "max-w-full", + "max-w-max", + "max-w-min", + "max-w-none", + "mb-0.5", + "mb-1", + "mb-3", + "mb-4", + "mb-auto", + "me-0.5", + "me-1", + "me-3", + "me-4", + "me-auto", + "min-h-0.5", + "min-h-1", + "min-h-3", + "min-h-4", + "min-h-auto", + "min-h-dvh", + "min-h-fit", + "min-h-full", + "min-h-lvh", + "min-h-max", + "min-h-min", + "min-h-screen", + "min-h-svh", + "min-w-0.5", + "min-w-1", + "min-w-3", + "min-w-4", + "min-w-4", + "min-w-auto", + "min-w-fit", + "min-w-full", + "min-w-max", + "min-w-min", + "mix-blend-color", + "mix-blend-color-burn", + "mix-blend-color-dodge", + "mix-blend-darken", + "mix-blend-difference", + "mix-blend-exclusion", + "mix-blend-hard-light", + "mix-blend-hue", + "mix-blend-lighten", + "mix-blend-luminosity", + "mix-blend-multiply", + "mix-blend-normal", + "mix-blend-overlay", + "mix-blend-plus-darker", + "mix-blend-plus-lighter", + "mix-blend-saturation", + "mix-blend-screen", + "mix-blend-soft-light", + "ml-0.5", + "ml-1", + "ml-3", + "ml-4", + "ml-auto", + "mr-0.5", + "mr-1", + "mr-3", + "mr-4", + "mr-auto", + "ms-0.5", + "ms-1", + "ms-3", + "ms-4", + "ms-auto", + "mt-0.5", + "mt-1", + "mt-3", + "mt-4", + "mt-auto", + "mx-0.5", + "mx-1", + "mx-3", + "mx-4", + "mx-auto", + "my-0.5", + "my-1", + "my-3", + "my-4", + "my-auto", + "no-underline", + "normal-case", + "normal-nums", + "not-italic", + "not-sr-only", + "object-bottom", + "object-center", + "object-contain", + "object-cover", + "object-fill", + "object-left", + "object-left-bottom", + "object-left-top", + "object-none", + "object-right", + "object-right-bottom", + "object-right-top", + "object-scale-down", + "object-top", + "oldstyle-nums", + "opacity-0", + "opacity-10", + "opacity-100", + "opacity-15", + "opacity-20", + "opacity-25", + "opacity-30", + "opacity-35", + "opacity-40", + "opacity-45", + "opacity-5", + "opacity-50", + "opacity-55", + "opacity-60", + "opacity-65", + "opacity-70", + "opacity-75", + "opacity-80", + "opacity-85", + "opacity-90", + "opacity-95", + "order-1", + "order-10", + "order-11", + "order-12", + "order-2", + "order-3", + "order-4", + "order-5", + "order-6", + "order-7", + "order-8", + "order-9", + "order-first", + "order-last", + "order-none", + "ordinal", + "origin-bottom", + "origin-bottom-left", + "origin-bottom-right", + "origin-center", + "origin-left", + "origin-right", + "origin-top", + "origin-top-left", + "origin-top-right", + "outline", + "outline-0", + "outline-1", + "outline-2", + "outline-4", + "outline-8", + "outline-current", + "outline-dashed", + "outline-dotted", + "outline-double", + "outline-inherit", + "outline-none", + "outline-offset-0", + "outline-offset-1", + "outline-offset-2", + "outline-offset-4", + "outline-offset-8", + "outline-solid", + "outline-transparent", + "overflow-auto", + "overflow-clip", + "overflow-hidden", + "overflow-scroll", + "overflow-visible", + "overflow-x-auto", + "overflow-x-clip", + "overflow-x-hidden", + "overflow-x-scroll", + "overflow-x-visible", + "overflow-y-auto", + "overflow-y-clip", + "overflow-y-hidden", + "overflow-y-scroll", + "overflow-y-visible", + "overline", + "overscroll-auto", + "overscroll-contain", + "overscroll-none", + "overscroll-x-auto", + "overscroll-x-contain", + "overscroll-x-none", + "overscroll-y-auto", + "overscroll-y-contain", + "overscroll-y-none", + "p-0.5", + "p-1", + "p-3", + "p-4", + "pb-0.5", + "pb-1", + "pb-3", + "pb-4", + "pe-0.5", + "pe-1", + "pe-3", + "pe-4", + "perspective-dramatic", + "perspective-none", + "perspective-normal", + "perspective-origin-bottom", + "perspective-origin-bottom-left", + "perspective-origin-bottom-right", + "perspective-origin-center", + "perspective-origin-left", + "perspective-origin-right", + "perspective-origin-top", + "perspective-origin-top-left", + "perspective-origin-top-right", + "pl-0.5", + "pl-1", + "pl-3", + "pl-4", + "place-content-around", + "place-content-baseline", + "place-content-between", + "place-content-center", + "place-content-end", + "place-content-evenly", + "place-content-start", + "place-content-stretch", + "place-items-baseline", + "place-items-center", + "place-items-end", + "place-items-start", + "place-items-stretch", + "place-self-auto", + "place-self-center", + "place-self-end", + "place-self-start", + "place-self-stretch", + "placeholder-current", + "placeholder-inherit", + "placeholder-transparent", + "pointer-events-auto", + "pointer-events-none", + "pr-0.5", + "pr-1", + "pr-3", + "pr-4", + "proportional-nums", + "ps-0.5", + "ps-1", + "ps-3", + "ps-4", + "pt-0.5", + "pt-1", + "pt-3", + "pt-4", + "px-0.5", + "px-1", + "px-3", + "px-4", + "py-0.5", + "py-1", + "py-3", + "py-4", + "relative", + "resize-both", + "resize-none", + "resize-x", + "resize-y", + "right-0.5", + "right-1", + "right-3", + "right-4", + "right-auto", + "right-full", + "ring", + "ring-0", + "ring-1", + "ring-2", + "ring-4", + "ring-8", + "ring-current", + "ring-inherit", + "ring-inset", + "ring-offset-0", + "ring-offset-1", + "ring-offset-2", + "ring-offset-4", + "ring-offset-8", + "ring-offset-current", + "ring-offset-inherit", + "ring-offset-transparent", + "ring-transparent", + "rotate-0", + "rotate-1", + "rotate-12", + "rotate-180", + "rotate-2", + "rotate-3", + "rotate-45", + "rotate-6", + "rotate-90", + "rotate-none", + "rotate-x-0", + "rotate-x-1", + "rotate-x-12", + "rotate-x-180", + "rotate-x-2", + "rotate-x-3", + "rotate-x-45", + "rotate-x-6", + "rotate-x-90", + "rotate-y-0", + "rotate-y-1", + "rotate-y-12", + "rotate-y-180", + "rotate-y-2", + "rotate-y-3", + "rotate-y-45", + "rotate-y-6", + "rotate-y-90", + "rotate-z-0", + "rotate-z-1", + "rotate-z-12", + "rotate-z-180", + "rotate-z-2", + "rotate-z-3", + "rotate-z-45", + "rotate-z-6", + "rotate-z-90", + "rounded-b-full", + "rounded-b-none", + "rounded-bl-full", + "rounded-bl-none", + "rounded-br-full", + "rounded-br-none", + "rounded-e-full", + "rounded-e-none", + "rounded-ee-full", + "rounded-ee-none", + "rounded-es-full", + "rounded-es-none", + "rounded-full", + "rounded-l-full", + "rounded-l-none", + "rounded-none", + "rounded-r-full", + "rounded-r-none", + "rounded-s-full", + "rounded-s-none", + "rounded-se-full", + "rounded-se-none", + "rounded-ss-full", + "rounded-ss-none", + "rounded-t-full", + "rounded-t-none", + "rounded-tl-full", + "rounded-tl-none", + "rounded-tr-full", + "rounded-tr-none", + "row-auto", + "row-end-1", + "row-end-10", + "row-end-11", + "row-end-12", + "row-end-13", + "row-end-2", + "row-end-3", + "row-end-4", + "row-end-5", + "row-end-6", + "row-end-7", + "row-end-8", + "row-end-9", + "row-end-auto", + "row-span-1", + "row-span-10", + "row-span-11", + "row-span-12", + "row-span-2", + "row-span-3", + "row-span-4", + "row-span-5", + "row-span-6", + "row-span-7", + "row-span-8", + "row-span-9", + "row-span-full", + "row-start-1", + "row-start-10", + "row-start-11", + "row-start-12", + "row-start-13", + "row-start-2", + "row-start-3", + "row-start-4", + "row-start-5", + "row-start-6", + "row-start-7", + "row-start-8", + "row-start-9", + "row-start-auto", + "saturate-0", + "saturate-100", + "saturate-150", + "saturate-200", + "saturate-50", + "scale-0", + "scale-100", + "scale-105", + "scale-110", + "scale-125", + "scale-150", + "scale-200", + "scale-3d", + "scale-50", + "scale-75", + "scale-90", + "scale-95", + "scale-none", + "scale-x-0", + "scale-x-100", + "scale-x-105", + "scale-x-110", + "scale-x-125", + "scale-x-150", + "scale-x-200", + "scale-x-50", + "scale-x-75", + "scale-x-90", + "scale-x-95", + "scale-y-0", + "scale-y-100", + "scale-y-105", + "scale-y-110", + "scale-y-125", + "scale-y-150", + "scale-y-200", + "scale-y-50", + "scale-y-75", + "scale-y-90", + "scale-y-95", + "scale-z-0", + "scale-z-100", + "scale-z-105", + "scale-z-110", + "scale-z-125", + "scale-z-150", + "scale-z-200", + "scale-z-50", + "scale-z-75", + "scale-z-90", + "scale-z-95", + "scroll-auto", + "scroll-m-0.5", + "scroll-m-1", + "scroll-m-3", + "scroll-m-4", + "scroll-mb-0.5", + "scroll-mb-1", + "scroll-mb-3", + "scroll-mb-4", + "scroll-me-0.5", + "scroll-me-1", + "scroll-me-3", + "scroll-me-4", + "scroll-ml-0.5", + "scroll-ml-1", + "scroll-ml-3", + "scroll-ml-4", + "scroll-mr-0.5", + "scroll-mr-1", + "scroll-mr-3", + "scroll-mr-4", + "scroll-ms-0.5", + "scroll-ms-1", + "scroll-ms-3", + "scroll-ms-4", + "scroll-mt-0.5", + "scroll-mt-1", + "scroll-mt-3", + "scroll-mt-4", + "scroll-mx-0.5", + "scroll-mx-1", + "scroll-mx-3", + "scroll-mx-4", + "scroll-my-0.5", + "scroll-my-1", + "scroll-my-3", + "scroll-my-4", + "scroll-p-0.5", + "scroll-p-1", + "scroll-p-3", + "scroll-p-4", + "scroll-pb-0.5", + "scroll-pb-1", + "scroll-pb-3", + "scroll-pb-4", + "scroll-pe-0.5", + "scroll-pe-1", + "scroll-pe-3", + "scroll-pe-4", + "scroll-pl-0.5", + "scroll-pl-1", + "scroll-pl-3", + "scroll-pl-4", + "scroll-pr-0.5", + "scroll-pr-1", + "scroll-pr-3", + "scroll-pr-4", + "scroll-ps-0.5", + "scroll-ps-1", + "scroll-ps-3", + "scroll-ps-4", + "scroll-pt-0.5", + "scroll-pt-1", + "scroll-pt-3", + "scroll-pt-4", + "scroll-px-0.5", + "scroll-px-1", + "scroll-px-3", + "scroll-px-4", + "scroll-py-0.5", + "scroll-py-1", + "scroll-py-3", + "scroll-py-4", + "scroll-smooth", + "select-all", + "select-auto", + "select-none", + "select-text", + "self-auto", + "self-baseline", + "self-center", + "self-end", + "self-start", + "self-stretch", + "sepia", + "sepia-0", + "sepia-100", + "sepia-50", + "shadow", + "shadow-current", + "shadow-inherit", + "shadow-transparent", + "shrink", + "shrink-0", + "size-0.5", + "size-1", + "size-3", + "size-4", + "size-auto", + "size-fit", + "size-full", + "size-max", + "size-min", + "skew-0", + "skew-1", + "skew-12", + "skew-2", + "skew-3", + "skew-6", + "skew-x-0", + "skew-x-1", + "skew-x-12", + "skew-x-2", + "skew-x-3", + "skew-x-6", + "skew-y-0", + "skew-y-1", + "skew-y-12", + "skew-y-2", + "skew-y-3", + "skew-y-6", + "slashed-zero", + "snap-align-none", + "snap-always", + "snap-both", + "snap-center", + "snap-end", + "snap-mandatory", + "snap-none", + "snap-normal", + "snap-proximity", + "snap-start", + "snap-x", + "snap-y", + "space-x-0.5", + "space-x-1", + "space-x-3", + "space-x-4", + "space-x-reverse", + "space-y-0.5", + "space-y-1", + "space-y-3", + "space-y-4", + "space-y-reverse", + "sr-only", + "stacked-fractions", + "start-0.5", + "start-1", + "start-3", + "start-4", + "start-auto", + "start-full", + "static", + "sticky", + "stroke-0", + "stroke-1", + "stroke-2", + "stroke-3", + "stroke-current", + "stroke-inherit", + "stroke-none", + "stroke-transparent", + "subpixel-antialiased", + "table", + "table-auto", + "table-caption", + "table-cell", + "table-column", + "table-column-group", + "table-fixed", + "table-footer-group", + "table-header-group", + "table-row", + "table-row-group", + "tabular-nums", + "text-balance", + "text-center", + "text-clip", + "text-current", + "text-ellipsis", + "text-end", + "text-inherit", + "text-justify", + "text-left", + "text-nowrap", + "text-pretty", + "text-right", + "text-start", + "text-transparent", + "text-wrap", + "text-xs", + "to-0%", + "to-10%", + "to-100%", + "to-15%", + "to-20%", + "to-25%", + "to-30%", + "to-35%", + "to-40%", + "to-45%", + "to-5%", + "to-50%", + "to-55%", + "to-60%", + "to-65%", + "to-70%", + "to-75%", + "to-80%", + "to-85%", + "to-90%", + "to-95%", + "to-current", + "to-inherit", + "to-transparent", + "top-0.5", + "top-1", + "top-3", + "top-4", + "top-auto", + "top-full", + "touch-auto", + "touch-manipulation", + "touch-none", + "touch-pan-down", + "touch-pan-left", + "touch-pan-right", + "touch-pan-up", + "touch-pan-x", + "touch-pan-y", + "touch-pinch-zoom", + "transform", + "transform-3d", + "transform-border", + "transform-content", + "transform-cpu", + "transform-fill", + "transform-flat", + "transform-gpu", + "transform-none", + "transform-stroke", + "transform-view", + "transition", + "transition-all", + "transition-colors", + "transition-none", + "transition-opacity", + "transition-shadow", + "transition-transform", + "translate-0.5", + "translate-1", + "translate-3", + "translate-3d", + "translate-4", + "translate-full", + "translate-none", + "translate-x-0.5", + "translate-x-1", + "translate-x-3", + "translate-x-4", + "translate-x-full", + "translate-x-px", + "translate-y-0.5", + "translate-y-1", + "translate-y-3", + "translate-y-4", + "translate-y-full", + "translate-y-px", + "translate-z-0.5", + "translate-z-1", + "translate-z-3", + "translate-z-4", + "translate-z-px", + "truncate", + "underline", + "underline-offset-0", + "underline-offset-1", + "underline-offset-2", + "underline-offset-4", + "underline-offset-8", + "underline-offset-auto", + "uppercase", + "via-0%", + "via-10%", + "via-100%", + "via-15%", + "via-20%", + "via-25%", + "via-30%", + "via-35%", + "via-40%", + "via-45%", + "via-5%", + "via-50%", + "via-55%", + "via-60%", + "via-65%", + "via-70%", + "via-75%", + "via-80%", + "via-85%", + "via-90%", + "via-95%", + "via-current", + "via-inherit", + "via-none", + "via-transparent", + "visible", + "w-0.5", + "w-1", + "w-3", + "w-4", + "w-4", + "w-auto", + "w-dvw", + "w-fit", + "w-full", + "w-lvw", + "w-max", + "w-min", + "w-screen", + "w-svw", + "whitespace-break-spaces", + "whitespace-normal", + "whitespace-nowrap", + "whitespace-pre", + "whitespace-pre-line", + "whitespace-pre-wrap", + "will-change-auto", + "will-change-contents", + "will-change-scroll", + "will-change-transform", + "z-0", + "z-10", + "z-20", + "z-30", + "z-40", + "z-50", + "z-auto", +] +`; + +exports[`getVariants 1`] = ` +[ + { + "hasDash": true, + "isArbitrary": false, + "name": "force", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "*", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "not", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "group", + "selectors": [Function], + "values": [ + "not", + "group", + "peer", + "first", + "last", + "only", + "odd", + "even", + "first-of-type", + "last-of-type", + "only-of-type", + "visited", + "target", + "open", + "default", + "checked", + "indeterminate", + "placeholder-shown", + "autofill", + "optional", + "required", + "valid", + "invalid", + "in-range", + "out-of-range", + "read-only", + "empty", + "focus-within", + "hover", + "focus", + "focus-visible", + "active", + "enabled", + "disabled", + "has", + "aria", + "data", + "ltr", + "rtl", + ], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "peer", + "selectors": [Function], + "values": [ + "not", + "group", + "peer", + "first", + "last", + "only", + "odd", + "even", + "first-of-type", + "last-of-type", + "only-of-type", + "visited", + "target", + "open", + "default", + "checked", + "indeterminate", + "placeholder-shown", + "autofill", + "optional", + "required", + "valid", + "invalid", + "in-range", + "out-of-range", + "read-only", + "empty", + "focus-within", + "hover", + "focus", + "focus-visible", + "active", + "enabled", + "disabled", + "has", + "aria", + "data", + "ltr", + "rtl", + ], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "first-letter", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "first-line", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "marker", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "selection", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "file", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "placeholder", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "backdrop", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "before", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "after", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "first", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "last", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "only", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "odd", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "even", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "first-of-type", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "last-of-type", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "only-of-type", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "visited", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "target", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "open", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "default", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "checked", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "indeterminate", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "placeholder-shown", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "autofill", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "optional", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "required", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "valid", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "invalid", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "in-range", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "out-of-range", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "read-only", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "empty", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "focus-within", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "hover", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "focus", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "focus-visible", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "active", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "enabled", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "disabled", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "has", + "selectors": [Function], + "values": [ + "not", + "group", + "peer", + "first", + "last", + "only", + "odd", + "even", + "first-of-type", + "last-of-type", + "only-of-type", + "visited", + "target", + "open", + "default", + "checked", + "indeterminate", + "placeholder-shown", + "autofill", + "optional", + "required", + "valid", + "invalid", + "in-range", + "out-of-range", + "read-only", + "empty", + "focus-within", + "hover", + "focus", + "focus-visible", + "active", + "enabled", + "disabled", + "has", + "aria", + "data", + "ltr", + "rtl", + ], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "aria", + "selectors": [Function], + "values": [ + "busy", + "checked", + "disabled", + "expanded", + "hidden", + "pressed", + "readonly", + "required", + "selected", + ], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "data", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "supports", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "motion-safe", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "motion-reduce", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "contrast-more", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "contrast-less", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "max", + "selectors": [Function], + "values": [ + "sm", + ], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "sm", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "min", + "selectors": [Function], + "values": [ + "sm", + ], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "@max", + "selectors": [Function], + "values": [ + "4", + ], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "@", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": true, + "name": "@min", + "selectors": [Function], + "values": [ + "4", + ], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "portrait", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "landscape", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "ltr", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "rtl", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "dark", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "starting", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "print", + "selectors": [Function], + "values": [], + }, + { + "hasDash": true, + "isArbitrary": false, + "name": "forced-colors", + "selectors": [Function], + "values": [], + }, +] +`; diff --git a/packages/tailwindcss/src/backup__snapshots__/utilities.test.ts.snap b/packages/tailwindcss/src/backup__snapshots__/utilities.test.ts.snap new file mode 100644 index 000000000000..feeb8550adfa --- /dev/null +++ b/packages/tailwindcss/src/backup__snapshots__/utilities.test.ts.snap @@ -0,0 +1,1082 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`border-* 1`] = ` +":root { + --radius-none: 0px; + --radius-full: 9999px; + --radius-sm: .125rem; + --color-red-500: #ef4444; +} + +.border { + border-style: var(--tw-border-style); + border-width: 1px; +} + +.border-0 { + border-style: var(--tw-border-style); + border-width: 0; +} + +.border-123 { + border-style: var(--tw-border-style); + border-width: 123px; +} + +.border-2 { + border-style: var(--tw-border-style); + border-width: 2px; +} + +.border-4 { + border-style: var(--tw-border-style); + border-width: 4px; +} + +.border-\\[12px\\] { + border-style: var(--tw-border-style); + border-width: 12px; +} + +.border-\\[length\\:--my-width\\], .border-\\[line-width\\:--my-width\\] { + border-style: var(--tw-border-style); + border-width: var(--my-width); +} + +.border-\\[medium\\] { + border-style: var(--tw-border-style); + border-width: medium; +} + +.border-\\[thick\\] { + border-style: var(--tw-border-style); + border-width: thick; +} + +.border-\\[thin\\] { + border-style: var(--tw-border-style); + border-width: thin; +} + +.border-\\[\\#0088cc\\] { + border-color: #08c; +} + +.border-\\[\\#0088cc\\]\\/50 { + border-color: #0088cc80; +} + +.border-\\[--my-color\\] { + border-color: var(--my-color); +} + +.border-\\[--my-color\\]\\/50 { + border-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-\\[color\\:--my-color\\] { + border-color: var(--my-color); +} + +.border-\\[color\\:--my-color\\]\\/50 { + border-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-current { + border-color: currentColor; +} + +.border-current\\/50 { + border-color: color-mix(in srgb, currentColor 50%, transparent); +} + +.border-inherit { + border-color: inherit; +} + +.border-red-500 { + border-color: var(--color-red-500, #ef4444); +} + +.border-red-500\\/50 { + border-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); +} + +.border-transparent { + border-color: #0000; +} + +@property --tw-border-style { + syntax: ""; + inherits: false; + initial-value: solid; +}" +`; + +exports[`border-b-* 1`] = ` +":root { + --radius-none: 0px; + --radius-full: 9999px; + --radius-sm: .125rem; + --color-red-500: #ef4444; +} + +.border-b { + border-bottom-style: var(--tw-border-style); + border-bottom-width: 1px; +} + +.border-b-0 { + border-bottom-style: var(--tw-border-style); + border-bottom-width: 0; +} + +.border-b-123 { + border-bottom-style: var(--tw-border-style); + border-bottom-width: 123px; +} + +.border-b-2 { + border-bottom-style: var(--tw-border-style); + border-bottom-width: 2px; +} + +.border-b-4 { + border-bottom-style: var(--tw-border-style); + border-bottom-width: 4px; +} + +.border-b-\\[12px\\] { + border-bottom-style: var(--tw-border-style); + border-bottom-width: 12px; +} + +.border-b-\\[length\\:--my-width\\], .border-b-\\[line-width\\:--my-width\\] { + border-bottom-style: var(--tw-border-style); + border-bottom-width: var(--my-width); +} + +.border-b-\\[medium\\] { + border-bottom-style: var(--tw-border-style); + border-bottom-width: medium; +} + +.border-b-\\[thick\\] { + border-bottom-style: var(--tw-border-style); + border-bottom-width: thick; +} + +.border-b-\\[thin\\] { + border-bottom-style: var(--tw-border-style); + border-bottom-width: thin; +} + +.border-b-\\[\\#0088cc\\] { + border-bottom-color: #08c; +} + +.border-b-\\[\\#0088cc\\]\\/50 { + border-bottom-color: #0088cc80; +} + +.border-b-\\[--my-color\\] { + border-bottom-color: var(--my-color); +} + +.border-b-\\[--my-color\\]\\/50 { + border-bottom-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-b-\\[color\\:--my-color\\] { + border-bottom-color: var(--my-color); +} + +.border-b-\\[color\\:--my-color\\]\\/50 { + border-bottom-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-b-current { + border-bottom-color: currentColor; +} + +.border-b-current\\/50 { + border-bottom-color: color-mix(in srgb, currentColor 50%, transparent); +} + +.border-b-inherit { + border-bottom-color: inherit; +} + +.border-b-red-500 { + border-bottom-color: var(--color-red-500, #ef4444); +} + +.border-b-red-500\\/50 { + border-bottom-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); +} + +.border-b-transparent { + border-bottom-color: #0000; +} + +@property --tw-border-style { + syntax: ""; + inherits: false; + initial-value: solid; +}" +`; + +exports[`border-e-* 1`] = ` +":root { + --radius-none: 0px; + --radius-full: 9999px; + --radius-sm: .125rem; + --color-red-500: #ef4444; +} + +.border-e { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: 1px; +} + +.border-e-0 { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: 0; +} + +.border-e-123 { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: 123px; +} + +.border-e-2 { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: 2px; +} + +.border-e-4 { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: 4px; +} + +.border-e-\\[12px\\] { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: 12px; +} + +.border-e-\\[length\\:--my-width\\], .border-e-\\[line-width\\:--my-width\\] { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: var(--my-width); +} + +.border-e-\\[medium\\] { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: medium; +} + +.border-e-\\[thick\\] { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: thick; +} + +.border-e-\\[thin\\] { + border-inline-end-style: var(--tw-border-style); + border-inline-end-width: thin; +} + +.border-e-\\[\\#0088cc\\] { + border-inline-end-color: #08c; +} + +.border-e-\\[\\#0088cc\\]\\/50 { + border-inline-end-color: #0088cc80; +} + +.border-e-\\[--my-color\\] { + border-inline-end-color: var(--my-color); +} + +.border-e-\\[--my-color\\]\\/50 { + border-inline-end-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-e-\\[color\\:--my-color\\] { + border-inline-end-color: var(--my-color); +} + +.border-e-\\[color\\:--my-color\\]\\/50 { + border-inline-end-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-e-current { + border-inline-end-color: currentColor; +} + +.border-e-current\\/50 { + border-inline-end-color: color-mix(in srgb, currentColor 50%, transparent); +} + +.border-e-inherit { + border-inline-end-color: inherit; +} + +.border-e-red-500 { + border-inline-end-color: var(--color-red-500, #ef4444); +} + +.border-e-red-500\\/50 { + border-inline-end-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); +} + +.border-e-transparent { + border-inline-end-color: #0000; +} + +@property --tw-border-style { + syntax: ""; + inherits: false; + initial-value: solid; +}" +`; + +exports[`border-l-* 1`] = ` +":root { + --radius-none: 0px; + --radius-full: 9999px; + --radius-sm: .125rem; + --color-red-500: #ef4444; +} + +.border-l { + border-left-style: var(--tw-border-style); + border-left-width: 1px; +} + +.border-l-0 { + border-left-style: var(--tw-border-style); + border-left-width: 0; +} + +.border-l-123 { + border-left-style: var(--tw-border-style); + border-left-width: 123px; +} + +.border-l-2 { + border-left-style: var(--tw-border-style); + border-left-width: 2px; +} + +.border-l-4 { + border-left-style: var(--tw-border-style); + border-left-width: 4px; +} + +.border-l-\\[12px\\] { + border-left-style: var(--tw-border-style); + border-left-width: 12px; +} + +.border-l-\\[length\\:--my-width\\], .border-l-\\[line-width\\:--my-width\\] { + border-left-style: var(--tw-border-style); + border-left-width: var(--my-width); +} + +.border-l-\\[medium\\] { + border-left-style: var(--tw-border-style); + border-left-width: medium; +} + +.border-l-\\[thick\\] { + border-left-style: var(--tw-border-style); + border-left-width: thick; +} + +.border-l-\\[thin\\] { + border-left-style: var(--tw-border-style); + border-left-width: thin; +} + +.border-l-\\[\\#0088cc\\] { + border-left-color: #08c; +} + +.border-l-\\[\\#0088cc\\]\\/50 { + border-left-color: #0088cc80; +} + +.border-l-\\[--my-color\\] { + border-left-color: var(--my-color); +} + +.border-l-\\[--my-color\\]\\/50 { + border-left-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-l-\\[color\\:--my-color\\] { + border-left-color: var(--my-color); +} + +.border-l-\\[color\\:--my-color\\]\\/50 { + border-left-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-l-current { + border-left-color: currentColor; +} + +.border-l-current\\/50 { + border-left-color: color-mix(in srgb, currentColor 50%, transparent); +} + +.border-l-inherit { + border-left-color: inherit; +} + +.border-l-red-500 { + border-left-color: var(--color-red-500, #ef4444); +} + +.border-l-red-500\\/50 { + border-left-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); +} + +.border-l-transparent { + border-left-color: #0000; +} + +@property --tw-border-style { + syntax: ""; + inherits: false; + initial-value: solid; +}" +`; + +exports[`border-r-* 1`] = ` +":root { + --radius-none: 0px; + --radius-full: 9999px; + --radius-sm: .125rem; + --color-red-500: #ef4444; +} + +.border-r { + border-right-style: var(--tw-border-style); + border-right-width: 1px; +} + +.border-r-0 { + border-right-style: var(--tw-border-style); + border-right-width: 0; +} + +.border-r-123 { + border-right-style: var(--tw-border-style); + border-right-width: 123px; +} + +.border-r-2 { + border-right-style: var(--tw-border-style); + border-right-width: 2px; +} + +.border-r-4 { + border-right-style: var(--tw-border-style); + border-right-width: 4px; +} + +.border-r-\\[12px\\] { + border-right-style: var(--tw-border-style); + border-right-width: 12px; +} + +.border-r-\\[length\\:--my-width\\], .border-r-\\[line-width\\:--my-width\\] { + border-right-style: var(--tw-border-style); + border-right-width: var(--my-width); +} + +.border-r-\\[medium\\] { + border-right-style: var(--tw-border-style); + border-right-width: medium; +} + +.border-r-\\[thick\\] { + border-right-style: var(--tw-border-style); + border-right-width: thick; +} + +.border-r-\\[thin\\] { + border-right-style: var(--tw-border-style); + border-right-width: thin; +} + +.border-r-\\[\\#0088cc\\] { + border-right-color: #08c; +} + +.border-r-\\[\\#0088cc\\]\\/50 { + border-right-color: #0088cc80; +} + +.border-r-\\[--my-color\\] { + border-right-color: var(--my-color); +} + +.border-r-\\[--my-color\\]\\/50 { + border-right-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-r-\\[color\\:--my-color\\] { + border-right-color: var(--my-color); +} + +.border-r-\\[color\\:--my-color\\]\\/50 { + border-right-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-r-current { + border-right-color: currentColor; +} + +.border-r-current\\/50 { + border-right-color: color-mix(in srgb, currentColor 50%, transparent); +} + +.border-r-inherit { + border-right-color: inherit; +} + +.border-r-red-500 { + border-right-color: var(--color-red-500, #ef4444); +} + +.border-r-red-500\\/50 { + border-right-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); +} + +.border-r-transparent { + border-right-color: #0000; +} + +@property --tw-border-style { + syntax: ""; + inherits: false; + initial-value: solid; +}" +`; + +exports[`border-s-* 1`] = ` +":root { + --radius-none: 0px; + --radius-full: 9999px; + --radius-sm: .125rem; + --color-red-500: #ef4444; +} + +.border-s { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: 1px; +} + +.border-s-0 { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: 0; +} + +.border-s-123 { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: 123px; +} + +.border-s-2 { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: 2px; +} + +.border-s-4 { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: 4px; +} + +.border-s-\\[12px\\] { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: 12px; +} + +.border-s-\\[length\\:--my-width\\], .border-s-\\[line-width\\:--my-width\\] { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: var(--my-width); +} + +.border-s-\\[medium\\] { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: medium; +} + +.border-s-\\[thick\\] { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: thick; +} + +.border-s-\\[thin\\] { + border-inline-start-style: var(--tw-border-style); + border-inline-start-width: thin; +} + +.border-s-\\[\\#0088cc\\] { + border-inline-start-color: #08c; +} + +.border-s-\\[\\#0088cc\\]\\/50 { + border-inline-start-color: #0088cc80; +} + +.border-s-\\[--my-color\\] { + border-inline-start-color: var(--my-color); +} + +.border-s-\\[--my-color\\]\\/50 { + border-inline-start-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-s-\\[color\\:--my-color\\] { + border-inline-start-color: var(--my-color); +} + +.border-s-\\[color\\:--my-color\\]\\/50 { + border-inline-start-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-s-current { + border-inline-start-color: currentColor; +} + +.border-s-current\\/50 { + border-inline-start-color: color-mix(in srgb, currentColor 50%, transparent); +} + +.border-s-inherit { + border-inline-start-color: inherit; +} + +.border-s-red-500 { + border-inline-start-color: var(--color-red-500, #ef4444); +} + +.border-s-red-500\\/50 { + border-inline-start-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); +} + +.border-s-transparent { + border-inline-start-color: #0000; +} + +@property --tw-border-style { + syntax: ""; + inherits: false; + initial-value: solid; +}" +`; + +exports[`border-t-* 1`] = ` +":root { + --radius-none: 0px; + --radius-full: 9999px; + --radius-sm: .125rem; + --color-red-500: #ef4444; +} + +.border-t { + border-top-style: var(--tw-border-style); + border-top-width: 1px; +} + +.border-t-0 { + border-top-style: var(--tw-border-style); + border-top-width: 0; +} + +.border-t-123 { + border-top-style: var(--tw-border-style); + border-top-width: 123px; +} + +.border-t-2 { + border-top-style: var(--tw-border-style); + border-top-width: 2px; +} + +.border-t-4 { + border-top-style: var(--tw-border-style); + border-top-width: 4px; +} + +.border-t-\\[12px\\] { + border-top-style: var(--tw-border-style); + border-top-width: 12px; +} + +.border-t-\\[length\\:--my-width\\], .border-t-\\[line-width\\:--my-width\\] { + border-top-style: var(--tw-border-style); + border-top-width: var(--my-width); +} + +.border-t-\\[medium\\] { + border-top-style: var(--tw-border-style); + border-top-width: medium; +} + +.border-t-\\[thick\\] { + border-top-style: var(--tw-border-style); + border-top-width: thick; +} + +.border-t-\\[thin\\] { + border-top-style: var(--tw-border-style); + border-top-width: thin; +} + +.border-t-\\[\\#0088cc\\] { + border-top-color: #08c; +} + +.border-t-\\[\\#0088cc\\]\\/50 { + border-top-color: #0088cc80; +} + +.border-t-\\[--my-color\\] { + border-top-color: var(--my-color); +} + +.border-t-\\[--my-color\\]\\/50 { + border-top-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-t-\\[color\\:--my-color\\] { + border-top-color: var(--my-color); +} + +.border-t-\\[color\\:--my-color\\]\\/50 { + border-top-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-t-current { + border-top-color: currentColor; +} + +.border-t-current\\/50 { + border-top-color: color-mix(in srgb, currentColor 50%, transparent); +} + +.border-t-inherit { + border-top-color: inherit; +} + +.border-t-red-500 { + border-top-color: var(--color-red-500, #ef4444); +} + +.border-t-red-500\\/50 { + border-top-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); +} + +.border-t-transparent { + border-top-color: #0000; +} + +@property --tw-border-style { + syntax: ""; + inherits: false; + initial-value: solid; +}" +`; + +exports[`border-x-* 1`] = ` +":root { + --radius-none: 0px; + --radius-full: 9999px; + --radius-sm: .125rem; + --color-red-500: #ef4444; +} + +.border-x { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: 1px; + border-right-width: 1px; +} + +.border-x-0 { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: 0; + border-right-width: 0; +} + +.border-x-123 { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: 123px; + border-right-width: 123px; +} + +.border-x-2 { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: 2px; + border-right-width: 2px; +} + +.border-x-4 { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: 4px; + border-right-width: 4px; +} + +.border-x-\\[12px\\] { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: 12px; + border-right-width: 12px; +} + +.border-x-\\[length\\:--my-width\\], .border-x-\\[line-width\\:--my-width\\] { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: var(--my-width); + border-right-width: var(--my-width); +} + +.border-x-\\[medium\\] { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: medium; + border-right-width: medium; +} + +.border-x-\\[thick\\] { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: thick; + border-right-width: thick; +} + +.border-x-\\[thin\\] { + border-left-style: var(--tw-border-style); + border-right-style: var(--tw-border-style); + border-left-width: thin; + border-right-width: thin; +} + +.border-x-\\[\\#0088cc\\] { + border-left-color: #08c; + border-right-color: #08c; +} + +.border-x-\\[\\#0088cc\\]\\/50 { + border-left-color: #0088cc80; + border-right-color: #0088cc80; +} + +.border-x-\\[--my-color\\] { + border-left-color: var(--my-color); + border-right-color: var(--my-color); +} + +.border-x-\\[--my-color\\]\\/50 { + border-left-color: color-mix(in srgb, var(--my-color) 50%, transparent); + border-right-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-x-\\[color\\:--my-color\\] { + border-left-color: var(--my-color); + border-right-color: var(--my-color); +} + +.border-x-\\[color\\:--my-color\\]\\/50 { + border-left-color: color-mix(in srgb, var(--my-color) 50%, transparent); + border-right-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-x-current { + border-left-color: currentColor; + border-right-color: currentColor; +} + +.border-x-current\\/50 { + border-left-color: color-mix(in srgb, currentColor 50%, transparent); + border-right-color: color-mix(in srgb, currentColor 50%, transparent); +} + +.border-x-inherit { + border-left-color: inherit; + border-right-color: inherit; +} + +.border-x-red-500 { + border-left-color: var(--color-red-500, #ef4444); + border-right-color: var(--color-red-500, #ef4444); +} + +.border-x-red-500\\/50 { + border-left-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); + border-right-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); +} + +.border-x-transparent { + border-left-color: #0000; + border-right-color: #0000; +} + +@property --tw-border-style { + syntax: ""; + inherits: false; + initial-value: solid; +}" +`; + +exports[`border-y-* 1`] = ` +":root { + --radius-none: 0px; + --radius-full: 9999px; + --radius-sm: .125rem; + --color-red-500: #ef4444; +} + +.border-y { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: 1px; + border-bottom-width: 1px; +} + +.border-y-0 { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: 0; + border-bottom-width: 0; +} + +.border-y-123 { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: 123px; + border-bottom-width: 123px; +} + +.border-y-2 { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: 2px; + border-bottom-width: 2px; +} + +.border-y-4 { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: 4px; + border-bottom-width: 4px; +} + +.border-y-\\[12px\\] { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: 12px; + border-bottom-width: 12px; +} + +.border-y-\\[length\\:--my-width\\], .border-y-\\[line-width\\:--my-width\\] { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: var(--my-width); + border-bottom-width: var(--my-width); +} + +.border-y-\\[medium\\] { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: medium; + border-bottom-width: medium; +} + +.border-y-\\[thick\\] { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: thick; + border-bottom-width: thick; +} + +.border-y-\\[thin\\] { + border-top-style: var(--tw-border-style); + border-bottom-style: var(--tw-border-style); + border-top-width: thin; + border-bottom-width: thin; +} + +.border-y-\\[\\#0088cc\\] { + border-top-color: #08c; + border-bottom-color: #08c; +} + +.border-y-\\[\\#0088cc\\]\\/50 { + border-top-color: #0088cc80; + border-bottom-color: #0088cc80; +} + +.border-y-\\[--my-color\\] { + border-top-color: var(--my-color); + border-bottom-color: var(--my-color); +} + +.border-y-\\[--my-color\\]\\/50 { + border-top-color: color-mix(in srgb, var(--my-color) 50%, transparent); + border-bottom-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-y-\\[color\\:--my-color\\] { + border-top-color: var(--my-color); + border-bottom-color: var(--my-color); +} + +.border-y-\\[color\\:--my-color\\]\\/50 { + border-top-color: color-mix(in srgb, var(--my-color) 50%, transparent); + border-bottom-color: color-mix(in srgb, var(--my-color) 50%, transparent); +} + +.border-y-current { + border-top-color: currentColor; + border-bottom-color: currentColor; +} + +.border-y-current\\/50 { + border-top-color: color-mix(in srgb, currentColor 50%, transparent); + border-bottom-color: color-mix(in srgb, currentColor 50%, transparent); +} + +.border-y-inherit { + border-top-color: inherit; + border-bottom-color: inherit; +} + +.border-y-red-500 { + border-top-color: var(--color-red-500, #ef4444); + border-bottom-color: var(--color-red-500, #ef4444); +} + +.border-y-red-500\\/50 { + border-top-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); + border-bottom-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); +} + +.border-y-transparent { + border-top-color: #0000; + border-bottom-color: #0000; +} + +@property --tw-border-style { + syntax: ""; + inherits: false; + initial-value: solid; +}" +`; diff --git a/packages/tailwindcss/src/variants.test.ts b/packages/tailwindcss/src/variants.test.ts index 18ef39eeb459..7458e413d98f 100644 --- a/packages/tailwindcss/src/variants.test.ts +++ b/packages/tailwindcss/src/variants.test.ts @@ -998,7 +998,7 @@ test('sorting stacked min-* and max-* variants', () => { } @tailwind utilities; `, - ['min-sm:max-xl:flex', 'min-md:max-xl:flex', 'min-xs:max-xl:flex'], + ['min-sm:max-xl:flex', 'min-md:max-xl:flex', 'min-xs:max-xl:flex', 'min-h-xs:max-xl:flex'], ), ).toMatchInlineSnapshot(` ":root { @@ -1031,6 +1031,14 @@ test('sorting stacked min-* and max-* variants', () => { display: flex; } } + } + + @media (width < 1280px) { + @media (height >= 280px) { + .min-h-xs\\:max-xl\\:flex { + display: flex; + } + } }" `) }) @@ -1062,6 +1070,21 @@ test('min, max and unprefixed breakpoints', () => { 'min-sm:flex', 'sm:flex', 'lg:flex', + 'h-sm:flex', + 'h-lg:flex', + 'min-h-lg:flex', + 'max-h-lg:flex', + 'h-sm:md:flex', + 'h-lg:min-md:flex', + 'h-lg:max-lg:flex', + 'min-h-lg:md:flex', + 'max-h-lg:lg:flex', + 'min-h-lg:max-md:flex', + 'max-h-lg:min-lg:flex', + 'min-lg:max-h-md:flex', + 'max-lg:min-h-lg:flex', + 'min-[900px]:max-h-[700px]:flex', + 'max-[700px]:min-h-[900px]:flex', ], ), ).toMatchInlineSnapshot(` @@ -1095,6 +1118,12 @@ test('min, max and unprefixed breakpoints', () => { } } + @media (height < 1024px) { + .max-h-lg\\:flex { + display: flex; + } + } + @media (width >= 640px) { .min-sm\\:flex { display: flex; @@ -1125,16 +1154,122 @@ test('min, max and unprefixed breakpoints', () => { } } + @media (height < 700px) { + @media (width >= 900px) { + .min-\\[900px\\]\\:max-h-\\[700px\\]\\:flex { + display: flex; + } + } + } + @media (width >= 1024px) { .lg\\:flex { display: flex; } } + @media (width >= 1024px) { + @media (height < 1024px) { + .max-h-lg\\:lg\\:flex { + display: flex; + } + } + } + @media (width >= 1024px) { .min-lg\\:flex { display: flex; } + } + + @media (width >= 1024px) { + @media (height < 1024px) { + .max-h-lg\\:min-lg\\:flex { + display: flex; + } + } + } + + @media (height < 768px) { + @media (width >= 1024px) { + .min-lg\\:max-h-md\\:flex { + display: flex; + } + } + } + + @media (height >= 1024px) { + .h-lg\\:flex { + display: flex; + } + } + + @media (width < 1024px) { + @media (height >= 1024px) { + .h-lg\\:max-lg\\:flex { + display: flex; + } + } + } + + @media (width >= 768px) { + @media (height >= 1024px) { + .h-lg\\:min-md\\:flex { + display: flex; + } + } + } + + @media (height >= 640px) { + .h-sm\\:flex { + display: flex; + } + } + + @media (width >= 768px) { + @media (height >= 640px) { + .h-sm\\:md\\:flex { + display: flex; + } + } + } + + @media (height >= 900px) { + @media (width < 700px) { + .max-\\[700px\\]\\:min-h-\\[900px\\]\\:flex { + display: flex; + } + } + } + + @media (height >= 1024px) { + .min-h-lg\\:flex { + display: flex; + } + } + + @media (height >= 1024px) { + @media (width < 1024px) { + .max-lg\\:min-h-lg\\:flex { + display: flex; + } + } + } + + @media (width < 768px) { + @media (height >= 1024px) { + .min-h-lg\\:max-md\\:flex { + display: flex; + } + } + } + + @media (width >= 768px) { + @media (height >= 1024px) { + .min-h-lg\\:md\\:flex { + display: flex; + } + } }" `) }) diff --git a/packages/tailwindcss/src/variants.ts b/packages/tailwindcss/src/variants.ts index 25a37c9489af..9f9bab898929 100644 --- a/packages/tailwindcss/src/variants.ts +++ b/packages/tailwindcss/src/variants.ts @@ -548,6 +548,27 @@ export function createVariants(theme: Theme): Variants { () => Array.from(breakpoints.keys()).filter((key) => key !== null) as string[], ) + variants.group( + () => { + variants.functional( + 'max-h', + (ruleNode, variant) => { + let value = resolvedBreakpoints.get(variant) + if (value === null) return null + + ruleNode.nodes = [rule(`@media (height < ${value})`, ruleNode.nodes)] + }, + { compounds: false }, + ) + }, + (a, z) => compareBreakpoints(a, z, 'desc', resolvedBreakpoints), + ) + + variants.suggest( + 'max-h', + () => Array.from(breakpoints.keys()).filter((key) => key !== null) as string[], + ) + // Min variants.group( () => { @@ -581,6 +602,39 @@ export function createVariants(theme: Theme): Variants { 'min', () => Array.from(breakpoints.keys()).filter((key) => key !== null) as string[], ) + + variants.group( + () => { + // Registers breakpoint variants like `h-sm`, `h-md`, `h-lg`, etc. + for (let [key, value] of theme.namespace('--breakpoint')) { + if (key === null) continue + variants.static( + `h-${key}`, + (ruleNode) => { + ruleNode.nodes = [rule(`@media (height >= ${value})`, ruleNode.nodes)] + }, + { compounds: false }, + ) + } + + variants.functional( + 'min-h', + (ruleNode, variant) => { + let value = resolvedBreakpoints.get(variant) + if (value === null) return null + + ruleNode.nodes = [rule(`@media (height >= ${value})`, ruleNode.nodes)] + }, + { compounds: false }, + ) + }, + (a, z) => compareBreakpoints(a, z, 'asc', resolvedBreakpoints), + ) + + variants.suggest( + 'min-h', + () => Array.from(breakpoints.keys()).filter((key) => key !== null) as string[], + ) } { @@ -685,6 +739,109 @@ export function createVariants(theme: Theme): Variants { () => Array.from(widths.keys()).filter((key) => key !== null) as string[], ) } + + { + let heights = theme.namespace('--height') + + // Container queries + let resolvedHeights = new DefaultMap((variant: Variant) => { + switch (variant.kind) { + case 'functional': { + if (variant.value === null) return null + + let value: string | null = null + + if (variant.value.kind === 'arbitrary') { + value = variant.value.value + } else if (variant.value.kind === 'named') { + value = theme.resolveValue(variant.value.value, ['--height']) + } + + if (!value) return null + if (value.includes('var(')) return null + + return value + } + case 'static': + case 'arbitrary': + case 'compound': + return null + } + }) + + variants.group( + () => { + variants.functional( + '@max-h', + (ruleNode, variant) => { + let value = resolvedHeights.get(variant) + if (value === null) return null + + ruleNode.nodes = [ + rule( + variant.modifier + ? `@container ${variant.modifier.value} (height < ${value})` + : `@container (height < ${value})`, + ruleNode.nodes, + ), + ] + }, + { compounds: false }, + ) + }, + (a, z) => compareBreakpoints(a, z, 'desc', resolvedHeights), + ) + + variants.suggest( + '@max-h', + () => Array.from(heights.keys()).filter((key) => key !== null) as string[], + ) + + variants.group( + () => { + variants.functional( + '@-h', + (ruleNode, variant) => { + let value = resolvedHeights.get(variant) + if (value === null) return null + + ruleNode.nodes = [ + rule( + variant.modifier + ? `@container ${variant.modifier.value} (height >= ${value})` + : `@container (height >= ${value})`, + ruleNode.nodes, + ), + ] + }, + { compounds: false }, + ) + variants.functional( + '@min-h', + (ruleNode, variant) => { + let value = resolvedHeights.get(variant) + if (value === null) return null + + ruleNode.nodes = [ + rule( + variant.modifier + ? `@container ${variant.modifier.value} (height >= ${value})` + : `@container (height >= ${value})`, + ruleNode.nodes, + ), + ] + }, + { compounds: false }, + ) + }, + (a, z) => compareBreakpoints(a, z, 'asc', resolvedHeights), + ) + + variants.suggest( + '@min-h', + () => Array.from(heights.keys()).filter((key) => key !== null) as string[], + ) + } } staticVariant('portrait', ['@media (orientation: portrait)'], { compounds: false }) From 5a83da7c1ebef81947b1e44c301a40263f1fae08 Mon Sep 17 00:00:00 2001 From: Brandon McConnell Date: Thu, 28 Mar 2024 03:30:30 -0700 Subject: [PATCH 2/4] Run prettier --- packages/tailwindcss/src/variants.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/tailwindcss/src/variants.ts b/packages/tailwindcss/src/variants.ts index 9f9bab898929..82914c535694 100644 --- a/packages/tailwindcss/src/variants.ts +++ b/packages/tailwindcss/src/variants.ts @@ -841,7 +841,7 @@ export function createVariants(theme: Theme): Variants { '@min-h', () => Array.from(heights.keys()).filter((key) => key !== null) as string[], ) - } + } } staticVariant('portrait', ['@media (orientation: portrait)'], { compounds: false }) From f72785b85b2d0e00d0d394a8056f6e57daaaed83 Mon Sep 17 00:00:00 2001 From: Brandon McConnell Date: Thu, 28 Mar 2024 03:49:39 -0700 Subject: [PATCH 3/4] Remove temporarily backed files Committed these by mistake ;P --- .../backup__snapshots__/index.test.ts.snap | 525 ---- .../intellisense.test.ts.snap | 2428 ----------------- .../utilities.test.ts.snap | 1082 -------- 3 files changed, 4035 deletions(-) delete mode 100644 packages/tailwindcss/src/backup__snapshots__/index.test.ts.snap delete mode 100644 packages/tailwindcss/src/backup__snapshots__/intellisense.test.ts.snap delete mode 100644 packages/tailwindcss/src/backup__snapshots__/utilities.test.ts.snap diff --git a/packages/tailwindcss/src/backup__snapshots__/index.test.ts.snap b/packages/tailwindcss/src/backup__snapshots__/index.test.ts.snap deleted file mode 100644 index 7eaf27dd9ef1..000000000000 --- a/packages/tailwindcss/src/backup__snapshots__/index.test.ts.snap +++ /dev/null @@ -1,525 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using the default theme 1`] = ` -":root { - --default-transition-duration: .15s; - --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1); - --default-font-family: var(--font-family-sans); - --default-font-feature-settings: var(--font-family-sans--font-feature-settings); - --default-font-variation-settings: var(--font-family-sans--font-variation-settings); - --default-mono-font-family: var(--font-family-mono); - --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings); - --default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings); - --breakpoint-sm: 640px; - --breakpoint-md: 768px; - --breakpoint-lg: 1024px; - --breakpoint-xl: 1280px; - --breakpoint-2xl: 1536px; - --color-black: #000; - --color-white: #fff; - --color-slate-50: #f8fafc; - --color-slate-100: #f1f5f9; - --color-slate-200: #e2e8f0; - --color-slate-300: #cbd5e1; - --color-slate-400: #94a3b8; - --color-slate-500: #64748b; - --color-slate-600: #475569; - --color-slate-700: #334155; - --color-slate-800: #1e293b; - --color-slate-900: #0f172a; - --color-slate-950: #020617; - --color-gray-50: #f9fafb; - --color-gray-100: #f3f4f6; - --color-gray-200: #e5e7eb; - --color-gray-300: #d1d5db; - --color-gray-400: #9ca3af; - --color-gray-500: #6b7280; - --color-gray-600: #4b5563; - --color-gray-700: #374151; - --color-gray-800: #1f2937; - --color-gray-900: #111827; - --color-gray-950: #030712; - --color-zinc-50: #fafafa; - --color-zinc-100: #f4f4f5; - --color-zinc-200: #e4e4e7; - --color-zinc-300: #d4d4d8; - --color-zinc-400: #a1a1aa; - --color-zinc-500: #71717a; - --color-zinc-600: #52525b; - --color-zinc-700: #3f3f46; - --color-zinc-800: #27272a; - --color-zinc-900: #18181b; - --color-zinc-950: #09090b; - --color-neutral-50: #fafafa; - --color-neutral-100: #f5f5f5; - --color-neutral-200: #e5e5e5; - --color-neutral-300: #d4d4d4; - --color-neutral-400: #a3a3a3; - --color-neutral-500: #737373; - --color-neutral-600: #525252; - --color-neutral-700: #404040; - --color-neutral-800: #262626; - --color-neutral-900: #171717; - --color-neutral-950: #0a0a0a; - --color-stone-50: #fafaf9; - --color-stone-100: #f5f5f4; - --color-stone-200: #e7e5e4; - --color-stone-300: #d6d3d1; - --color-stone-400: #a8a29e; - --color-stone-500: #78716c; - --color-stone-600: #57534e; - --color-stone-700: #44403c; - --color-stone-800: #292524; - --color-stone-900: #1c1917; - --color-stone-950: #0c0a09; - --color-red-50: #fef2f2; - --color-red-100: #fee2e2; - --color-red-200: #fecaca; - --color-red-300: #fca5a5; - --color-red-400: #f87171; - --color-red-500: #ef4444; - --color-red-600: #dc2626; - --color-red-700: #b91c1c; - --color-red-800: #991b1b; - --color-red-900: #7f1d1d; - --color-red-950: #450a0a; - --color-orange-50: #fff7ed; - --color-orange-100: #ffedd5; - --color-orange-200: #fed7aa; - --color-orange-300: #fdba74; - --color-orange-400: #fb923c; - --color-orange-500: #f97316; - --color-orange-600: #ea580c; - --color-orange-700: #c2410c; - --color-orange-800: #9a3412; - --color-orange-900: #7c2d12; - --color-orange-950: #431407; - --color-amber-50: #fffbeb; - --color-amber-100: #fef3c7; - --color-amber-200: #fde68a; - --color-amber-300: #fcd34d; - --color-amber-400: #fbbf24; - --color-amber-500: #f59e0b; - --color-amber-600: #d97706; - --color-amber-700: #b45309; - --color-amber-800: #92400e; - --color-amber-900: #78350f; - --color-amber-950: #451a03; - --color-yellow-50: #fefce8; - --color-yellow-100: #fef9c3; - --color-yellow-200: #fef08a; - --color-yellow-300: #fde047; - --color-yellow-400: #facc15; - --color-yellow-500: #eab308; - --color-yellow-600: #ca8a04; - --color-yellow-700: #a16207; - --color-yellow-800: #854d0e; - --color-yellow-900: #713f12; - --color-yellow-950: #422006; - --color-lime-50: #f7fee7; - --color-lime-100: #ecfccb; - --color-lime-200: #d9f99d; - --color-lime-300: #bef264; - --color-lime-400: #a3e635; - --color-lime-500: #84cc16; - --color-lime-600: #65a30d; - --color-lime-700: #4d7c0f; - --color-lime-800: #3f6212; - --color-lime-900: #365314; - --color-lime-950: #1a2e05; - --color-green-50: #f0fdf4; - --color-green-100: #dcfce7; - --color-green-200: #bbf7d0; - --color-green-300: #86efac; - --color-green-400: #4ade80; - --color-green-500: #22c55e; - --color-green-600: #16a34a; - --color-green-700: #15803d; - --color-green-800: #166534; - --color-green-900: #14532d; - --color-green-950: #052e16; - --color-emerald-50: #ecfdf5; - --color-emerald-100: #d1fae5; - --color-emerald-200: #a7f3d0; - --color-emerald-300: #6ee7b7; - --color-emerald-400: #34d399; - --color-emerald-500: #10b981; - --color-emerald-600: #059669; - --color-emerald-700: #047857; - --color-emerald-800: #065f46; - --color-emerald-900: #064e3b; - --color-emerald-950: #022c22; - --color-teal-50: #f0fdfa; - --color-teal-100: #ccfbf1; - --color-teal-200: #99f6e4; - --color-teal-300: #5eead4; - --color-teal-400: #2dd4bf; - --color-teal-500: #14b8a6; - --color-teal-600: #0d9488; - --color-teal-700: #0f766e; - --color-teal-800: #115e59; - --color-teal-900: #134e4a; - --color-teal-950: #042f2e; - --color-cyan-50: #ecfeff; - --color-cyan-100: #cffafe; - --color-cyan-200: #a5f3fc; - --color-cyan-300: #67e8f9; - --color-cyan-400: #22d3ee; - --color-cyan-500: #06b6d4; - --color-cyan-600: #0891b2; - --color-cyan-700: #0e7490; - --color-cyan-800: #155e75; - --color-cyan-900: #164e63; - --color-cyan-950: #083344; - --color-sky-50: #f0f9ff; - --color-sky-100: #e0f2fe; - --color-sky-200: #bae6fd; - --color-sky-300: #7dd3fc; - --color-sky-400: #38bdf8; - --color-sky-500: #0ea5e9; - --color-sky-600: #0284c7; - --color-sky-700: #0369a1; - --color-sky-800: #075985; - --color-sky-900: #0c4a6e; - --color-sky-950: #082f49; - --color-blue-50: #eff6ff; - --color-blue-100: #dbeafe; - --color-blue-200: #bfdbfe; - --color-blue-300: #93c5fd; - --color-blue-400: #60a5fa; - --color-blue-500: #3b82f6; - --color-blue-600: #2563eb; - --color-blue-700: #1d4ed8; - --color-blue-800: #1e40af; - --color-blue-900: #1e3a8a; - --color-blue-950: #172554; - --color-indigo-50: #eef2ff; - --color-indigo-100: #e0e7ff; - --color-indigo-200: #c7d2fe; - --color-indigo-300: #a5b4fc; - --color-indigo-400: #818cf8; - --color-indigo-500: #6366f1; - --color-indigo-600: #4f46e5; - --color-indigo-700: #4338ca; - --color-indigo-800: #3730a3; - --color-indigo-900: #312e81; - --color-indigo-950: #1e1b4b; - --color-violet-50: #f5f3ff; - --color-violet-100: #ede9fe; - --color-violet-200: #ddd6fe; - --color-violet-300: #c4b5fd; - --color-violet-400: #a78bfa; - --color-violet-500: #8b5cf6; - --color-violet-600: #7c3aed; - --color-violet-700: #6d28d9; - --color-violet-800: #5b21b6; - --color-violet-900: #4c1d95; - --color-violet-950: #2e1065; - --color-purple-50: #faf5ff; - --color-purple-100: #f3e8ff; - --color-purple-200: #e9d5ff; - --color-purple-300: #d8b4fe; - --color-purple-400: #c084fc; - --color-purple-500: #a855f7; - --color-purple-600: #9333ea; - --color-purple-700: #7e22ce; - --color-purple-800: #6b21a8; - --color-purple-900: #581c87; - --color-purple-950: #3b0764; - --color-fuchsia-50: #fdf4ff; - --color-fuchsia-100: #fae8ff; - --color-fuchsia-200: #f5d0fe; - --color-fuchsia-300: #f0abfc; - --color-fuchsia-400: #e879f9; - --color-fuchsia-500: #d946ef; - --color-fuchsia-600: #c026d3; - --color-fuchsia-700: #a21caf; - --color-fuchsia-800: #86198f; - --color-fuchsia-900: #701a75; - --color-fuchsia-950: #4a044e; - --color-pink-50: #fdf2f8; - --color-pink-100: #fce7f3; - --color-pink-200: #fbcfe8; - --color-pink-300: #f9a8d4; - --color-pink-400: #f472b6; - --color-pink-500: #ec4899; - --color-pink-600: #db2777; - --color-pink-700: #be185d; - --color-pink-800: #9d174d; - --color-pink-900: #831843; - --color-pink-950: #500724; - --color-rose-50: #fff1f2; - --color-rose-100: #ffe4e6; - --color-rose-200: #fecdd3; - --color-rose-300: #fda4af; - --color-rose-400: #fb7185; - --color-rose-500: #f43f5e; - --color-rose-600: #e11d48; - --color-rose-700: #be123c; - --color-rose-800: #9f1239; - --color-rose-900: #881337; - --color-rose-950: #4c0519; - --animate-spin: spin 1s linear infinite; - --animate-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite; - --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; - --animate-bounce: bounce 1s infinite; - --blur: 8px; - --blur-sm: 4px; - --blur-md: 12px; - --blur-lg: 16px; - --blur-xl: 24px; - --blur-2xl: 40px; - --blur-3xl: 64px; - --radius: .25rem; - --radius-sm: .125rem; - --radius-md: .375rem; - --radius-lg: .5rem; - --radius-xl: .75rem; - --radius-2xl: 1rem; - --radius-3xl: 1.5rem; - --shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a; - --shadow-xs: 0 1px #0000000d; - --shadow-sm: 0 1px 2px 0 #0000000d; - --shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a; - --shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a; - --shadow-xl: 0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a; - --shadow-2xl: 0 25px 50px -12px #00000040; - --shadow-inner: inset 0 2px 4px 0 #0000000d; - --inset-shadow-xs: inset 0 1px #0000000d; - --inset-shadow-sm: inset 0 1px 1px #0000000d; - --inset-shadow: inset 0 2px 4px #0000000d; - --drop-shadow: 0 1px 2px #0000001a, 0 1px 1px #0000000f; - --drop-shadow-sm: 0 1px 1px #0000000d; - --drop-shadow-md: 0 4px 3px #00000012, 0 2px 2px #0000000f; - --drop-shadow-lg: 0 10px 8px #0000000a, 0 4px 3px #0000001a; - --drop-shadow-xl: 0 20px 13px #00000008, 0 8px 5px #00000014; - --drop-shadow-2xl: 0 25px 25px #00000026; - --spacing-px: 1px; - --spacing-0: 0px; - --spacing-0_5: .125rem; - --spacing-1: .25rem; - --spacing-1_5: .375rem; - --spacing-2: .5rem; - --spacing-2_5: .625rem; - --spacing-3: .75rem; - --spacing-3_5: .875rem; - --spacing-4: 1rem; - --spacing-5: 1.25rem; - --spacing-6: 1.5rem; - --spacing-7: 1.75rem; - --spacing-8: 2rem; - --spacing-9: 2.25rem; - --spacing-10: 2.5rem; - --spacing-11: 2.75rem; - --spacing-12: 3rem; - --spacing-14: 3.5rem; - --spacing-16: 4rem; - --spacing-20: 5rem; - --spacing-24: 6rem; - --spacing-28: 7rem; - --spacing-32: 8rem; - --spacing-36: 9rem; - --spacing-40: 10rem; - --spacing-44: 11rem; - --spacing-48: 12rem; - --spacing-52: 13rem; - --spacing-56: 14rem; - --spacing-60: 15rem; - --spacing-64: 16rem; - --spacing-72: 18rem; - --spacing-80: 20rem; - --spacing-96: 24rem; - --width-3xs: 16rem; - --width-2xs: 18rem; - --width-xs: 20rem; - --width-sm: 24rem; - --width-md: 28rem; - --width-lg: 32rem; - --width-xl: 36rem; - --width-2xl: 42rem; - --width-3xl: 48rem; - --width-4xl: 56rem; - --width-5xl: 64rem; - --width-6xl: 72rem; - --width-7xl: 80rem; - --width-prose: 65ch; - --font-family-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; - --font-family-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif; - --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; - --font-size-xs: .75rem; - --font-size-xs--line-height: 1rem; - --font-size-sm: .875rem; - --font-size-sm--line-height: 1.25rem; - --font-size-base: 1rem; - --font-size-base--line-height: 1.5rem; - --font-size-lg: 1.125rem; - --font-size-lg--line-height: 1.75rem; - --font-size-xl: 1.25rem; - --font-size-xl--line-height: 1.75rem; - --font-size-2xl: 1.5rem; - --font-size-2xl--line-height: 2rem; - --font-size-3xl: 1.875rem; - --font-size-3xl--line-height: 2.25rem; - --font-size-4xl: 2.25rem; - --font-size-4xl--line-height: 2.5rem; - --font-size-5xl: 3rem; - --font-size-5xl--line-height: 1; - --font-size-6xl: 3.75rem; - --font-size-6xl--line-height: 1; - --font-size-7xl: 4.5rem; - --font-size-7xl--line-height: 1; - --font-size-8xl: 6rem; - --font-size-8xl--line-height: 1; - --font-size-9xl: 8rem; - --font-size-9xl--line-height: 1; - --letter-spacing-tighter: -.05em; - --letter-spacing-tight: -.025em; - --letter-spacing-normal: 0em; - --letter-spacing-wide: .025em; - --letter-spacing-wider: .05em; - --letter-spacing-widest: .1em; - --line-height-none: 1; - --line-height-tight: 1.25; - --line-height-snug: 1.375; - --line-height-normal: 1.5; - --line-height-relaxed: 1.625; - --line-height-loose: 2; - --line-height-3: .75rem; - --line-height-4: 1rem; - --line-height-5: 1.25rem; - --line-height-6: 1.5rem; - --line-height-7: 1.75rem; - --line-height-8: 2rem; - --line-height-9: 2.25rem; - --line-height-10: 2.5rem; - --perspective-dramatic: 100px; - --perspective-near: 300px; - --perspective-normal: 500px; - --perspective-midrange: 800px; - --perspective-distant: 1200px; - --transition-timing-function-linear: linear; - --transition-timing-function-in: cubic-bezier(.4, 0, 1, 1); - --transition-timing-function-out: cubic-bezier(0, 0, .2, 1); - --transition-timing-function-in-out: cubic-bezier(.4, 0, .2, 1); -} - -.w-4 { - width: var(--spacing-4, 1rem); -} - -.bg-red-500 { - background-color: var(--color-red-500, #ef4444); -} - -.shadow { - --tw-shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a; - --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); -} - -@media (width >= 640px) { - .sm\\:flex { - display: flex; - } -} - -@keyframes spin { - to { - transform: rotate(360deg); - } -} - -@keyframes ping { - 75%, 100% { - opacity: 0; - transform: scale(2); - } -} - -@keyframes pulse { - 50% { - opacity: .5; - } -} - -@keyframes bounce { - 0%, 100% { - animation-timing-function: cubic-bezier(.8, 0, 1, 1); - transform: translateY(-25%); - } - - 50% { - animation-timing-function: cubic-bezier(0, 0, .2, 1); - transform: none; - } -} - -@property --tw-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} - -@property --tw-shadow-colored { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} - -@property --tw-inset-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} - -@property --tw-inset-shadow-colored { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} - -@property --tw-ring-color { - syntax: "*"; - inherits: false -} - -@property --tw-ring-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} - -@property --tw-inset-ring-color { - syntax: "*"; - inherits: false -} - -@property --tw-inset-ring-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -} - -@property --tw-ring-inset { - syntax: "*"; - inherits: false -} - -@property --tw-ring-offset-width { - syntax: ""; - inherits: false; - initial-value: 0; -} - -@property --tw-ring-offset-color { - syntax: "*"; - inherits: false; - initial-value: #fff; -} - -@property --tw-ring-offset-shadow { - syntax: "*"; - inherits: false; - initial-value: 0 0 #0000; -}" -`; diff --git a/packages/tailwindcss/src/backup__snapshots__/intellisense.test.ts.snap b/packages/tailwindcss/src/backup__snapshots__/intellisense.test.ts.snap deleted file mode 100644 index 8978f5123b5e..000000000000 --- a/packages/tailwindcss/src/backup__snapshots__/intellisense.test.ts.snap +++ /dev/null @@ -1,2428 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`getClassList 1`] = ` -[ - "-bottom-0.5", - "-bottom-1", - "-bottom-3", - "-bottom-4", - "-end-0.5", - "-end-1", - "-end-3", - "-end-4", - "-indent-0.5", - "-indent-1", - "-indent-3", - "-indent-4", - "-inset-0.5", - "-inset-1", - "-inset-3", - "-inset-4", - "-inset-x-0.5", - "-inset-x-1", - "-inset-x-3", - "-inset-x-4", - "-inset-y-0.5", - "-inset-y-1", - "-inset-y-3", - "-inset-y-4", - "-left-0.5", - "-left-1", - "-left-3", - "-left-4", - "-m-0.5", - "-m-1", - "-m-3", - "-m-4", - "-mb-0.5", - "-mb-1", - "-mb-3", - "-mb-4", - "-me-0.5", - "-me-1", - "-me-3", - "-me-4", - "-ml-0.5", - "-ml-1", - "-ml-3", - "-ml-4", - "-mr-0.5", - "-mr-1", - "-mr-3", - "-mr-4", - "-ms-0.5", - "-ms-1", - "-ms-3", - "-ms-4", - "-mt-0.5", - "-mt-1", - "-mt-3", - "-mt-4", - "-mx-0.5", - "-mx-1", - "-mx-3", - "-mx-4", - "-my-0.5", - "-my-1", - "-my-3", - "-my-4", - "-order-1", - "-order-10", - "-order-11", - "-order-12", - "-order-2", - "-order-3", - "-order-4", - "-order-5", - "-order-6", - "-order-7", - "-order-8", - "-order-9", - "-right-0.5", - "-right-1", - "-right-3", - "-right-4", - "-rotate-0", - "-rotate-1", - "-rotate-12", - "-rotate-180", - "-rotate-2", - "-rotate-3", - "-rotate-45", - "-rotate-6", - "-rotate-90", - "-rotate-x-0", - "-rotate-x-1", - "-rotate-x-12", - "-rotate-x-180", - "-rotate-x-2", - "-rotate-x-3", - "-rotate-x-45", - "-rotate-x-6", - "-rotate-x-90", - "-rotate-y-0", - "-rotate-y-1", - "-rotate-y-12", - "-rotate-y-180", - "-rotate-y-2", - "-rotate-y-3", - "-rotate-y-45", - "-rotate-y-6", - "-rotate-y-90", - "-rotate-z-0", - "-rotate-z-1", - "-rotate-z-12", - "-rotate-z-180", - "-rotate-z-2", - "-rotate-z-3", - "-rotate-z-45", - "-rotate-z-6", - "-rotate-z-90", - "-scale-0", - "-scale-100", - "-scale-105", - "-scale-110", - "-scale-125", - "-scale-150", - "-scale-200", - "-scale-50", - "-scale-75", - "-scale-90", - "-scale-95", - "-scale-x-0", - "-scale-x-100", - "-scale-x-105", - "-scale-x-110", - "-scale-x-125", - "-scale-x-150", - "-scale-x-200", - "-scale-x-50", - "-scale-x-75", - "-scale-x-90", - "-scale-x-95", - "-scale-y-0", - "-scale-y-100", - "-scale-y-105", - "-scale-y-110", - "-scale-y-125", - "-scale-y-150", - "-scale-y-200", - "-scale-y-50", - "-scale-y-75", - "-scale-y-90", - "-scale-y-95", - "-scale-z-0", - "-scale-z-100", - "-scale-z-105", - "-scale-z-110", - "-scale-z-125", - "-scale-z-150", - "-scale-z-200", - "-scale-z-50", - "-scale-z-75", - "-scale-z-90", - "-scale-z-95", - "-scroll-m-0.5", - "-scroll-m-1", - "-scroll-m-3", - "-scroll-m-4", - "-scroll-mb-0.5", - "-scroll-mb-1", - "-scroll-mb-3", - "-scroll-mb-4", - "-scroll-me-0.5", - "-scroll-me-1", - "-scroll-me-3", - "-scroll-me-4", - "-scroll-ml-0.5", - "-scroll-ml-1", - "-scroll-ml-3", - "-scroll-ml-4", - "-scroll-mr-0.5", - "-scroll-mr-1", - "-scroll-mr-3", - "-scroll-mr-4", - "-scroll-ms-0.5", - "-scroll-ms-1", - "-scroll-ms-3", - "-scroll-ms-4", - "-scroll-mt-0.5", - "-scroll-mt-1", - "-scroll-mt-3", - "-scroll-mt-4", - "-scroll-mx-0.5", - "-scroll-mx-1", - "-scroll-mx-3", - "-scroll-mx-4", - "-scroll-my-0.5", - "-scroll-my-1", - "-scroll-my-3", - "-scroll-my-4", - "-scroll-p-0.5", - "-scroll-p-1", - "-scroll-p-3", - "-scroll-p-4", - "-scroll-pb-0.5", - "-scroll-pb-1", - "-scroll-pb-3", - "-scroll-pb-4", - "-scroll-pe-0.5", - "-scroll-pe-1", - "-scroll-pe-3", - "-scroll-pe-4", - "-scroll-pl-0.5", - "-scroll-pl-1", - "-scroll-pl-3", - "-scroll-pl-4", - "-scroll-pr-0.5", - "-scroll-pr-1", - "-scroll-pr-3", - "-scroll-pr-4", - "-scroll-ps-0.5", - "-scroll-ps-1", - "-scroll-ps-3", - "-scroll-ps-4", - "-scroll-pt-0.5", - "-scroll-pt-1", - "-scroll-pt-3", - "-scroll-pt-4", - "-scroll-px-0.5", - "-scroll-px-1", - "-scroll-px-3", - "-scroll-px-4", - "-scroll-py-0.5", - "-scroll-py-1", - "-scroll-py-3", - "-scroll-py-4", - "-skew-0", - "-skew-1", - "-skew-12", - "-skew-2", - "-skew-3", - "-skew-6", - "-skew-x-0", - "-skew-x-1", - "-skew-x-12", - "-skew-x-2", - "-skew-x-3", - "-skew-x-6", - "-skew-y-0", - "-skew-y-1", - "-skew-y-12", - "-skew-y-2", - "-skew-y-3", - "-skew-y-6", - "-space-x-0.5", - "-space-x-1", - "-space-x-3", - "-space-x-4", - "-space-y-0.5", - "-space-y-1", - "-space-y-3", - "-space-y-4", - "-start-0.5", - "-start-1", - "-start-3", - "-start-4", - "-top-0.5", - "-top-1", - "-top-3", - "-top-4", - "-translate-0.5", - "-translate-1", - "-translate-3", - "-translate-4", - "-translate-x-0.5", - "-translate-x-1", - "-translate-x-3", - "-translate-x-4", - "-translate-y-0.5", - "-translate-y-1", - "-translate-y-3", - "-translate-y-4", - "-translate-z-0.5", - "-translate-z-1", - "-translate-z-3", - "-translate-z-4", - "-underline-offset-0", - "-underline-offset-1", - "-underline-offset-2", - "-underline-offset-4", - "-underline-offset-8", - "-z-0", - "-z-10", - "-z-20", - "-z-30", - "-z-40", - "-z-50", - "@container-normal", - "absolute", - "accent-current", - "accent-inherit", - "accent-transparent", - "align-baseline", - "align-bottom", - "align-middle", - "align-sub", - "align-super", - "align-text-bottom", - "align-text-top", - "align-top", - "animate-none", - "antialiased", - "appearance-auto", - "appearance-none", - "aspect-auto", - "aspect-square", - "aspect-video", - "auto-cols-auto", - "auto-cols-fr", - "auto-cols-max", - "auto-cols-min", - "auto-rows-auto", - "auto-rows-fr", - "auto-rows-max", - "auto-rows-min", - "backdrop-brightness-0", - "backdrop-brightness-100", - "backdrop-brightness-105", - "backdrop-brightness-110", - "backdrop-brightness-125", - "backdrop-brightness-150", - "backdrop-brightness-200", - "backdrop-brightness-50", - "backdrop-brightness-75", - "backdrop-brightness-90", - "backdrop-brightness-95", - "backdrop-contrast-0", - "backdrop-contrast-100", - "backdrop-contrast-125", - "backdrop-contrast-150", - "backdrop-contrast-200", - "backdrop-contrast-50", - "backdrop-contrast-75", - "backdrop-grayscale", - "backdrop-grayscale-0", - "backdrop-grayscale-100", - "backdrop-grayscale-25", - "backdrop-grayscale-50", - "backdrop-grayscale-75", - "backdrop-hue-rotate-0", - "backdrop-hue-rotate-15", - "backdrop-hue-rotate-180", - "backdrop-hue-rotate-30", - "backdrop-hue-rotate-60", - "backdrop-hue-rotate-90", - "backdrop-invert", - "backdrop-invert-0", - "backdrop-invert-100", - "backdrop-invert-25", - "backdrop-invert-50", - "backdrop-invert-75", - "backdrop-opacity-0", - "backdrop-opacity-10", - "backdrop-opacity-100", - "backdrop-opacity-15", - "backdrop-opacity-20", - "backdrop-opacity-25", - "backdrop-opacity-30", - "backdrop-opacity-35", - "backdrop-opacity-40", - "backdrop-opacity-45", - "backdrop-opacity-5", - "backdrop-opacity-50", - "backdrop-opacity-55", - "backdrop-opacity-60", - "backdrop-opacity-65", - "backdrop-opacity-70", - "backdrop-opacity-75", - "backdrop-opacity-80", - "backdrop-opacity-85", - "backdrop-opacity-90", - "backdrop-opacity-95", - "backdrop-saturate-0", - "backdrop-saturate-100", - "backdrop-saturate-150", - "backdrop-saturate-200", - "backdrop-saturate-50", - "backdrop-sepia", - "backdrop-sepia-0", - "backdrop-sepia-100", - "backdrop-sepia-50", - "backface-hidden", - "backface-visible", - "basis-0.5", - "basis-1", - "basis-3", - "basis-4", - "basis-4", - "basis-auto", - "basis-full", - "bg-auto", - "bg-blend-color", - "bg-blend-color-burn", - "bg-blend-color-dodge", - "bg-blend-darken", - "bg-blend-difference", - "bg-blend-exclusion", - "bg-blend-hard-light", - "bg-blend-hue", - "bg-blend-lighten", - "bg-blend-luminosity", - "bg-blend-multiply", - "bg-blend-normal", - "bg-blend-overlay", - "bg-blend-saturation", - "bg-blend-screen", - "bg-blend-soft-light", - "bg-bottom", - "bg-center", - "bg-clip-border", - "bg-clip-content", - "bg-clip-padding", - "bg-clip-text", - "bg-contain", - "bg-cover", - "bg-current", - "bg-fixed", - "bg-gradient-to-b", - "bg-gradient-to-bl", - "bg-gradient-to-br", - "bg-gradient-to-l", - "bg-gradient-to-r", - "bg-gradient-to-t", - "bg-gradient-to-tl", - "bg-gradient-to-tr", - "bg-inherit", - "bg-inherit", - "bg-left", - "bg-left-bottom", - "bg-left-top", - "bg-local", - "bg-no-repeat", - "bg-none", - "bg-origin-border", - "bg-origin-content", - "bg-origin-padding", - "bg-repeat", - "bg-repeat-x", - "bg-repeat-y", - "bg-right", - "bg-right-bottom", - "bg-right-top", - "bg-round", - "bg-scroll", - "bg-space", - "bg-top", - "bg-transparent", - "bg-transparent", - "block", - "border", - "border-b", - "border-b-current", - "border-b-inherit", - "border-b-transparent", - "border-collapse", - "border-current", - "border-dashed", - "border-dotted", - "border-double", - "border-e", - "border-e-current", - "border-e-inherit", - "border-e-transparent", - "border-hidden", - "border-inherit", - "border-l", - "border-l-current", - "border-l-inherit", - "border-l-transparent", - "border-none", - "border-r", - "border-r-current", - "border-r-inherit", - "border-r-transparent", - "border-s", - "border-s-current", - "border-s-inherit", - "border-s-transparent", - "border-separate", - "border-solid", - "border-spacing-0.5", - "border-spacing-1", - "border-spacing-3", - "border-spacing-4", - "border-spacing-x-0.5", - "border-spacing-x-1", - "border-spacing-x-3", - "border-spacing-x-4", - "border-spacing-y-0.5", - "border-spacing-y-1", - "border-spacing-y-3", - "border-spacing-y-4", - "border-t", - "border-t-current", - "border-t-inherit", - "border-t-transparent", - "border-transparent", - "border-x", - "border-x-current", - "border-x-inherit", - "border-x-transparent", - "border-y", - "border-y-current", - "border-y-inherit", - "border-y-transparent", - "bottom-0.5", - "bottom-1", - "bottom-3", - "bottom-4", - "bottom-auto", - "bottom-full", - "box-border", - "box-content", - "box-decoration-clone", - "box-decoration-slice", - "break-after-all", - "break-after-auto", - "break-after-avoid", - "break-after-avoid-page", - "break-after-column", - "break-after-left", - "break-after-page", - "break-after-right", - "break-all", - "break-before-all", - "break-before-auto", - "break-before-avoid", - "break-before-avoid-page", - "break-before-column", - "break-before-left", - "break-before-page", - "break-before-right", - "break-inside-auto", - "break-inside-avoid", - "break-inside-avoid-column", - "break-inside-avoid-page", - "break-keep", - "break-normal", - "break-words", - "brightness-0", - "brightness-100", - "brightness-105", - "brightness-110", - "brightness-125", - "brightness-150", - "brightness-200", - "brightness-50", - "brightness-75", - "brightness-90", - "brightness-95", - "capitalize", - "caption-bottom", - "caption-top", - "caret-current", - "caret-inherit", - "caret-transparent", - "clear-both", - "clear-end", - "clear-left", - "clear-none", - "clear-right", - "clear-start", - "col-auto", - "col-end-1", - "col-end-10", - "col-end-11", - "col-end-12", - "col-end-13", - "col-end-2", - "col-end-3", - "col-end-4", - "col-end-5", - "col-end-6", - "col-end-7", - "col-end-8", - "col-end-9", - "col-end-auto", - "col-span-1", - "col-span-10", - "col-span-11", - "col-span-12", - "col-span-2", - "col-span-3", - "col-span-4", - "col-span-5", - "col-span-6", - "col-span-7", - "col-span-8", - "col-span-9", - "col-span-full", - "col-start-1", - "col-start-10", - "col-start-11", - "col-start-12", - "col-start-13", - "col-start-2", - "col-start-3", - "col-start-4", - "col-start-5", - "col-start-6", - "col-start-7", - "col-start-8", - "col-start-9", - "col-start-auto", - "collapse", - "columns-1", - "columns-10", - "columns-11", - "columns-12", - "columns-2", - "columns-3", - "columns-4", - "columns-4", - "columns-5", - "columns-6", - "columns-7", - "columns-8", - "columns-9", - "columns-auto", - "contain-content", - "contain-inline-size", - "contain-layout", - "contain-none", - "contain-paint", - "contain-size", - "contain-strict", - "contain-style", - "content-around", - "content-baseline", - "content-between", - "content-center", - "content-end", - "content-evenly", - "content-none", - "content-normal", - "content-start", - "content-stretch", - "contents", - "contrast-0", - "contrast-100", - "contrast-125", - "contrast-150", - "contrast-200", - "contrast-50", - "contrast-75", - "cursor-alias", - "cursor-all-scroll", - "cursor-auto", - "cursor-cell", - "cursor-col-resize", - "cursor-context-menu", - "cursor-copy", - "cursor-crosshair", - "cursor-default", - "cursor-e-resize", - "cursor-ew-resize", - "cursor-grab", - "cursor-grabbing", - "cursor-help", - "cursor-move", - "cursor-n-resize", - "cursor-ne-resize", - "cursor-nesw-resize", - "cursor-no-drop", - "cursor-none", - "cursor-not-allowed", - "cursor-ns-resize", - "cursor-nw-resize", - "cursor-nwse-resize", - "cursor-pointer", - "cursor-progress", - "cursor-row-resize", - "cursor-s-resize", - "cursor-se-resize", - "cursor-sw-resize", - "cursor-text", - "cursor-vertical-text", - "cursor-w-resize", - "cursor-wait", - "cursor-zoom-in", - "cursor-zoom-out", - "decoration-0", - "decoration-1", - "decoration-2", - "decoration-auto", - "decoration-current", - "decoration-dashed", - "decoration-dotted", - "decoration-double", - "decoration-from-font", - "decoration-inherit", - "decoration-solid", - "decoration-transparent", - "decoration-wavy", - "delay-100", - "delay-1000", - "delay-150", - "delay-200", - "delay-300", - "delay-500", - "delay-700", - "delay-75", - "diagonal-fractions", - "divide-current", - "divide-dashed", - "divide-dotted", - "divide-double", - "divide-inherit", - "divide-none", - "divide-solid", - "divide-transparent", - "divide-x", - "divide-x-0", - "divide-x-2", - "divide-x-4", - "divide-x-8", - "divide-x-reverse", - "divide-y", - "divide-y-0", - "divide-y-2", - "divide-y-4", - "divide-y-8", - "divide-y-reverse", - "duration-100", - "duration-1000", - "duration-150", - "duration-200", - "duration-300", - "duration-500", - "duration-700", - "duration-75", - "end-0.5", - "end-1", - "end-3", - "end-4", - "end-auto", - "end-full", - "fill-current", - "fill-inherit", - "fill-transparent", - "fixed", - "flex-auto", - "flex-col", - "flex-col-reverse", - "flex-initial", - "flex-none", - "flex-nowrap", - "flex-row", - "flex-row-reverse", - "flex-wrap", - "flex-wrap-reverse", - "float-end", - "float-left", - "float-none", - "float-right", - "float-start", - "flow-root", - "font-black", - "font-bold", - "font-extrabold", - "font-extralight", - "font-light", - "font-medium", - "font-normal", - "font-semibold", - "font-stretch-100%", - "font-stretch-105%", - "font-stretch-110%", - "font-stretch-125%", - "font-stretch-150%", - "font-stretch-200%", - "font-stretch-50%", - "font-stretch-75%", - "font-stretch-90%", - "font-stretch-95%", - "font-stretch-condensed", - "font-stretch-expanded", - "font-stretch-extra-condensed", - "font-stretch-extra-expanded", - "font-stretch-normal", - "font-stretch-semi-condensed", - "font-stretch-semi-expanded", - "font-stretch-ultra-condensed", - "font-stretch-ultra-expanded", - "font-thin", - "forced-color-adjust-auto", - "forced-color-adjust-none", - "from-0%", - "from-10%", - "from-100%", - "from-15%", - "from-20%", - "from-25%", - "from-30%", - "from-35%", - "from-40%", - "from-45%", - "from-5%", - "from-50%", - "from-55%", - "from-60%", - "from-65%", - "from-70%", - "from-75%", - "from-80%", - "from-85%", - "from-90%", - "from-95%", - "from-current", - "from-inherit", - "from-transparent", - "gap-0.5", - "gap-1", - "gap-3", - "gap-4", - "gap-x-0.5", - "gap-x-1", - "gap-x-3", - "gap-x-4", - "gap-y-0.5", - "gap-y-1", - "gap-y-3", - "gap-y-4", - "grayscale", - "grayscale-0", - "grayscale-100", - "grayscale-25", - "grayscale-50", - "grayscale-75", - "grid", - "grid-cols-1", - "grid-cols-10", - "grid-cols-11", - "grid-cols-12", - "grid-cols-2", - "grid-cols-3", - "grid-cols-4", - "grid-cols-5", - "grid-cols-6", - "grid-cols-7", - "grid-cols-8", - "grid-cols-9", - "grid-cols-none", - "grid-cols-subgrid", - "grid-flow-col", - "grid-flow-col-dense", - "grid-flow-dense", - "grid-flow-row", - "grid-flow-row-dense", - "grid-rows-1", - "grid-rows-10", - "grid-rows-11", - "grid-rows-12", - "grid-rows-2", - "grid-rows-3", - "grid-rows-4", - "grid-rows-5", - "grid-rows-6", - "grid-rows-7", - "grid-rows-8", - "grid-rows-9", - "grid-rows-none", - "grid-rows-subgrid", - "grow", - "grow-0", - "h-0.5", - "h-1", - "h-3", - "h-4", - "h-auto", - "h-dvh", - "h-fit", - "h-full", - "h-lvh", - "h-max", - "h-min", - "h-screen", - "h-svh", - "hidden", - "hue-rotate-0", - "hue-rotate-15", - "hue-rotate-180", - "hue-rotate-30", - "hue-rotate-60", - "hue-rotate-90", - "hyphens-auto", - "hyphens-manual", - "hyphens-none", - "indent-0.5", - "indent-1", - "indent-3", - "indent-4", - "inline", - "inline-block", - "inline-flex", - "inline-grid", - "inline-table", - "inset-0.5", - "inset-1", - "inset-3", - "inset-4", - "inset-auto", - "inset-full", - "inset-ring", - "inset-ring-0", - "inset-ring-1", - "inset-ring-2", - "inset-ring-4", - "inset-ring-8", - "inset-ring-current", - "inset-ring-inherit", - "inset-ring-transparent", - "inset-shadow", - "inset-shadow-current", - "inset-shadow-inherit", - "inset-shadow-transparent", - "inset-x-0.5", - "inset-x-1", - "inset-x-3", - "inset-x-4", - "inset-x-auto", - "inset-x-full", - "inset-y-0.5", - "inset-y-1", - "inset-y-3", - "inset-y-4", - "inset-y-auto", - "inset-y-full", - "invert", - "invert-0", - "invert-100", - "invert-25", - "invert-50", - "invert-75", - "invisible", - "isolate", - "isolation-auto", - "italic", - "items-baseline", - "items-center", - "items-end", - "items-start", - "items-stretch", - "justify-around", - "justify-baseline", - "justify-between", - "justify-center", - "justify-end", - "justify-evenly", - "justify-items-center", - "justify-items-end", - "justify-items-normal", - "justify-items-start", - "justify-items-stretch", - "justify-normal", - "justify-self-auto", - "justify-self-center", - "justify-self-end", - "justify-self-start", - "justify-self-stretch", - "justify-start", - "justify-stretch", - "left-0.5", - "left-1", - "left-3", - "left-4", - "left-auto", - "left-full", - "line-clamp-1", - "line-clamp-2", - "line-clamp-3", - "line-clamp-4", - "line-clamp-5", - "line-clamp-6", - "line-clamp-none", - "line-through", - "lining-nums", - "list-decimal", - "list-disc", - "list-image-none", - "list-inside", - "list-item", - "list-none", - "list-outside", - "lowercase", - "m-0.5", - "m-1", - "m-3", - "m-4", - "m-auto", - "max-h-0.5", - "max-h-1", - "max-h-3", - "max-h-4", - "max-h-dvh", - "max-h-fit", - "max-h-full", - "max-h-lvh", - "max-h-max", - "max-h-min", - "max-h-none", - "max-h-screen", - "max-h-svh", - "max-w-0.5", - "max-w-1", - "max-w-3", - "max-w-4", - "max-w-4", - "max-w-fit", - "max-w-full", - "max-w-max", - "max-w-min", - "max-w-none", - "mb-0.5", - "mb-1", - "mb-3", - "mb-4", - "mb-auto", - "me-0.5", - "me-1", - "me-3", - "me-4", - "me-auto", - "min-h-0.5", - "min-h-1", - "min-h-3", - "min-h-4", - "min-h-auto", - "min-h-dvh", - "min-h-fit", - "min-h-full", - "min-h-lvh", - "min-h-max", - "min-h-min", - "min-h-screen", - "min-h-svh", - "min-w-0.5", - "min-w-1", - "min-w-3", - "min-w-4", - "min-w-4", - "min-w-auto", - "min-w-fit", - "min-w-full", - "min-w-max", - "min-w-min", - "mix-blend-color", - "mix-blend-color-burn", - "mix-blend-color-dodge", - "mix-blend-darken", - "mix-blend-difference", - "mix-blend-exclusion", - "mix-blend-hard-light", - "mix-blend-hue", - "mix-blend-lighten", - "mix-blend-luminosity", - "mix-blend-multiply", - "mix-blend-normal", - "mix-blend-overlay", - "mix-blend-plus-darker", - "mix-blend-plus-lighter", - "mix-blend-saturation", - "mix-blend-screen", - "mix-blend-soft-light", - "ml-0.5", - "ml-1", - "ml-3", - "ml-4", - "ml-auto", - "mr-0.5", - "mr-1", - "mr-3", - "mr-4", - "mr-auto", - "ms-0.5", - "ms-1", - "ms-3", - "ms-4", - "ms-auto", - "mt-0.5", - "mt-1", - "mt-3", - "mt-4", - "mt-auto", - "mx-0.5", - "mx-1", - "mx-3", - "mx-4", - "mx-auto", - "my-0.5", - "my-1", - "my-3", - "my-4", - "my-auto", - "no-underline", - "normal-case", - "normal-nums", - "not-italic", - "not-sr-only", - "object-bottom", - "object-center", - "object-contain", - "object-cover", - "object-fill", - "object-left", - "object-left-bottom", - "object-left-top", - "object-none", - "object-right", - "object-right-bottom", - "object-right-top", - "object-scale-down", - "object-top", - "oldstyle-nums", - "opacity-0", - "opacity-10", - "opacity-100", - "opacity-15", - "opacity-20", - "opacity-25", - "opacity-30", - "opacity-35", - "opacity-40", - "opacity-45", - "opacity-5", - "opacity-50", - "opacity-55", - "opacity-60", - "opacity-65", - "opacity-70", - "opacity-75", - "opacity-80", - "opacity-85", - "opacity-90", - "opacity-95", - "order-1", - "order-10", - "order-11", - "order-12", - "order-2", - "order-3", - "order-4", - "order-5", - "order-6", - "order-7", - "order-8", - "order-9", - "order-first", - "order-last", - "order-none", - "ordinal", - "origin-bottom", - "origin-bottom-left", - "origin-bottom-right", - "origin-center", - "origin-left", - "origin-right", - "origin-top", - "origin-top-left", - "origin-top-right", - "outline", - "outline-0", - "outline-1", - "outline-2", - "outline-4", - "outline-8", - "outline-current", - "outline-dashed", - "outline-dotted", - "outline-double", - "outline-inherit", - "outline-none", - "outline-offset-0", - "outline-offset-1", - "outline-offset-2", - "outline-offset-4", - "outline-offset-8", - "outline-solid", - "outline-transparent", - "overflow-auto", - "overflow-clip", - "overflow-hidden", - "overflow-scroll", - "overflow-visible", - "overflow-x-auto", - "overflow-x-clip", - "overflow-x-hidden", - "overflow-x-scroll", - "overflow-x-visible", - "overflow-y-auto", - "overflow-y-clip", - "overflow-y-hidden", - "overflow-y-scroll", - "overflow-y-visible", - "overline", - "overscroll-auto", - "overscroll-contain", - "overscroll-none", - "overscroll-x-auto", - "overscroll-x-contain", - "overscroll-x-none", - "overscroll-y-auto", - "overscroll-y-contain", - "overscroll-y-none", - "p-0.5", - "p-1", - "p-3", - "p-4", - "pb-0.5", - "pb-1", - "pb-3", - "pb-4", - "pe-0.5", - "pe-1", - "pe-3", - "pe-4", - "perspective-dramatic", - "perspective-none", - "perspective-normal", - "perspective-origin-bottom", - "perspective-origin-bottom-left", - "perspective-origin-bottom-right", - "perspective-origin-center", - "perspective-origin-left", - "perspective-origin-right", - "perspective-origin-top", - "perspective-origin-top-left", - "perspective-origin-top-right", - "pl-0.5", - "pl-1", - "pl-3", - "pl-4", - "place-content-around", - "place-content-baseline", - "place-content-between", - "place-content-center", - "place-content-end", - "place-content-evenly", - "place-content-start", - "place-content-stretch", - "place-items-baseline", - "place-items-center", - "place-items-end", - "place-items-start", - "place-items-stretch", - "place-self-auto", - "place-self-center", - "place-self-end", - "place-self-start", - "place-self-stretch", - "placeholder-current", - "placeholder-inherit", - "placeholder-transparent", - "pointer-events-auto", - "pointer-events-none", - "pr-0.5", - "pr-1", - "pr-3", - "pr-4", - "proportional-nums", - "ps-0.5", - "ps-1", - "ps-3", - "ps-4", - "pt-0.5", - "pt-1", - "pt-3", - "pt-4", - "px-0.5", - "px-1", - "px-3", - "px-4", - "py-0.5", - "py-1", - "py-3", - "py-4", - "relative", - "resize-both", - "resize-none", - "resize-x", - "resize-y", - "right-0.5", - "right-1", - "right-3", - "right-4", - "right-auto", - "right-full", - "ring", - "ring-0", - "ring-1", - "ring-2", - "ring-4", - "ring-8", - "ring-current", - "ring-inherit", - "ring-inset", - "ring-offset-0", - "ring-offset-1", - "ring-offset-2", - "ring-offset-4", - "ring-offset-8", - "ring-offset-current", - "ring-offset-inherit", - "ring-offset-transparent", - "ring-transparent", - "rotate-0", - "rotate-1", - "rotate-12", - "rotate-180", - "rotate-2", - "rotate-3", - "rotate-45", - "rotate-6", - "rotate-90", - "rotate-none", - "rotate-x-0", - "rotate-x-1", - "rotate-x-12", - "rotate-x-180", - "rotate-x-2", - "rotate-x-3", - "rotate-x-45", - "rotate-x-6", - "rotate-x-90", - "rotate-y-0", - "rotate-y-1", - "rotate-y-12", - "rotate-y-180", - "rotate-y-2", - "rotate-y-3", - "rotate-y-45", - "rotate-y-6", - "rotate-y-90", - "rotate-z-0", - "rotate-z-1", - "rotate-z-12", - "rotate-z-180", - "rotate-z-2", - "rotate-z-3", - "rotate-z-45", - "rotate-z-6", - "rotate-z-90", - "rounded-b-full", - "rounded-b-none", - "rounded-bl-full", - "rounded-bl-none", - "rounded-br-full", - "rounded-br-none", - "rounded-e-full", - "rounded-e-none", - "rounded-ee-full", - "rounded-ee-none", - "rounded-es-full", - "rounded-es-none", - "rounded-full", - "rounded-l-full", - "rounded-l-none", - "rounded-none", - "rounded-r-full", - "rounded-r-none", - "rounded-s-full", - "rounded-s-none", - "rounded-se-full", - "rounded-se-none", - "rounded-ss-full", - "rounded-ss-none", - "rounded-t-full", - "rounded-t-none", - "rounded-tl-full", - "rounded-tl-none", - "rounded-tr-full", - "rounded-tr-none", - "row-auto", - "row-end-1", - "row-end-10", - "row-end-11", - "row-end-12", - "row-end-13", - "row-end-2", - "row-end-3", - "row-end-4", - "row-end-5", - "row-end-6", - "row-end-7", - "row-end-8", - "row-end-9", - "row-end-auto", - "row-span-1", - "row-span-10", - "row-span-11", - "row-span-12", - "row-span-2", - "row-span-3", - "row-span-4", - "row-span-5", - "row-span-6", - "row-span-7", - "row-span-8", - "row-span-9", - "row-span-full", - "row-start-1", - "row-start-10", - "row-start-11", - "row-start-12", - "row-start-13", - "row-start-2", - "row-start-3", - "row-start-4", - "row-start-5", - "row-start-6", - "row-start-7", - "row-start-8", - "row-start-9", - "row-start-auto", - "saturate-0", - "saturate-100", - "saturate-150", - "saturate-200", - "saturate-50", - "scale-0", - "scale-100", - "scale-105", - "scale-110", - "scale-125", - "scale-150", - "scale-200", - "scale-3d", - "scale-50", - "scale-75", - "scale-90", - "scale-95", - "scale-none", - "scale-x-0", - "scale-x-100", - "scale-x-105", - "scale-x-110", - "scale-x-125", - "scale-x-150", - "scale-x-200", - "scale-x-50", - "scale-x-75", - "scale-x-90", - "scale-x-95", - "scale-y-0", - "scale-y-100", - "scale-y-105", - "scale-y-110", - "scale-y-125", - "scale-y-150", - "scale-y-200", - "scale-y-50", - "scale-y-75", - "scale-y-90", - "scale-y-95", - "scale-z-0", - "scale-z-100", - "scale-z-105", - "scale-z-110", - "scale-z-125", - "scale-z-150", - "scale-z-200", - "scale-z-50", - "scale-z-75", - "scale-z-90", - "scale-z-95", - "scroll-auto", - "scroll-m-0.5", - "scroll-m-1", - "scroll-m-3", - "scroll-m-4", - "scroll-mb-0.5", - "scroll-mb-1", - "scroll-mb-3", - "scroll-mb-4", - "scroll-me-0.5", - "scroll-me-1", - "scroll-me-3", - "scroll-me-4", - "scroll-ml-0.5", - "scroll-ml-1", - "scroll-ml-3", - "scroll-ml-4", - "scroll-mr-0.5", - "scroll-mr-1", - "scroll-mr-3", - "scroll-mr-4", - "scroll-ms-0.5", - "scroll-ms-1", - "scroll-ms-3", - "scroll-ms-4", - "scroll-mt-0.5", - "scroll-mt-1", - "scroll-mt-3", - "scroll-mt-4", - "scroll-mx-0.5", - "scroll-mx-1", - "scroll-mx-3", - "scroll-mx-4", - "scroll-my-0.5", - "scroll-my-1", - "scroll-my-3", - "scroll-my-4", - "scroll-p-0.5", - "scroll-p-1", - "scroll-p-3", - "scroll-p-4", - "scroll-pb-0.5", - "scroll-pb-1", - "scroll-pb-3", - "scroll-pb-4", - "scroll-pe-0.5", - "scroll-pe-1", - "scroll-pe-3", - "scroll-pe-4", - "scroll-pl-0.5", - "scroll-pl-1", - "scroll-pl-3", - "scroll-pl-4", - "scroll-pr-0.5", - "scroll-pr-1", - "scroll-pr-3", - "scroll-pr-4", - "scroll-ps-0.5", - "scroll-ps-1", - "scroll-ps-3", - "scroll-ps-4", - "scroll-pt-0.5", - "scroll-pt-1", - "scroll-pt-3", - "scroll-pt-4", - "scroll-px-0.5", - "scroll-px-1", - "scroll-px-3", - "scroll-px-4", - "scroll-py-0.5", - "scroll-py-1", - "scroll-py-3", - "scroll-py-4", - "scroll-smooth", - "select-all", - "select-auto", - "select-none", - "select-text", - "self-auto", - "self-baseline", - "self-center", - "self-end", - "self-start", - "self-stretch", - "sepia", - "sepia-0", - "sepia-100", - "sepia-50", - "shadow", - "shadow-current", - "shadow-inherit", - "shadow-transparent", - "shrink", - "shrink-0", - "size-0.5", - "size-1", - "size-3", - "size-4", - "size-auto", - "size-fit", - "size-full", - "size-max", - "size-min", - "skew-0", - "skew-1", - "skew-12", - "skew-2", - "skew-3", - "skew-6", - "skew-x-0", - "skew-x-1", - "skew-x-12", - "skew-x-2", - "skew-x-3", - "skew-x-6", - "skew-y-0", - "skew-y-1", - "skew-y-12", - "skew-y-2", - "skew-y-3", - "skew-y-6", - "slashed-zero", - "snap-align-none", - "snap-always", - "snap-both", - "snap-center", - "snap-end", - "snap-mandatory", - "snap-none", - "snap-normal", - "snap-proximity", - "snap-start", - "snap-x", - "snap-y", - "space-x-0.5", - "space-x-1", - "space-x-3", - "space-x-4", - "space-x-reverse", - "space-y-0.5", - "space-y-1", - "space-y-3", - "space-y-4", - "space-y-reverse", - "sr-only", - "stacked-fractions", - "start-0.5", - "start-1", - "start-3", - "start-4", - "start-auto", - "start-full", - "static", - "sticky", - "stroke-0", - "stroke-1", - "stroke-2", - "stroke-3", - "stroke-current", - "stroke-inherit", - "stroke-none", - "stroke-transparent", - "subpixel-antialiased", - "table", - "table-auto", - "table-caption", - "table-cell", - "table-column", - "table-column-group", - "table-fixed", - "table-footer-group", - "table-header-group", - "table-row", - "table-row-group", - "tabular-nums", - "text-balance", - "text-center", - "text-clip", - "text-current", - "text-ellipsis", - "text-end", - "text-inherit", - "text-justify", - "text-left", - "text-nowrap", - "text-pretty", - "text-right", - "text-start", - "text-transparent", - "text-wrap", - "text-xs", - "to-0%", - "to-10%", - "to-100%", - "to-15%", - "to-20%", - "to-25%", - "to-30%", - "to-35%", - "to-40%", - "to-45%", - "to-5%", - "to-50%", - "to-55%", - "to-60%", - "to-65%", - "to-70%", - "to-75%", - "to-80%", - "to-85%", - "to-90%", - "to-95%", - "to-current", - "to-inherit", - "to-transparent", - "top-0.5", - "top-1", - "top-3", - "top-4", - "top-auto", - "top-full", - "touch-auto", - "touch-manipulation", - "touch-none", - "touch-pan-down", - "touch-pan-left", - "touch-pan-right", - "touch-pan-up", - "touch-pan-x", - "touch-pan-y", - "touch-pinch-zoom", - "transform", - "transform-3d", - "transform-border", - "transform-content", - "transform-cpu", - "transform-fill", - "transform-flat", - "transform-gpu", - "transform-none", - "transform-stroke", - "transform-view", - "transition", - "transition-all", - "transition-colors", - "transition-none", - "transition-opacity", - "transition-shadow", - "transition-transform", - "translate-0.5", - "translate-1", - "translate-3", - "translate-3d", - "translate-4", - "translate-full", - "translate-none", - "translate-x-0.5", - "translate-x-1", - "translate-x-3", - "translate-x-4", - "translate-x-full", - "translate-x-px", - "translate-y-0.5", - "translate-y-1", - "translate-y-3", - "translate-y-4", - "translate-y-full", - "translate-y-px", - "translate-z-0.5", - "translate-z-1", - "translate-z-3", - "translate-z-4", - "translate-z-px", - "truncate", - "underline", - "underline-offset-0", - "underline-offset-1", - "underline-offset-2", - "underline-offset-4", - "underline-offset-8", - "underline-offset-auto", - "uppercase", - "via-0%", - "via-10%", - "via-100%", - "via-15%", - "via-20%", - "via-25%", - "via-30%", - "via-35%", - "via-40%", - "via-45%", - "via-5%", - "via-50%", - "via-55%", - "via-60%", - "via-65%", - "via-70%", - "via-75%", - "via-80%", - "via-85%", - "via-90%", - "via-95%", - "via-current", - "via-inherit", - "via-none", - "via-transparent", - "visible", - "w-0.5", - "w-1", - "w-3", - "w-4", - "w-4", - "w-auto", - "w-dvw", - "w-fit", - "w-full", - "w-lvw", - "w-max", - "w-min", - "w-screen", - "w-svw", - "whitespace-break-spaces", - "whitespace-normal", - "whitespace-nowrap", - "whitespace-pre", - "whitespace-pre-line", - "whitespace-pre-wrap", - "will-change-auto", - "will-change-contents", - "will-change-scroll", - "will-change-transform", - "z-0", - "z-10", - "z-20", - "z-30", - "z-40", - "z-50", - "z-auto", -] -`; - -exports[`getVariants 1`] = ` -[ - { - "hasDash": true, - "isArbitrary": false, - "name": "force", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "*", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "not", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "group", - "selectors": [Function], - "values": [ - "not", - "group", - "peer", - "first", - "last", - "only", - "odd", - "even", - "first-of-type", - "last-of-type", - "only-of-type", - "visited", - "target", - "open", - "default", - "checked", - "indeterminate", - "placeholder-shown", - "autofill", - "optional", - "required", - "valid", - "invalid", - "in-range", - "out-of-range", - "read-only", - "empty", - "focus-within", - "hover", - "focus", - "focus-visible", - "active", - "enabled", - "disabled", - "has", - "aria", - "data", - "ltr", - "rtl", - ], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "peer", - "selectors": [Function], - "values": [ - "not", - "group", - "peer", - "first", - "last", - "only", - "odd", - "even", - "first-of-type", - "last-of-type", - "only-of-type", - "visited", - "target", - "open", - "default", - "checked", - "indeterminate", - "placeholder-shown", - "autofill", - "optional", - "required", - "valid", - "invalid", - "in-range", - "out-of-range", - "read-only", - "empty", - "focus-within", - "hover", - "focus", - "focus-visible", - "active", - "enabled", - "disabled", - "has", - "aria", - "data", - "ltr", - "rtl", - ], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "first-letter", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "first-line", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "marker", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "selection", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "file", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "placeholder", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "backdrop", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "before", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "after", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "first", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "last", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "only", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "odd", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "even", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "first-of-type", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "last-of-type", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "only-of-type", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "visited", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "target", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "open", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "default", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "checked", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "indeterminate", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "placeholder-shown", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "autofill", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "optional", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "required", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "valid", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "invalid", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "in-range", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "out-of-range", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "read-only", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "empty", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "focus-within", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "hover", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "focus", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "focus-visible", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "active", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "enabled", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "disabled", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "has", - "selectors": [Function], - "values": [ - "not", - "group", - "peer", - "first", - "last", - "only", - "odd", - "even", - "first-of-type", - "last-of-type", - "only-of-type", - "visited", - "target", - "open", - "default", - "checked", - "indeterminate", - "placeholder-shown", - "autofill", - "optional", - "required", - "valid", - "invalid", - "in-range", - "out-of-range", - "read-only", - "empty", - "focus-within", - "hover", - "focus", - "focus-visible", - "active", - "enabled", - "disabled", - "has", - "aria", - "data", - "ltr", - "rtl", - ], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "aria", - "selectors": [Function], - "values": [ - "busy", - "checked", - "disabled", - "expanded", - "hidden", - "pressed", - "readonly", - "required", - "selected", - ], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "data", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "supports", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "motion-safe", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "motion-reduce", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "contrast-more", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "contrast-less", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "max", - "selectors": [Function], - "values": [ - "sm", - ], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "sm", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "min", - "selectors": [Function], - "values": [ - "sm", - ], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "@max", - "selectors": [Function], - "values": [ - "4", - ], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "@", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": true, - "name": "@min", - "selectors": [Function], - "values": [ - "4", - ], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "portrait", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "landscape", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "ltr", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "rtl", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "dark", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "starting", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "print", - "selectors": [Function], - "values": [], - }, - { - "hasDash": true, - "isArbitrary": false, - "name": "forced-colors", - "selectors": [Function], - "values": [], - }, -] -`; diff --git a/packages/tailwindcss/src/backup__snapshots__/utilities.test.ts.snap b/packages/tailwindcss/src/backup__snapshots__/utilities.test.ts.snap deleted file mode 100644 index feeb8550adfa..000000000000 --- a/packages/tailwindcss/src/backup__snapshots__/utilities.test.ts.snap +++ /dev/null @@ -1,1082 +0,0 @@ -// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html - -exports[`border-* 1`] = ` -":root { - --radius-none: 0px; - --radius-full: 9999px; - --radius-sm: .125rem; - --color-red-500: #ef4444; -} - -.border { - border-style: var(--tw-border-style); - border-width: 1px; -} - -.border-0 { - border-style: var(--tw-border-style); - border-width: 0; -} - -.border-123 { - border-style: var(--tw-border-style); - border-width: 123px; -} - -.border-2 { - border-style: var(--tw-border-style); - border-width: 2px; -} - -.border-4 { - border-style: var(--tw-border-style); - border-width: 4px; -} - -.border-\\[12px\\] { - border-style: var(--tw-border-style); - border-width: 12px; -} - -.border-\\[length\\:--my-width\\], .border-\\[line-width\\:--my-width\\] { - border-style: var(--tw-border-style); - border-width: var(--my-width); -} - -.border-\\[medium\\] { - border-style: var(--tw-border-style); - border-width: medium; -} - -.border-\\[thick\\] { - border-style: var(--tw-border-style); - border-width: thick; -} - -.border-\\[thin\\] { - border-style: var(--tw-border-style); - border-width: thin; -} - -.border-\\[\\#0088cc\\] { - border-color: #08c; -} - -.border-\\[\\#0088cc\\]\\/50 { - border-color: #0088cc80; -} - -.border-\\[--my-color\\] { - border-color: var(--my-color); -} - -.border-\\[--my-color\\]\\/50 { - border-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-\\[color\\:--my-color\\] { - border-color: var(--my-color); -} - -.border-\\[color\\:--my-color\\]\\/50 { - border-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-current { - border-color: currentColor; -} - -.border-current\\/50 { - border-color: color-mix(in srgb, currentColor 50%, transparent); -} - -.border-inherit { - border-color: inherit; -} - -.border-red-500 { - border-color: var(--color-red-500, #ef4444); -} - -.border-red-500\\/50 { - border-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); -} - -.border-transparent { - border-color: #0000; -} - -@property --tw-border-style { - syntax: ""; - inherits: false; - initial-value: solid; -}" -`; - -exports[`border-b-* 1`] = ` -":root { - --radius-none: 0px; - --radius-full: 9999px; - --radius-sm: .125rem; - --color-red-500: #ef4444; -} - -.border-b { - border-bottom-style: var(--tw-border-style); - border-bottom-width: 1px; -} - -.border-b-0 { - border-bottom-style: var(--tw-border-style); - border-bottom-width: 0; -} - -.border-b-123 { - border-bottom-style: var(--tw-border-style); - border-bottom-width: 123px; -} - -.border-b-2 { - border-bottom-style: var(--tw-border-style); - border-bottom-width: 2px; -} - -.border-b-4 { - border-bottom-style: var(--tw-border-style); - border-bottom-width: 4px; -} - -.border-b-\\[12px\\] { - border-bottom-style: var(--tw-border-style); - border-bottom-width: 12px; -} - -.border-b-\\[length\\:--my-width\\], .border-b-\\[line-width\\:--my-width\\] { - border-bottom-style: var(--tw-border-style); - border-bottom-width: var(--my-width); -} - -.border-b-\\[medium\\] { - border-bottom-style: var(--tw-border-style); - border-bottom-width: medium; -} - -.border-b-\\[thick\\] { - border-bottom-style: var(--tw-border-style); - border-bottom-width: thick; -} - -.border-b-\\[thin\\] { - border-bottom-style: var(--tw-border-style); - border-bottom-width: thin; -} - -.border-b-\\[\\#0088cc\\] { - border-bottom-color: #08c; -} - -.border-b-\\[\\#0088cc\\]\\/50 { - border-bottom-color: #0088cc80; -} - -.border-b-\\[--my-color\\] { - border-bottom-color: var(--my-color); -} - -.border-b-\\[--my-color\\]\\/50 { - border-bottom-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-b-\\[color\\:--my-color\\] { - border-bottom-color: var(--my-color); -} - -.border-b-\\[color\\:--my-color\\]\\/50 { - border-bottom-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-b-current { - border-bottom-color: currentColor; -} - -.border-b-current\\/50 { - border-bottom-color: color-mix(in srgb, currentColor 50%, transparent); -} - -.border-b-inherit { - border-bottom-color: inherit; -} - -.border-b-red-500 { - border-bottom-color: var(--color-red-500, #ef4444); -} - -.border-b-red-500\\/50 { - border-bottom-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); -} - -.border-b-transparent { - border-bottom-color: #0000; -} - -@property --tw-border-style { - syntax: ""; - inherits: false; - initial-value: solid; -}" -`; - -exports[`border-e-* 1`] = ` -":root { - --radius-none: 0px; - --radius-full: 9999px; - --radius-sm: .125rem; - --color-red-500: #ef4444; -} - -.border-e { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: 1px; -} - -.border-e-0 { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: 0; -} - -.border-e-123 { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: 123px; -} - -.border-e-2 { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: 2px; -} - -.border-e-4 { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: 4px; -} - -.border-e-\\[12px\\] { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: 12px; -} - -.border-e-\\[length\\:--my-width\\], .border-e-\\[line-width\\:--my-width\\] { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: var(--my-width); -} - -.border-e-\\[medium\\] { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: medium; -} - -.border-e-\\[thick\\] { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: thick; -} - -.border-e-\\[thin\\] { - border-inline-end-style: var(--tw-border-style); - border-inline-end-width: thin; -} - -.border-e-\\[\\#0088cc\\] { - border-inline-end-color: #08c; -} - -.border-e-\\[\\#0088cc\\]\\/50 { - border-inline-end-color: #0088cc80; -} - -.border-e-\\[--my-color\\] { - border-inline-end-color: var(--my-color); -} - -.border-e-\\[--my-color\\]\\/50 { - border-inline-end-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-e-\\[color\\:--my-color\\] { - border-inline-end-color: var(--my-color); -} - -.border-e-\\[color\\:--my-color\\]\\/50 { - border-inline-end-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-e-current { - border-inline-end-color: currentColor; -} - -.border-e-current\\/50 { - border-inline-end-color: color-mix(in srgb, currentColor 50%, transparent); -} - -.border-e-inherit { - border-inline-end-color: inherit; -} - -.border-e-red-500 { - border-inline-end-color: var(--color-red-500, #ef4444); -} - -.border-e-red-500\\/50 { - border-inline-end-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); -} - -.border-e-transparent { - border-inline-end-color: #0000; -} - -@property --tw-border-style { - syntax: ""; - inherits: false; - initial-value: solid; -}" -`; - -exports[`border-l-* 1`] = ` -":root { - --radius-none: 0px; - --radius-full: 9999px; - --radius-sm: .125rem; - --color-red-500: #ef4444; -} - -.border-l { - border-left-style: var(--tw-border-style); - border-left-width: 1px; -} - -.border-l-0 { - border-left-style: var(--tw-border-style); - border-left-width: 0; -} - -.border-l-123 { - border-left-style: var(--tw-border-style); - border-left-width: 123px; -} - -.border-l-2 { - border-left-style: var(--tw-border-style); - border-left-width: 2px; -} - -.border-l-4 { - border-left-style: var(--tw-border-style); - border-left-width: 4px; -} - -.border-l-\\[12px\\] { - border-left-style: var(--tw-border-style); - border-left-width: 12px; -} - -.border-l-\\[length\\:--my-width\\], .border-l-\\[line-width\\:--my-width\\] { - border-left-style: var(--tw-border-style); - border-left-width: var(--my-width); -} - -.border-l-\\[medium\\] { - border-left-style: var(--tw-border-style); - border-left-width: medium; -} - -.border-l-\\[thick\\] { - border-left-style: var(--tw-border-style); - border-left-width: thick; -} - -.border-l-\\[thin\\] { - border-left-style: var(--tw-border-style); - border-left-width: thin; -} - -.border-l-\\[\\#0088cc\\] { - border-left-color: #08c; -} - -.border-l-\\[\\#0088cc\\]\\/50 { - border-left-color: #0088cc80; -} - -.border-l-\\[--my-color\\] { - border-left-color: var(--my-color); -} - -.border-l-\\[--my-color\\]\\/50 { - border-left-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-l-\\[color\\:--my-color\\] { - border-left-color: var(--my-color); -} - -.border-l-\\[color\\:--my-color\\]\\/50 { - border-left-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-l-current { - border-left-color: currentColor; -} - -.border-l-current\\/50 { - border-left-color: color-mix(in srgb, currentColor 50%, transparent); -} - -.border-l-inherit { - border-left-color: inherit; -} - -.border-l-red-500 { - border-left-color: var(--color-red-500, #ef4444); -} - -.border-l-red-500\\/50 { - border-left-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); -} - -.border-l-transparent { - border-left-color: #0000; -} - -@property --tw-border-style { - syntax: ""; - inherits: false; - initial-value: solid; -}" -`; - -exports[`border-r-* 1`] = ` -":root { - --radius-none: 0px; - --radius-full: 9999px; - --radius-sm: .125rem; - --color-red-500: #ef4444; -} - -.border-r { - border-right-style: var(--tw-border-style); - border-right-width: 1px; -} - -.border-r-0 { - border-right-style: var(--tw-border-style); - border-right-width: 0; -} - -.border-r-123 { - border-right-style: var(--tw-border-style); - border-right-width: 123px; -} - -.border-r-2 { - border-right-style: var(--tw-border-style); - border-right-width: 2px; -} - -.border-r-4 { - border-right-style: var(--tw-border-style); - border-right-width: 4px; -} - -.border-r-\\[12px\\] { - border-right-style: var(--tw-border-style); - border-right-width: 12px; -} - -.border-r-\\[length\\:--my-width\\], .border-r-\\[line-width\\:--my-width\\] { - border-right-style: var(--tw-border-style); - border-right-width: var(--my-width); -} - -.border-r-\\[medium\\] { - border-right-style: var(--tw-border-style); - border-right-width: medium; -} - -.border-r-\\[thick\\] { - border-right-style: var(--tw-border-style); - border-right-width: thick; -} - -.border-r-\\[thin\\] { - border-right-style: var(--tw-border-style); - border-right-width: thin; -} - -.border-r-\\[\\#0088cc\\] { - border-right-color: #08c; -} - -.border-r-\\[\\#0088cc\\]\\/50 { - border-right-color: #0088cc80; -} - -.border-r-\\[--my-color\\] { - border-right-color: var(--my-color); -} - -.border-r-\\[--my-color\\]\\/50 { - border-right-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-r-\\[color\\:--my-color\\] { - border-right-color: var(--my-color); -} - -.border-r-\\[color\\:--my-color\\]\\/50 { - border-right-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-r-current { - border-right-color: currentColor; -} - -.border-r-current\\/50 { - border-right-color: color-mix(in srgb, currentColor 50%, transparent); -} - -.border-r-inherit { - border-right-color: inherit; -} - -.border-r-red-500 { - border-right-color: var(--color-red-500, #ef4444); -} - -.border-r-red-500\\/50 { - border-right-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); -} - -.border-r-transparent { - border-right-color: #0000; -} - -@property --tw-border-style { - syntax: ""; - inherits: false; - initial-value: solid; -}" -`; - -exports[`border-s-* 1`] = ` -":root { - --radius-none: 0px; - --radius-full: 9999px; - --radius-sm: .125rem; - --color-red-500: #ef4444; -} - -.border-s { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: 1px; -} - -.border-s-0 { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: 0; -} - -.border-s-123 { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: 123px; -} - -.border-s-2 { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: 2px; -} - -.border-s-4 { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: 4px; -} - -.border-s-\\[12px\\] { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: 12px; -} - -.border-s-\\[length\\:--my-width\\], .border-s-\\[line-width\\:--my-width\\] { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: var(--my-width); -} - -.border-s-\\[medium\\] { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: medium; -} - -.border-s-\\[thick\\] { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: thick; -} - -.border-s-\\[thin\\] { - border-inline-start-style: var(--tw-border-style); - border-inline-start-width: thin; -} - -.border-s-\\[\\#0088cc\\] { - border-inline-start-color: #08c; -} - -.border-s-\\[\\#0088cc\\]\\/50 { - border-inline-start-color: #0088cc80; -} - -.border-s-\\[--my-color\\] { - border-inline-start-color: var(--my-color); -} - -.border-s-\\[--my-color\\]\\/50 { - border-inline-start-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-s-\\[color\\:--my-color\\] { - border-inline-start-color: var(--my-color); -} - -.border-s-\\[color\\:--my-color\\]\\/50 { - border-inline-start-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-s-current { - border-inline-start-color: currentColor; -} - -.border-s-current\\/50 { - border-inline-start-color: color-mix(in srgb, currentColor 50%, transparent); -} - -.border-s-inherit { - border-inline-start-color: inherit; -} - -.border-s-red-500 { - border-inline-start-color: var(--color-red-500, #ef4444); -} - -.border-s-red-500\\/50 { - border-inline-start-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); -} - -.border-s-transparent { - border-inline-start-color: #0000; -} - -@property --tw-border-style { - syntax: ""; - inherits: false; - initial-value: solid; -}" -`; - -exports[`border-t-* 1`] = ` -":root { - --radius-none: 0px; - --radius-full: 9999px; - --radius-sm: .125rem; - --color-red-500: #ef4444; -} - -.border-t { - border-top-style: var(--tw-border-style); - border-top-width: 1px; -} - -.border-t-0 { - border-top-style: var(--tw-border-style); - border-top-width: 0; -} - -.border-t-123 { - border-top-style: var(--tw-border-style); - border-top-width: 123px; -} - -.border-t-2 { - border-top-style: var(--tw-border-style); - border-top-width: 2px; -} - -.border-t-4 { - border-top-style: var(--tw-border-style); - border-top-width: 4px; -} - -.border-t-\\[12px\\] { - border-top-style: var(--tw-border-style); - border-top-width: 12px; -} - -.border-t-\\[length\\:--my-width\\], .border-t-\\[line-width\\:--my-width\\] { - border-top-style: var(--tw-border-style); - border-top-width: var(--my-width); -} - -.border-t-\\[medium\\] { - border-top-style: var(--tw-border-style); - border-top-width: medium; -} - -.border-t-\\[thick\\] { - border-top-style: var(--tw-border-style); - border-top-width: thick; -} - -.border-t-\\[thin\\] { - border-top-style: var(--tw-border-style); - border-top-width: thin; -} - -.border-t-\\[\\#0088cc\\] { - border-top-color: #08c; -} - -.border-t-\\[\\#0088cc\\]\\/50 { - border-top-color: #0088cc80; -} - -.border-t-\\[--my-color\\] { - border-top-color: var(--my-color); -} - -.border-t-\\[--my-color\\]\\/50 { - border-top-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-t-\\[color\\:--my-color\\] { - border-top-color: var(--my-color); -} - -.border-t-\\[color\\:--my-color\\]\\/50 { - border-top-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-t-current { - border-top-color: currentColor; -} - -.border-t-current\\/50 { - border-top-color: color-mix(in srgb, currentColor 50%, transparent); -} - -.border-t-inherit { - border-top-color: inherit; -} - -.border-t-red-500 { - border-top-color: var(--color-red-500, #ef4444); -} - -.border-t-red-500\\/50 { - border-top-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); -} - -.border-t-transparent { - border-top-color: #0000; -} - -@property --tw-border-style { - syntax: ""; - inherits: false; - initial-value: solid; -}" -`; - -exports[`border-x-* 1`] = ` -":root { - --radius-none: 0px; - --radius-full: 9999px; - --radius-sm: .125rem; - --color-red-500: #ef4444; -} - -.border-x { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: 1px; - border-right-width: 1px; -} - -.border-x-0 { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: 0; - border-right-width: 0; -} - -.border-x-123 { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: 123px; - border-right-width: 123px; -} - -.border-x-2 { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: 2px; - border-right-width: 2px; -} - -.border-x-4 { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: 4px; - border-right-width: 4px; -} - -.border-x-\\[12px\\] { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: 12px; - border-right-width: 12px; -} - -.border-x-\\[length\\:--my-width\\], .border-x-\\[line-width\\:--my-width\\] { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: var(--my-width); - border-right-width: var(--my-width); -} - -.border-x-\\[medium\\] { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: medium; - border-right-width: medium; -} - -.border-x-\\[thick\\] { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: thick; - border-right-width: thick; -} - -.border-x-\\[thin\\] { - border-left-style: var(--tw-border-style); - border-right-style: var(--tw-border-style); - border-left-width: thin; - border-right-width: thin; -} - -.border-x-\\[\\#0088cc\\] { - border-left-color: #08c; - border-right-color: #08c; -} - -.border-x-\\[\\#0088cc\\]\\/50 { - border-left-color: #0088cc80; - border-right-color: #0088cc80; -} - -.border-x-\\[--my-color\\] { - border-left-color: var(--my-color); - border-right-color: var(--my-color); -} - -.border-x-\\[--my-color\\]\\/50 { - border-left-color: color-mix(in srgb, var(--my-color) 50%, transparent); - border-right-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-x-\\[color\\:--my-color\\] { - border-left-color: var(--my-color); - border-right-color: var(--my-color); -} - -.border-x-\\[color\\:--my-color\\]\\/50 { - border-left-color: color-mix(in srgb, var(--my-color) 50%, transparent); - border-right-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-x-current { - border-left-color: currentColor; - border-right-color: currentColor; -} - -.border-x-current\\/50 { - border-left-color: color-mix(in srgb, currentColor 50%, transparent); - border-right-color: color-mix(in srgb, currentColor 50%, transparent); -} - -.border-x-inherit { - border-left-color: inherit; - border-right-color: inherit; -} - -.border-x-red-500 { - border-left-color: var(--color-red-500, #ef4444); - border-right-color: var(--color-red-500, #ef4444); -} - -.border-x-red-500\\/50 { - border-left-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); - border-right-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); -} - -.border-x-transparent { - border-left-color: #0000; - border-right-color: #0000; -} - -@property --tw-border-style { - syntax: ""; - inherits: false; - initial-value: solid; -}" -`; - -exports[`border-y-* 1`] = ` -":root { - --radius-none: 0px; - --radius-full: 9999px; - --radius-sm: .125rem; - --color-red-500: #ef4444; -} - -.border-y { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: 1px; - border-bottom-width: 1px; -} - -.border-y-0 { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: 0; - border-bottom-width: 0; -} - -.border-y-123 { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: 123px; - border-bottom-width: 123px; -} - -.border-y-2 { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: 2px; - border-bottom-width: 2px; -} - -.border-y-4 { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: 4px; - border-bottom-width: 4px; -} - -.border-y-\\[12px\\] { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: 12px; - border-bottom-width: 12px; -} - -.border-y-\\[length\\:--my-width\\], .border-y-\\[line-width\\:--my-width\\] { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: var(--my-width); - border-bottom-width: var(--my-width); -} - -.border-y-\\[medium\\] { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: medium; - border-bottom-width: medium; -} - -.border-y-\\[thick\\] { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: thick; - border-bottom-width: thick; -} - -.border-y-\\[thin\\] { - border-top-style: var(--tw-border-style); - border-bottom-style: var(--tw-border-style); - border-top-width: thin; - border-bottom-width: thin; -} - -.border-y-\\[\\#0088cc\\] { - border-top-color: #08c; - border-bottom-color: #08c; -} - -.border-y-\\[\\#0088cc\\]\\/50 { - border-top-color: #0088cc80; - border-bottom-color: #0088cc80; -} - -.border-y-\\[--my-color\\] { - border-top-color: var(--my-color); - border-bottom-color: var(--my-color); -} - -.border-y-\\[--my-color\\]\\/50 { - border-top-color: color-mix(in srgb, var(--my-color) 50%, transparent); - border-bottom-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-y-\\[color\\:--my-color\\] { - border-top-color: var(--my-color); - border-bottom-color: var(--my-color); -} - -.border-y-\\[color\\:--my-color\\]\\/50 { - border-top-color: color-mix(in srgb, var(--my-color) 50%, transparent); - border-bottom-color: color-mix(in srgb, var(--my-color) 50%, transparent); -} - -.border-y-current { - border-top-color: currentColor; - border-bottom-color: currentColor; -} - -.border-y-current\\/50 { - border-top-color: color-mix(in srgb, currentColor 50%, transparent); - border-bottom-color: color-mix(in srgb, currentColor 50%, transparent); -} - -.border-y-inherit { - border-top-color: inherit; - border-bottom-color: inherit; -} - -.border-y-red-500 { - border-top-color: var(--color-red-500, #ef4444); - border-bottom-color: var(--color-red-500, #ef4444); -} - -.border-y-red-500\\/50 { - border-top-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); - border-bottom-color: color-mix(in srgb, var(--color-red-500, #ef4444) 50%, transparent); -} - -.border-y-transparent { - border-top-color: #0000; - border-bottom-color: #0000; -} - -@property --tw-border-style { - syntax: ""; - inherits: false; - initial-value: solid; -}" -`; From a45363f439f7f6821ad4dadf6cd7f6d3329775b1 Mon Sep 17 00:00:00 2001 From: Brandon McConnell Date: Thu, 28 Mar 2024 03:55:00 -0700 Subject: [PATCH 4/4] Add tests for container queries --- packages/tailwindcss/src/variants.test.ts | 39 +++++++++++++++++++++++ 1 file changed, 39 insertions(+) diff --git a/packages/tailwindcss/src/variants.test.ts b/packages/tailwindcss/src/variants.test.ts index 7458e413d98f..ec4c7711d5db 100644 --- a/packages/tailwindcss/src/variants.test.ts +++ b/packages/tailwindcss/src/variants.test.ts @@ -1705,6 +1705,21 @@ test('container queries', () => { '@max-lg/name:flex', '@max-[123px]:flex', '@max-[456px]/name:flex', + + '@h-lg:flex', + '@h-lg/name:flex', + '@h-[123px]:flex', + '@h-[456px]/name:flex', + + '@min-h-lg:flex', + '@min-h-lg/name:flex', + '@min-h-[123px]:flex', + '@min-h-[456px]/name:flex', + + '@max-h-lg:flex', + '@max-h-lg/name:flex', + '@max-h-[123px]:flex', + '@max-h-[456px]/name:flex', ], ), ).toMatchInlineSnapshot(` @@ -1782,6 +1797,30 @@ test('container queries', () => { .\\@min-lg\\/name\\:flex { display: flex; } + } + + @container name (height < 456px) { + .\\@max-h-\\[456px\\]\\/name\\:flex { + display: flex; + } + } + + @container (height < 123px) { + .\\@max-h-\\[123px\\]\\:flex { + display: flex; + } + } + + @container (height >= 123px) { + .\\@min-h-\\[123px\\]\\:flex { + display: flex; + } + } + + @container name (height >= 456px) { + .\\@min-h-\\[456px\\]\\/name\\:flex { + display: flex; + } }" `) })