38 lines
648 B
SCSS
38 lines
648 B
SCSS
// Hidden
|
|
//
|
|
// Hide elements from all users. Compare to the visually-hidden component.
|
|
//
|
|
// Used for elements which should not be immediately displayed to any user. An
|
|
// example would be a collapsible fieldset that will be expanded with a click
|
|
// from a user.
|
|
//
|
|
// For anything you want to hide on page load when JavaScript is enabled, use
|
|
// the `.js-hidden` class.
|
|
//
|
|
// Markup: hidden.twig
|
|
//
|
|
// Style guide: components.hidden
|
|
|
|
.hidden,
|
|
%hidden {
|
|
display: none;
|
|
}
|
|
|
|
.js-hidden,
|
|
%js-hidden {
|
|
html.js & {
|
|
@extend %hidden;
|
|
}
|
|
}
|
|
|
|
//
|
|
// Drupal selectors.
|
|
//
|
|
|
|
.element-hidden {
|
|
@extend %js-hidden;
|
|
}
|
|
|
|
.js-hide {
|
|
@extend %js-hidden;
|
|
}
|