@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
1 lines • 3.8 kB
CSS
.dnb-breadcrumb{display:flex;flex-direction:column;margin:0;padding:0}.dnb-breadcrumb__bar{display:flex}.dnb-breadcrumb--variant-collapse .dnb-breadcrumb__bar{background-color:var(--token-color-background-neutral);color:var(--token-color-text-neutral)}@media screen and (max-width:40em){.dnb-breadcrumb--variant-responsive .dnb-breadcrumb__bar{background-color:var(--token-color-background-neutral);color:var(--token-color-text-neutral)}}.dnb-breadcrumb--variant-single .dnb-breadcrumb__bar .dnb-button{color:var(--token-color-text-neutral)}.dnb-breadcrumb--variant-single .dnb-breadcrumb__bar .dnb-button .dnb-button__icon{color:var(--token-color-icon-neutral)}.dnb-breadcrumb--variant-single .dnb-breadcrumb__bar .dnb-button .dnb-button__text{-webkit-text-decoration:none;text-decoration:none}.dnb-breadcrumb__list{align-items:center;color:var(--token-color-text-neutral);column-gap:.5rem;display:flex;flex-flow:row wrap;list-style:none;margin:0;padding:0;row-gap:1rem}.dnb-breadcrumb__item{align-items:center;display:flex;padding:.5rem 0}.dnb-breadcrumb__item__span{align-items:center;display:flex;line-height:var(--line-height-basis)}.dnb-breadcrumb__item__span__icon{margin-right:.5rem}.dnb-breadcrumb__item .dnb-anchor{line-height:1.5rem;padding:0;position:relative}.dnb-breadcrumb__item .dnb-anchor:after{border:.5rem solid transparent;bottom:0;content:"";left:0;position:absolute;right:0;top:0;transform:scale(1.25,2)}.dnb-breadcrumb__item:first-child .dnb-anchor{--anchor-icon-separator:"\2060";border-left:none}.dnb-breadcrumb__item:first-child .dnb-anchor:after{border:none;transform:none}.dnb-breadcrumb__item:first-child .dnb-anchor .dnb-icon svg{margin-right:.5rem}.dnb-breadcrumb__collapse{background-color:var(--token-color-background-page-background);display:flex;flex-direction:column}.dnb-breadcrumb__collapse:has(.dnb-height-animation--is-visible){border-bottom:.0625rem solid var(--token-color-stroke-neutral-subtle);border-top:.0625rem solid var(--token-color-stroke-neutral-subtle)}@media screen and (min-width:40.00625em){.dnb-breadcrumb--variant-responsive .dnb-breadcrumb__collapse{border:none}}.dnb-breadcrumb--variant-collapse .dnb-breadcrumb__collapse{width:100%}.dnb-breadcrumb--variant-collapse .dnb-accordion{align-items:flex-start;flex-direction:column;gap:0;width:100%}.dnb-breadcrumb--variant-collapse .dnb-accordion .dnb-accordion__tertiary-button{margin:1rem}.dnb-breadcrumb--variant-collapse .dnb-accordion .dnb-accordion__tertiary-content{width:100%}.dnb-breadcrumb__multiple{display:flex;flex-direction:column;transition:height .4s var(--easing-default)}@media (prefers-reduced-motion:reduce){.dnb-breadcrumb__multiple{transition-duration:.01ms}}.dnb-breadcrumb__multiple .dnb-breadcrumb__item{transform:translateX(-1rem);transition:transform .4s var(--easing-default) calc(var(--delay)*50ms)}@media (prefers-reduced-motion:reduce){.dnb-breadcrumb__multiple .dnb-breadcrumb__item{transition-duration:.01ms}}.dnb-breadcrumb__collapse .dnb-breadcrumb__item{padding:0}.dnb-breadcrumb__collapse .dnb-breadcrumb__item:not(:first-child){margin-left:1.5rem}.dnb-breadcrumb__collapse .dnb-breadcrumb__item:not(:first-child) .dnb-breadcrumb__item__span__icon{display:none}.dnb-breadcrumb__multiple.dnb-height-animation--parallax .dnb-breadcrumb__item{transform:translateX(0)}@media screen and (max-width:40em){.dnb-breadcrumb--variant-responsive .dnb-breadcrumb__bar .dnb-breadcrumb__multiple{display:none}}@media screen and (min-width:40.00625em){.dnb-breadcrumb--variant-responsive .dnb-breadcrumb__toggle{display:none}}@media screen and (max-width:40em){.dnb-breadcrumb--variant-responsive .dnb-breadcrumb__toggle{margin:1rem}}.dnb-breadcrumb__collapse .dnb-breadcrumb__list{align-items:flex-start;flex-direction:column;margin:0;padding:1rem 1rem 2rem;row-gap:1.5rem}