Commit 4778190d authored by Mark Otto's avatar Mark Otto Committed by Mark Otto
Browse files

Drop the .hidden and .visible classes, save for the print ones

— Moves print display utils to display utils file
— Removes all other .hidden- utils
— Expands on .invisible and it's mixin to provide options for visibility: visible and visibility: hidden
parent ebe405a0
Showing with 42 additions and 51 deletions
+42 -51
// Visibility // Visibility
@mixin invisible { @mixin invisible($visibility) {
visibility: hidden !important; visibility: $visibility !important;
} }
// //
// Display utilities // Utilities for common `display` values
// //
@each $breakpoint in map-keys($grid-breakpoints) { @each $breakpoint in map-keys($grid-breakpoints) {
...@@ -16,3 +16,38 @@ ...@@ -16,3 +16,38 @@
.d#{$infix}-inline-flex { display: inline-flex !important; } .d#{$infix}-inline-flex { display: inline-flex !important; }
} }
} }
//
// Utilities for toggling `display` in print
//
.d-print-block {
display: none !important;
@media print {
display: block !important;
}
}
.d-print-inline {
display: none !important;
@media print {
display: inline !important;
}
}
.d-print-inline-block {
display: none !important;
@media print {
display: inline-block !important;
}
}
.d-print-none {
@media print {
display: none !important;
}
}
...@@ -2,54 +2,10 @@ ...@@ -2,54 +2,10 @@
// Visibility utilities // Visibility utilities
// //
.invisible { .visible {
@include invisible(); @include invisible(visible);
}
// Responsive visibility utilities
@each $bp in map-keys($grid-breakpoints) {
.hidden-#{$bp}-up {
@include media-breakpoint-up($bp) {
display: none !important;
}
}
.hidden-#{$bp}-down {
@include media-breakpoint-down($bp) {
display: none !important;
}
}
} }
.invisible {
// Print utilities @include invisible(hidden);
//
// Media queries are placed on the inside to be mixin-friendly.
.visible-print-block {
display: none !important;
@media print {
display: block !important;
}
}
.visible-print-inline {
display: none !important;
@media print {
display: inline !important;
}
}
.visible-print-inline-block {
display: none !important;
@media print {
display: inline-block !important;
}
}
.hidden-print {
@media print {
display: none !important;
}
} }
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment