.UnderlineNav {
display: flex; overflow-x: auto; overflow-y: hidden; // stylelint-disable-next-line primer/box-shadow box-shadow: inset 0 -1px 0 var(--color-border-secondary); justify-content: space-between;
}
.UnderlineNav-body {
display: flex;
}
.UnderlineNav-item {
padding: $spacer-2 $spacer-3; font-size: $body-font-size; // stylelint-disable-next-line primer/typography line-height: 30px; color: var(--color-underlinenav-text); text-align: center; white-space: nowrap; background-color: transparent; border: 0; // stylelint-disable-next-line primer/borders border-bottom: 2px $border-style transparent; &:hover, &:focus { color: var(--color-underlinenav-text-hover); text-decoration: none; border-bottom-color: var(--color-border-tertiary); outline: 1px dotted transparent; // Support Firefox custom colors outline-offset: -1px; transition: border-bottom-color 0.12s ease-out; } &.selected, &[role=tab][aria-selected=true], &[aria-current]:not([aria-current=false]) { font-weight: $font-weight-bold; color: var(--color-underlinenav-text-active); border-bottom-color: var(--color-underlinenav-border-active); outline: 1px dotted transparent; // Support Firefox custom colors outline-offset: -1px; .UnderlineNav-octicon { color: var(--color-text-tertiary); } }
}
.UnderlineNav–right {
justify-content: flex-end; .UnderlineNav-actions { flex: 1 1 auto; }
}
.UnderlineNav-actions {
align-self: center;
}
.UnderlineNav–full {
display: block;
}
.UnderlineNav-octicon {
margin-right: $spacer-1; // stylelint-disable-next-line primer/colors color: var(--color-underlinenav-icon);
}
.UnderlineNav .Counter {
margin-left: $spacer-1; color: var(--color-underlinenav-counter-text); background-color: var(--color-underlinenav-counter-bg); &--primary { color: var(--color-counter-primary-text); background-color: var(--color-counter-primary-bg); }
}
.UnderlineNav-container {
display: flex; justify-content: space-between;
}