details.css
Same filename in this branch
Same filename in other branches
- 9 core/profiles/demo_umami/themes/umami/css/classy/components/details.css
- 9 core/themes/olivero/css/components/details.css
- 9 core/themes/seven/css/components/details.css
- 9 core/themes/claro/css/components/details.css
- 9 core/themes/bartik/css/classy/components/details.css
- 9 core/themes/starterkit_theme/css/components/details.css
- 9 core/themes/classy/css/components/details.css
- 8.9.x core/profiles/demo_umami/themes/umami/css/classy/components/details.css
- 8.9.x core/themes/seven/css/components/details.css
- 8.9.x core/themes/claro/css/components/details.css
- 8.9.x core/themes/bartik/css/classy/components/details.css
- 8.9.x core/themes/classy/css/components/details.css
- 11.x core/profiles/demo_umami/themes/umami/css/classy/components/details.css
- 11.x core/misc/dialog/off-canvas/css/details.css
- 11.x core/themes/olivero/css/components/details.css
- 11.x core/themes/claro/css/components/details.css
- 11.x core/themes/starterkit_theme/css/components/details.css
Visual styling for summary and details in the off-canvas dialog.
@internal
File
-
core/
misc/ dialog/ off-canvas/ css/ details.css
View source
- /*
- * DO NOT EDIT THIS FILE.
- * See the following change record for more information,
- * https://www.drupal.org/node/3084859
- * @preserve
- */
-
- /**
- * @file
- * Visual styling for summary and details in the off-canvas dialog.
- *
- * @internal
- */
-
- #drupal-off-canvas-wrapper {
- --off-canvas-details-border-width: 0;
- --off-canvas-details-border-color: none;
- --off-canvas-details-background-color: #474747;
- --off-canvas-details-text-color: #ddd;
- --off-canvas-details-summary-border: none;
- --off-canvas-details-summary-padding: 0.625rem 1.25rem;
- --off-canvas-details-summary-font-size: 0.875rem;
- --off-canvas-details-summary-background-color: #333;
- --off-canvas-details-summary-background-color-hover: #222;
- --off-canvas-details-summary-text-color: #eee;
- --off-canvas-details-summary-text-color-hover: #fff;
- }
-
- #drupal-off-canvas-wrapper details {
- margin: var(--off-canvas-vertical-spacing-unit) calc(-1 * var(--off-canvas-padding)); /* Cancel out the padding of the parent. */
- padding: 0 var(--off-canvas-padding);
- color: var(--off-canvas-details-text-color);
- border: solid var(--off-canvas-details-border-color) var(--off-canvas-details-border-width);
- background: var(--off-canvas-details-background-color);
- }
-
- :is(#drupal-off-canvas-wrapper details) + details {
- margin-top: calc(-1 * var(--off-canvas-details-border-width));
- }
-
- #drupal-off-canvas-wrapper summary {
- margin: 0 calc(-1 * var(--off-canvas-padding));
- padding: var(--off-canvas-details-summary-padding);
- color: var(--off-canvas-details-summary-text-color);
- border: var(--off-canvas-details-summary-border);
- background-color: var(--off-canvas-details-summary-background-color);
- font-size: var(--off-canvas-details-summary-font-size);
- }
-
- #drupal-off-canvas-wrapper summary:hover {
- color: var(--off-canvas-details-summary-text-color-hover);
- background-color: var(--off-canvas-details-summary-background-color-hover);
- }
-
- #drupal-off-canvas-wrapper summary:focus {
- outline-offset: -4px; /* Ensure focus doesn't get cut off. */
- }
-
- #drupal-off-canvas-wrapper summary a {
- color: var(--off-canvas-details-text-color);
- }
-
- #drupal-off-canvas-wrapper summary a:hover {
- color: var(--off-canvas-details-summary-text-color-hover);
- }
-
- #drupal-off-canvas-wrapper .details-wrapper {
- padding: var(--off-canvas-vertical-spacing-unit) 0;
- }
Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.