mirror of
https://github.com/locomotivemtl/locomotive-boilerplate.git
synced 2026-01-15 00:55:08 +08:00
45d8be5525
* Rename breakpoints by shortnames * Replace `tiny` breakpoint for `xs` in spacing loop * Add 2xs, 4xl and 5xl breakpoints
79 lines
1.3 KiB
SCSS
79 lines
1.3 KiB
SCSS
// ==========================================================================
|
|
// Utilities / States
|
|
// ==========================================================================
|
|
|
|
// ARIA roles display visual cursor hints
|
|
|
|
[aria-busy="true"] {
|
|
cursor: progress;
|
|
}
|
|
|
|
[aria-controls] {
|
|
cursor: pointer;
|
|
}
|
|
|
|
[aria-disabled] {
|
|
cursor: default;
|
|
}
|
|
|
|
// Control visibility without affecting flow.
|
|
|
|
.is-visible {
|
|
visibility: visible !important;
|
|
opacity: 1 !important;
|
|
}
|
|
|
|
.is-invisible {
|
|
visibility: hidden !important;
|
|
opacity: 0 !important;
|
|
}
|
|
|
|
// Completely remove from the flow and screen readers.
|
|
|
|
.is-hidden {
|
|
@include u-hidden;
|
|
}
|
|
|
|
@media not print {
|
|
.is-hidden\@screen {
|
|
@include u-hidden;
|
|
}
|
|
}
|
|
|
|
@media print {
|
|
.is-hidden\@print {
|
|
@include u-hidden;
|
|
}
|
|
}
|
|
|
|
// .is-hidden\@to-lg {
|
|
// @media (max-width: $to-lg) {
|
|
// display: none;
|
|
// }
|
|
// }
|
|
//
|
|
// .is-hidden\@from-lg {
|
|
// @media (min-width: $from-lg) {
|
|
// display: none;
|
|
// }
|
|
// }
|
|
|
|
// // Display a hidden-by-default element.
|
|
//
|
|
// .is-shown {
|
|
// @include u-shown;
|
|
// }
|
|
//
|
|
// table.is-shown {
|
|
// display: table !important;
|
|
// }
|
|
//
|
|
// tr.is-shown {
|
|
// display: table-row !important;
|
|
// }
|
|
//
|
|
// td.is-shown,
|
|
// th.is-shown {
|
|
// display: table-cell !important;
|
|
// }
|