@dnb/eufemia/cjs/components/timeline/style/dnb-timeline.min.css

DNB Eufemia Design System UI Library

.dnb-timeline{--timeline-icon-height--small:1.5rem;--timeline-icon-width--small:1.5rem;--timeline-icon-border-radius--small:var(--token-radius-full);--timeline-icon-height--medium:2rem;--timeline-icon-width--medium:2rem;--timeline-icon-border-radius--medium:var(--token-radius-full);--timeline-icon-width-diff:calc((var(--timeline-icon-width--medium) - var(
            --timeline-icon-width--small
          ))/2);--timeline-border-spacing:1rem;--timeline-border-spacing--icon-adjusted:calc(var(--timeline-icon-width-diff) + var(--timeline-border-spacing));display:flex;flex-direction:column;list-style:none;padding:0}.dnb-timeline__item{margin-left:var(--timeline-icon-width-diff)}.dnb-timeline__item__label{align-items:center;display:flex;padding:0;text-align:left}.dnb-timeline__item__label__icon{--border-color:var(--token-color-stroke-neutral);--border-width:0.0625rem;align-items:center;background-color:var(--token-color-background-page-background);border-color:transparent;border-radius:var(--timeline-icon-border-radius--small);box-shadow:inset 0 0 0 var(--border-width) var(--border-color);color:var(--token-color-icon-neutral);display:flex;flex-shrink:0;height:auto;justify-content:center;line-height:var(--timeline-icon-height--small);padding:0;width:var(--timeline-icon-width--small)}.dnb-timeline__item__label__title{cursor:text;font-size:var(--font-size-small);line-height:var(--line-height-small);margin-left:var(--timeline-border-spacing--icon-adjusted)}.dnb-timeline__item__content{border-left:1px dashed var(--token-color-text-neutral-alternative);margin-left:calc(var(--timeline-icon-width--small)/2);padding-bottom:1rem;padding-left:calc(var(--timeline-icon-width--small)/2 + var(--timeline-border-spacing--icon-adjusted))}.dnb-timeline__item__content__subtitle{color:var(--token-color-text-neutral-alternative);cursor:text;font-size:var(--font-size-x-small);font-weight:var(--font-weight-basis)}.dnb-timeline__item__content__info{padding-top:.5rem}.dnb-timeline__item--completed .dnb-timeline__item__content{border-left:1px solid var(--token-color-stroke-neutral)}.dnb-timeline__item--completed .dnb-timeline__item__label__title{color:var(--token-color-text-neutral)}.dnb-timeline__item--current .dnb-timeline__item__content{margin-left:calc(var(--timeline-icon-width--medium)/2);padding-left:calc(var(--timeline-icon-width--medium)/2 + var(--timeline-border-spacing))}.dnb-timeline__item--current .dnb-timeline__item__label__title{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium);line-height:var(--line-height-basis);margin-left:var(--timeline-border-spacing)}.dnb-timeline__item--current .dnb-timeline__item__label__icon{border-radius:var(--timeline-icon-border-radius--medium);line-height:var(--timeline-icon-height--medium);width:var(--timeline-icon-width--medium)}.dnb-timeline__item--current{margin-left:0}.dnb-timeline__item--upcoming .dnb-timeline__item__label__title{color:var(--token-color-text-neutral-alternative);font-weight:var(--font-weight-basis)}.dnb-timeline__item--upcoming:not(.dnb-skeleton) .dnb-timeline__item__label__icon{--border-color:var(--token-color-background-neutral-subtle);--border-width:0.0625rem;background-color:var(--token-color-background-neutral-subtle);border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color);color:var(--token-color-text-neutral-alternative)}.dnb-timeline__item:last-child .dnb-timeline__item__content{border-left:none}.dnb-timeline__item:only-child{margin-left:0}