@scania/tegel/dist/collection/components/header/header.css

Tegel Design System

/*
  Contains spacing variables for the layout
*/
:host,
:root {
  --tds-scrollbar-width-standard: thin;
  --tds-scrollbar-width: 10px;
  --tds-scrollbar-height: 10px;
  --tds-scrollbar-thumb-border-width: 3px;
  --tds-scrollbar-thumb-border-hover-width: 2px;
}

body {
  scrollbar-width: thin;
}

html,
:root {
  --tds-nav-dropdown-menu-box: 0 3px 3px rgb(0 0 0 / 15%), 0 -1px 1px rgb(0 0 0 / 1%);
  --tds-nav-dropdown-item-border-radius: 0 0 4px 4px;
  --tds-font-family-headline: "Scania Sans Headline", arial, helvetica, sans-serif;
}

tds-header {
  display: block;
  height: var(--tds-header-height);
  background-color: var(--tds-header-background);
  width: 100%;
  z-index: 300;
}
tds-header tds-header-dropdown-list-item a *,
tds-header tds-header-dropdown-list-item button * {
  pointer-events: none;
}

nav {
  box-sizing: border-box;
  background-color: var(--tds-header-background);
  width: 100%;
  display: block;
}
nav * {
  box-sizing: border-box;
}
nav .tds-header-component-list {
  height: var(--tds-header-height);
  all: unset;
  display: flex;
  justify-content: center;
  align-items: center;
}
nav tds-header-dropdown,
nav tds-header-item {
  display: none;
}
nav .tds-header-middle-spacer {
  all: unset;
  display: block;
  flex-grow: 1;
  height: var(--tds-header-height);
  border-right: 1px solid var(--tds-header--basic-element-border);
}
@media screen and (min-width: 992px) {
  nav tds-header-dropdown,
  nav tds-header-item {
    display: block;
  }
}
nav tds-header-item:nth-child(3),
nav tds-header-dropdown:nth-child(3) {
  /* Adds a left border to the button after the title, if any */
  border-left: 1px solid var(--tds-header--basic-element-border);
}