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

Merge pull request #491 from tailwindcss/no-outline

Browse source 
Add "outline-none" and "shadow-outline" utilities
This commit is contained in:
Adam Wathan 2018-06-21 03:52:00 +09:30 • committed by GitHub
commit 1fc8a85ffd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 160 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -518,16 +518,6 @@ ul {
margin: 0;
}
/**
* Suppress the focus outline on elements that cannot be accessed via keyboard.
* This prevents an unwanted focus outline from appearing around elements that
* might still respond to pointer events.
*/
[tabindex="-1"]:focus {
outline: none !important;
}
/**
* Tailwind custom reset styles
*/
@ -3204,6 +3194,14 @@ table {
opacity: 1;
}
.outline-none {
outline: 0;
}
.focus\:outline-none:focus {
outline: 0;
}
.overflow-auto {
overflow: auto;
}
@ -3600,10 +3598,38 @@ table {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.shadow-outline {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.shadow-none {
box-shadow: none;
}
.focus\:shadow:focus {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1);
}
.focus\:shadow-md:focus {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08);
}
.focus\:shadow-lg:focus {
box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08);
}
.focus\:shadow-inner:focus {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.focus\:shadow-outline:focus {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.focus\:shadow-none:focus {
box-shadow: none;
}
.fill-current {
fill: currentColor;
}
@ -7521,10 +7547,38 @@ table {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.sm\:shadow-outline {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.sm\:shadow-none {
box-shadow: none;
}
.sm\:focus\:shadow:focus {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1);
}
.sm\:focus\:shadow-md:focus {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08);
}
.sm\:focus\:shadow-lg:focus {
box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08);
}
.sm\:focus\:shadow-inner:focus {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.sm\:focus\:shadow-outline:focus {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.sm\:focus\:shadow-none:focus {
box-shadow: none;
}
.sm\:text-left {
text-align: left;
}
@ -11435,10 +11489,38 @@ table {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.md\:shadow-outline {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.md\:shadow-none {
box-shadow: none;
}
.md\:focus\:shadow:focus {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1);
}
.md\:focus\:shadow-md:focus {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08);
}
.md\:focus\:shadow-lg:focus {
box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08);
}
.md\:focus\:shadow-inner:focus {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.md\:focus\:shadow-outline:focus {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.md\:focus\:shadow-none:focus {
box-shadow: none;
}
.md\:text-left {
text-align: left;
}
@ -15349,10 +15431,38 @@ table {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.lg\:shadow-outline {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.lg\:shadow-none {
box-shadow: none;
}
.lg\:focus\:shadow:focus {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1);
}
.lg\:focus\:shadow-md:focus {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08);
}
.lg\:focus\:shadow-lg:focus {
box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08);
}
.lg\:focus\:shadow-inner:focus {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.lg\:focus\:shadow-outline:focus {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.lg\:focus\:shadow-none:focus {
box-shadow: none;
}
.lg\:text-left {
text-align: left;
}
@ -19263,10 +19373,38 @@ table {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.xl\:shadow-outline {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.xl\:shadow-none {
box-shadow: none;
}
.xl\:focus\:shadow:focus {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1);
}
.xl\:focus\:shadow-md:focus {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .12), 0 2px 4px 0 rgba(0, 0, 0, .08);
}
.xl\:focus\:shadow-lg:focus {
box-shadow: 0 15px 30px 0 rgba(0, 0, 0, .11), 0 5px 15px 0 rgba(0, 0, 0, .08);
}
.xl\:focus\:shadow-inner:focus {
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06);
}
.xl\:focus\:shadow-outline:focus {
box-shadow: 2px solid rgba(52, 144, 220, .5);
}
.xl\:focus\:shadow-none:focus {
box-shadow: none;
}
.xl\:text-left {
text-align: left;
}