wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Merge pull request #1333 from tailwindcss/add-shadow-xs

Browse source 
Add shadow-xs, increase alpha of shadow-sm to 0.05
This commit is contained in:
Adam Wathan 2020-01-23 21:27:39 -05:00 • committed by GitHub
commit 4d36f81239
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 152 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

90
__tests__/fixtures/tailwind-output-important.css
View file

@ -6761,8 +6761,12 @@ video {
resize: both !important;
}
.shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.shadow {
@ -6797,8 +6801,12 @@ video {
box-shadow: none !important;
}
.hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.hover\:shadow:hover {
@ -6833,8 +6841,12 @@ video {
box-shadow: none !important;
}
.focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.focus\:shadow:focus {
@ -16540,8 +16552,12 @@ video {
resize: both !important;
}
.sm\:shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.sm\:shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.sm\:shadow {
@ -16576,8 +16592,12 @@ video {
box-shadow: none !important;
}
.sm\:hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.sm\:hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.sm\:hover\:shadow:hover {
@ -16612,8 +16632,12 @@ video {
box-shadow: none !important;
}
.sm\:focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.sm\:focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.sm\:focus\:shadow:focus {
@ -26320,8 +26344,12 @@ video {
resize: both !important;
}
.md\:shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.md\:shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.md\:shadow {
@ -26356,8 +26384,12 @@ video {
box-shadow: none !important;
}
.md\:hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.md\:hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.md\:hover\:shadow:hover {
@ -26392,8 +26424,12 @@ video {
box-shadow: none !important;
}
.md\:focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.md\:focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.md\:focus\:shadow:focus {
@ -36100,8 +36136,12 @@ video {
resize: both !important;
}
.lg\:shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.lg\:shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.lg\:shadow {
@ -36136,8 +36176,12 @@ video {
box-shadow: none !important;
}
.lg\:hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.lg\:hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.lg\:hover\:shadow:hover {
@ -36172,8 +36216,12 @@ video {
box-shadow: none !important;
}
.lg\:focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.lg\:focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.lg\:focus\:shadow:focus {
@ -45880,8 +45928,12 @@ video {
resize: both !important;
}
.xl\:shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.xl\:shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.xl\:shadow {
@ -45916,8 +45968,12 @@ video {
box-shadow: none !important;
}
.xl\:hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.xl\:hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.xl\:hover\:shadow:hover {
@ -45952,8 +46008,12 @@ video {
box-shadow: none !important;
}
.xl\:focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}
.xl\:focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04) !important;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.xl\:focus\:shadow:focus {

90
__tests__/fixtures/tailwind-output.css
View file

@ -6761,8 +6761,12 @@ video {
resize: both;
}
.shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.shadow {
@ -6797,8 +6801,12 @@ video {
box-shadow: none;
}
.hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.hover\:shadow:hover {
@ -6833,8 +6841,12 @@ video {
box-shadow: none;
}
.focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.focus\:shadow:focus {
@ -16540,8 +16552,12 @@ video {
resize: both;
}
.sm\:shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.sm\:shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.sm\:shadow {
@ -16576,8 +16592,12 @@ video {
box-shadow: none;
}
.sm\:hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.sm\:hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.sm\:hover\:shadow:hover {
@ -16612,8 +16632,12 @@ video {
box-shadow: none;
}
.sm\:focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.sm\:focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.sm\:focus\:shadow:focus {
@ -26320,8 +26344,12 @@ video {
resize: both;
}
.md\:shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.md\:shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.md\:shadow {
@ -26356,8 +26384,12 @@ video {
box-shadow: none;
}
.md\:hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.md\:hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.md\:hover\:shadow:hover {
@ -26392,8 +26424,12 @@ video {
box-shadow: none;
}
.md\:focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.md\:focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.md\:focus\:shadow:focus {
@ -36100,8 +36136,12 @@ video {
resize: both;
}
.lg\:shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.lg\:shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.lg\:shadow {
@ -36136,8 +36176,12 @@ video {
box-shadow: none;
}
.lg\:hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.lg\:hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.lg\:hover\:shadow:hover {
@ -36172,8 +36216,12 @@ video {
box-shadow: none;
}
.lg\:focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.lg\:focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.lg\:focus\:shadow:focus {
@ -45880,8 +45928,12 @@ video {
resize: both;
}
.xl\:shadow-xs {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.xl\:shadow-sm {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.xl\:shadow {
@ -45916,8 +45968,12 @@ video {
box-shadow: none;
}
.xl\:hover\:shadow-xs:hover {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.xl\:hover\:shadow-sm:hover {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.xl\:hover\:shadow:hover {
@ -45952,8 +46008,12 @@ video {
box-shadow: none;
}
.xl\:focus\:shadow-xs:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.xl\:focus\:shadow-sm:focus {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.xl\:focus\:shadow:focus {

3
stubs/defaultConfig.stub.js
View file

@ -184,7 +184,8 @@ module.exports = {
'8': '8px',
},
boxShadow: {
sm: '0 1px 2px 0 rgba(0, 0, 0, 0.04)',
xs: '0 0 0 1px rgba(0, 0, 0, 0.05)',
sm: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
default: '0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)',
md: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
lg: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',