@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
44 lines • 1.63 kB
CSS
.dnb-forms-section-block {
--block-outline-color: var(--color-black-8);
--block-outline-width: var(--card-outline-width);
}
.dnb-forms-section-block--error:has(.dnb-form-status--error):not(.dnb-forms-section-block--variant-basic) {
--block-outline-color: var(--color-fire-red);
--block-outline-width: 0.0625rem;
}
.dnb-forms-section-block:not(.dnb-height-animation--hidden) {
display: flex;
flex-direction: column;
}
.dnb-forms-section-block__inner {
flex: 1;
outline: none;
transition: transform 400ms var(--easing-default) 50ms, box-shadow 0.8s var(--easing-default);
transform: translateY(-2.5rem);
}
.dnb-forms-section-block__inner .dnb-dl .dnb-dd {
margin-bottom: 0;
}
.dnb-forms-section-block--variant-basic {
--border-color: transparent;
--block-outline-color: transparent;
}
.dnb-forms-section-block--variant-filled .dnb-forms-section-block__inner {
--space: var(--spacing-small);
}
.dnb-forms-section-block--no-animation .dnb-forms-section-block__inner {
transform: translateY(0);
}
.dnb-forms-section-block.dnb-height-animation--is-visible .dnb-forms-section-block__inner {
transform: translateY(-0.5rem);
}
.dnb-forms-section-block.dnb-height-animation--parallax .dnb-forms-section-block__inner {
transform: translateY(0);
}
.dnb-forms-section-block .dnb-card, .dnb-card .dnb-forms-section-block .dnb-card {
--card-outline-color: var(--block-outline-color);
--card-outline-width: var(--block-outline-width);
}
.dnb-forms-section-block .dnb-card--filled.dnb-section, .dnb-card .dnb-forms-section-block .dnb-card--filled.dnb-section {
--background-color: var(--color-lavender);
}