Skip to content

Commit

Permalink
Merge pull request #964 from tailwindcss/sr-only-utilities
Browse files Browse the repository at this point in the history 
Add sr-only and not-sr-only utilities
  • Loading branch information
@adamwathan
adamwathan authored Jul 10, 2019
2 parents b87aedb + 9b94cc1 commit 79761b8
Show file tree
Hide file tree
Showing 5 changed files with 493 additions and 0 deletions.
230 changes: 230 additions & 0 deletions __tests__/fixtures/tailwind-output-important.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -610,6 +610,52 @@ video {
}
}

.sr-only {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.not-sr-only {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.focus\:sr-only:focus {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.focus\:not-sr-only:focus {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.appearance-none {
appearance: none !important;
}
Expand Down Expand Up @@ -7511,6 +7557,52 @@ video {
}

@media (min-width: 640px) {
.sm\:sr-only {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.sm\:not-sr-only {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.sm\:focus\:sr-only:focus {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.sm\:focus\:not-sr-only:focus {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.sm\:appearance-none {
appearance: none !important;
}
Expand Down Expand Up @@ -14413,6 +14505,52 @@ video {
}

@media (min-width: 768px) {
.md\:sr-only {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.md\:not-sr-only {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.md\:focus\:sr-only:focus {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.md\:focus\:not-sr-only:focus {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.md\:appearance-none {
appearance: none !important;
}
Expand Down Expand Up @@ -21315,6 +21453,52 @@ video {
}

@media (min-width: 1024px) {
.lg\:sr-only {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.lg\:not-sr-only {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.lg\:focus\:sr-only:focus {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.lg\:focus\:not-sr-only:focus {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.lg\:appearance-none {
appearance: none !important;
}
Expand Down Expand Up @@ -28217,6 +28401,52 @@ video {
}

@media (min-width: 1280px) {
.xl\:sr-only {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.xl\:not-sr-only {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.xl\:focus\:sr-only:focus {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border-width: 0 !important;
}

.xl\:focus\:not-sr-only:focus {
position: static !important;
width: auto !important;
height: auto !important;
padding: 0 !important;
margin: 0 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}

.xl\:appearance-none {
appearance: none !important;
}
Expand Down
Loading

0 comments on commit 79761b8

Please sign in to comment.