Current section

Files

Jump to
noora css line_divider.css
Raw

css/line_divider.css

.noora-line-divider {
--noora-content-divider-line: light-dark(
var(--noora-neutral-light-400),
var(--noora-neutral-dark-900)
);
--noora-content-divider-label: light-dark(
var(--noora-neutral-light-700),
var(--noora-neutral-dark-500)
);
z-index: 1;
width: 100%;
height: 1px;
background-color: var(--noora-content-divider-line);
&:has([data-part="text"]) {
display: flex;
flex-direction: row;
align-items: center;
height: auto;
background-color: transparent;
&::before,
&::after {
content: "";
flex: 1;
height: 1px;
background-color: var(--noora-content-divider-line);
}
}
& [data-part="text"] {
display: inline-flex;
flex-shrink: 0;
padding: var(--noora-spacing-0) var(--noora-spacing-2);
color: var(--noora-content-divider-label);
font: var(--noora-font-weight-regular) var(--noora-font-body-xsmall);
}
}