drupal/core/modules/navigation/css/components/toolbar-block.css

66 lines
1.9 KiB
CSS

/*
* DO NOT EDIT THIS FILE.
* See the following change record for more information,
* https://www.drupal.org/node/3084859
* @preserve
*/
/* cspell:ignore wght */
/**
* @file
* Toolbar block styles.
*/
.toolbar-block {
display: grid;
gap: var(--admin-toolbar-space-4);
}
.admin-toolbar__content .toolbar-block:nth-last-child(n + 2)::after {
margin-top: var(--admin-toolbar-space-8);
content: "";
border-top: 1px solid var(--admin-toolbar-color-gray-200);
}
.toolbar-block__list {
display: grid;
margin: 0;
padding: 0;
list-style-type: none;
word-wrap: break-word;
-webkit-hyphens: auto;
hyphens: auto;
gap: var(--admin-toolbar-space-4);
}
.toolbar-block__list-item {
display: grid;
}
.toolbar-block__title {
position: relative;
margin: 0;
padding: var(--admin-toolbar-space-12) var(--admin-toolbar-space-8);
letter-spacing: var(--admin-toolbar-letter-spacing-0-8);
text-transform: uppercase;
color: var(--admin-toolbar-color-gray-600);
font-family: inherit;
font-size: var(--admin-toolbar-font-size-label-xs);
line-height: var(--admin-toolbar-line-height-label-xs);
font-variation-settings: "wght" 500;
}
html:not([data-admin-toolbar="expanded"]) .toolbar-block__title,
html[data-admin-toolbar-animating][data-admin-toolbar="expanded"] .toolbar-block__title {
display: flex;
align-items: center;
justify-content: center;
padding: 0;
color: var(--admin-toolbar-color-gray-600);
font-size: 0;
block-size: calc(2.5 * var(--admin-toolbar-rem));
inline-size: calc(2.5 * var(--admin-toolbar-rem));
}
:is(html:not([data-admin-toolbar="expanded"]) .toolbar-block__title, html[data-admin-toolbar-animating][data-admin-toolbar="expanded"] .toolbar-block__title)::before {
position: absolute;
display: block;
width: var(--admin-toolbar-space-4);
height: var(--admin-toolbar-space-4);
content: "";
border-radius: 50%;
background-color: currentColor;
}