From 369cfae2905a577033529c46a5e8ca58c69f5623 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Fri, 6 Nov 2020 22:36:18 -0500 Subject: [PATCH] Add "shadow-solid" utility --- .../fixtures/tailwind-output-flagged.css | 72 +++++++++++++++++++ .../fixtures/tailwind-output-important.css | 72 +++++++++++++++++++ .../tailwind-output-no-color-opacity.css | 72 +++++++++++++++++++ __tests__/fixtures/tailwind-output.css | 72 +++++++++++++++++++ stubs/defaultConfig.stub.js | 1 + 5 files changed, 289 insertions(+) diff --git a/__tests__/fixtures/tailwind-output-flagged.css b/__tests__/fixtures/tailwind-output-flagged.css index 7123a9ae32f0..edc3ad594bf9 100644 --- a/__tests__/fixtures/tailwind-output-flagged.css +++ b/__tests__/fixtures/tailwind-output-flagged.css @@ -18445,6 +18445,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } +.shadow-solid { + box-shadow: 0 0 0 2px currentColor; +} + .shadow-none { box-shadow: none; } @@ -18485,6 +18489,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } +.hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; +} + .hover\:shadow-none:hover { box-shadow: none; } @@ -18525,6 +18533,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } +.focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; +} + .focus\:shadow-none:focus { box-shadow: none; } @@ -42910,6 +42922,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .sm\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .sm\:shadow-none { box-shadow: none; } @@ -42950,6 +42966,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .sm\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .sm\:hover\:shadow-none:hover { box-shadow: none; } @@ -42990,6 +43010,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .sm\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .sm\:focus\:shadow-none:focus { box-shadow: none; } @@ -67345,6 +67369,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .md\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .md\:shadow-none { box-shadow: none; } @@ -67385,6 +67413,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .md\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .md\:hover\:shadow-none:hover { box-shadow: none; } @@ -67425,6 +67457,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .md\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .md\:focus\:shadow-none:focus { box-shadow: none; } @@ -91780,6 +91816,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .lg\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .lg\:shadow-none { box-shadow: none; } @@ -91820,6 +91860,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .lg\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .lg\:hover\:shadow-none:hover { box-shadow: none; } @@ -91860,6 +91904,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .lg\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .lg\:focus\:shadow-none:focus { box-shadow: none; } @@ -116215,6 +116263,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .xl\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .xl\:shadow-none { box-shadow: none; } @@ -116255,6 +116307,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .xl\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .xl\:hover\:shadow-none:hover { box-shadow: none; } @@ -116295,6 +116351,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .xl\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .xl\:focus\:shadow-none:focus { box-shadow: none; } @@ -140650,6 +140710,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .\32xl\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .\32xl\:shadow-none { box-shadow: none; } @@ -140690,6 +140754,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .\32xl\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .\32xl\:hover\:shadow-none:hover { box-shadow: none; } @@ -140730,6 +140798,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .\32xl\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .\32xl\:focus\:shadow-none:focus { box-shadow: none; } diff --git a/__tests__/fixtures/tailwind-output-important.css b/__tests__/fixtures/tailwind-output-important.css index e293d37aa8e9..ab375ac174e6 100644 --- a/__tests__/fixtures/tailwind-output-important.css +++ b/__tests__/fixtures/tailwind-output-important.css @@ -18445,6 +18445,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } +.shadow-solid { + box-shadow: 0 0 0 2px currentColor !important; +} + .shadow-none { box-shadow: none !important; } @@ -18485,6 +18489,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } +.hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor !important; +} + .hover\:shadow-none:hover { box-shadow: none !important; } @@ -18525,6 +18533,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } +.focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor !important; +} + .focus\:shadow-none:focus { box-shadow: none !important; } @@ -42910,6 +42922,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .sm\:shadow-solid { + box-shadow: 0 0 0 2px currentColor !important; + } + .sm\:shadow-none { box-shadow: none !important; } @@ -42950,6 +42966,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .sm\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor !important; + } + .sm\:hover\:shadow-none:hover { box-shadow: none !important; } @@ -42990,6 +43010,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .sm\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor !important; + } + .sm\:focus\:shadow-none:focus { box-shadow: none !important; } @@ -67345,6 +67369,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .md\:shadow-solid { + box-shadow: 0 0 0 2px currentColor !important; + } + .md\:shadow-none { box-shadow: none !important; } @@ -67385,6 +67413,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .md\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor !important; + } + .md\:hover\:shadow-none:hover { box-shadow: none !important; } @@ -67425,6 +67457,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .md\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor !important; + } + .md\:focus\:shadow-none:focus { box-shadow: none !important; } @@ -91780,6 +91816,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .lg\:shadow-solid { + box-shadow: 0 0 0 2px currentColor !important; + } + .lg\:shadow-none { box-shadow: none !important; } @@ -91820,6 +91860,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .lg\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor !important; + } + .lg\:hover\:shadow-none:hover { box-shadow: none !important; } @@ -91860,6 +91904,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .lg\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor !important; + } + .lg\:focus\:shadow-none:focus { box-shadow: none !important; } @@ -116215,6 +116263,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .xl\:shadow-solid { + box-shadow: 0 0 0 2px currentColor !important; + } + .xl\:shadow-none { box-shadow: none !important; } @@ -116255,6 +116307,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .xl\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor !important; + } + .xl\:hover\:shadow-none:hover { box-shadow: none !important; } @@ -116295,6 +116351,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .xl\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor !important; + } + .xl\:focus\:shadow-none:focus { box-shadow: none !important; } @@ -140650,6 +140710,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .\32xl\:shadow-solid { + box-shadow: 0 0 0 2px currentColor !important; + } + .\32xl\:shadow-none { box-shadow: none !important; } @@ -140690,6 +140754,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .\32xl\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor !important; + } + .\32xl\:hover\:shadow-none:hover { box-shadow: none !important; } @@ -140730,6 +140798,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5) !important; } + .\32xl\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor !important; + } + .\32xl\:focus\:shadow-none:focus { box-shadow: none !important; } diff --git a/__tests__/fixtures/tailwind-output-no-color-opacity.css b/__tests__/fixtures/tailwind-output-no-color-opacity.css index fda09cbfdc24..bf69a3342377 100644 --- a/__tests__/fixtures/tailwind-output-no-color-opacity.css +++ b/__tests__/fixtures/tailwind-output-no-color-opacity.css @@ -16971,6 +16971,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } +.shadow-solid { + box-shadow: 0 0 0 2px currentColor; +} + .shadow-none { box-shadow: none; } @@ -17011,6 +17015,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } +.hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; +} + .hover\:shadow-none:hover { box-shadow: none; } @@ -17051,6 +17059,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } +.focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; +} + .focus\:shadow-none:focus { box-shadow: none; } @@ -39426,6 +39438,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .sm\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .sm\:shadow-none { box-shadow: none; } @@ -39466,6 +39482,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .sm\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .sm\:hover\:shadow-none:hover { box-shadow: none; } @@ -39506,6 +39526,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .sm\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .sm\:focus\:shadow-none:focus { box-shadow: none; } @@ -61851,6 +61875,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .md\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .md\:shadow-none { box-shadow: none; } @@ -61891,6 +61919,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .md\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .md\:hover\:shadow-none:hover { box-shadow: none; } @@ -61931,6 +61963,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .md\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .md\:focus\:shadow-none:focus { box-shadow: none; } @@ -84276,6 +84312,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .lg\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .lg\:shadow-none { box-shadow: none; } @@ -84316,6 +84356,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .lg\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .lg\:hover\:shadow-none:hover { box-shadow: none; } @@ -84356,6 +84400,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .lg\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .lg\:focus\:shadow-none:focus { box-shadow: none; } @@ -106701,6 +106749,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .xl\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .xl\:shadow-none { box-shadow: none; } @@ -106741,6 +106793,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .xl\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .xl\:hover\:shadow-none:hover { box-shadow: none; } @@ -106781,6 +106837,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .xl\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .xl\:focus\:shadow-none:focus { box-shadow: none; } @@ -129126,6 +129186,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .\32xl\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .\32xl\:shadow-none { box-shadow: none; } @@ -129166,6 +129230,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .\32xl\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .\32xl\:hover\:shadow-none:hover { box-shadow: none; } @@ -129206,6 +129274,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .\32xl\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .\32xl\:focus\:shadow-none:focus { box-shadow: none; } diff --git a/__tests__/fixtures/tailwind-output.css b/__tests__/fixtures/tailwind-output.css index 7123a9ae32f0..edc3ad594bf9 100644 --- a/__tests__/fixtures/tailwind-output.css +++ b/__tests__/fixtures/tailwind-output.css @@ -18445,6 +18445,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } +.shadow-solid { + box-shadow: 0 0 0 2px currentColor; +} + .shadow-none { box-shadow: none; } @@ -18485,6 +18489,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } +.hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; +} + .hover\:shadow-none:hover { box-shadow: none; } @@ -18525,6 +18533,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } +.focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; +} + .focus\:shadow-none:focus { box-shadow: none; } @@ -42910,6 +42922,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .sm\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .sm\:shadow-none { box-shadow: none; } @@ -42950,6 +42966,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .sm\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .sm\:hover\:shadow-none:hover { box-shadow: none; } @@ -42990,6 +43010,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .sm\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .sm\:focus\:shadow-none:focus { box-shadow: none; } @@ -67345,6 +67369,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .md\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .md\:shadow-none { box-shadow: none; } @@ -67385,6 +67413,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .md\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .md\:hover\:shadow-none:hover { box-shadow: none; } @@ -67425,6 +67457,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .md\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .md\:focus\:shadow-none:focus { box-shadow: none; } @@ -91780,6 +91816,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .lg\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .lg\:shadow-none { box-shadow: none; } @@ -91820,6 +91860,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .lg\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .lg\:hover\:shadow-none:hover { box-shadow: none; } @@ -91860,6 +91904,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .lg\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .lg\:focus\:shadow-none:focus { box-shadow: none; } @@ -116215,6 +116263,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .xl\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .xl\:shadow-none { box-shadow: none; } @@ -116255,6 +116307,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .xl\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .xl\:hover\:shadow-none:hover { box-shadow: none; } @@ -116295,6 +116351,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .xl\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .xl\:focus\:shadow-none:focus { box-shadow: none; } @@ -140650,6 +140710,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .\32xl\:shadow-solid { + box-shadow: 0 0 0 2px currentColor; + } + .\32xl\:shadow-none { box-shadow: none; } @@ -140690,6 +140754,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .\32xl\:hover\:shadow-solid:hover { + box-shadow: 0 0 0 2px currentColor; + } + .\32xl\:hover\:shadow-none:hover { box-shadow: none; } @@ -140730,6 +140798,10 @@ video { box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.5); } + .\32xl\:focus\:shadow-solid:focus { + box-shadow: 0 0 0 2px currentColor; + } + .\32xl\:focus\:shadow-none:focus { box-shadow: none; } diff --git a/stubs/defaultConfig.stub.js b/stubs/defaultConfig.stub.js index d7e04a06c822..cab7f1715c82 100644 --- a/stubs/defaultConfig.stub.js +++ b/stubs/defaultConfig.stub.js @@ -134,6 +134,7 @@ module.exports = { '2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.25)', inner: 'inset 0 2px 4px 0 rgba(0, 0, 0, 0.06)', outline: '0 0 0 3px rgba(147, 197, 253, 0.5)', + solid: '0 0 0 2px currentColor', none: 'none', }, container: {},