Sha256: ddc15ce2cb557222119f9302406d9415685a25912ff3eb59c9f6265923bce991
Contents?: true
Size: 1.71 KB
Versions: 4
Compression:
Stored size: 1.71 KB
Contents
.tabs { @include display(flex); margin: 1em 0; border-bottom: 1px solid $color-border; white-space: nowrap; &, ul { padding-left: 0; list-style: none; } a { padding: 1em; } @media print { display: none } } .tabs > li:not(.in-dropdown) { @include flex-grow(0); @include flex-shrink(0); // Move down one pixel to sit on top of the ul's border-bottom position: relative; top: 1px; > a { display: block; border: 1px solid $color-border; border-radius: 2px 2px 0 0; line-height: 1; } &:not(:first-child) > a { border-left: none; } &:not(.active) > a { background: $color-tbl-thead; } &.active > a, &.active:hover { background: white; border-bottom-color: white; color: $color-body-text; } &:not(.active):hover > a { background: darken($color-tbl-thead, 5%); color: $color-link; } } .tabs-overflowed.tabs > li:not(.tabs-dropdown) { @include flex-grow(1); @include flex-shrink(1); } .tabs-dropdown { @include flex-grow(0); @include flex-shrink(0); position: relative; .tabs:not(.tabs-overflowed) & { display: none; } > a { position: relative; background: white; z-index: 1; &:before { content: "\f107"; font-family: FontAwesome; -webkit-font-smoothing: antialiased; } } &:hover > a { background: white; } &:not(:hover) ul { display: none; } ul { @include position(absolute, calc(100% - 1px) 0 null null); z-index: 1; } } .tabs li.in-dropdown { a { display: block; border: 1px solid $color-border; background: white; } &:not(:first-child) a { border-top: none; } &:last-child a { border-radius: 0 0 3px 3px; } }
Version data entries
4 entries across 4 versions & 1 rubygems