101 lines
2.5 KiB
SCSS
101 lines
2.5 KiB
SCSS
//-- Mixin ---------------------------------------------------------------------
|
|
@mixin _tab_counter_without_centered() {
|
|
@include Option("userChrome.centered.tab") {
|
|
@include NotOption("userChrome.centered.tab.label") {
|
|
@content;
|
|
}
|
|
}
|
|
@include NotOption("userChrome.centered.tab") {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
// Copy from "../tab/sound_tab/show_with_favicons"
|
|
@mixin _hidden_tabIcon_soundTabLabel() {
|
|
@include NotOption("userChrome.hidden.tab_icon") {
|
|
@content;
|
|
}
|
|
@include Option("userChrome.hidden.tab_icon") {
|
|
@include NotOption("userChrome.hidden.tab_icon.always") {
|
|
@content;
|
|
}
|
|
}
|
|
}
|
|
|
|
//------------------------------------------------------------------------------
|
|
|
|
#tabbrowser-tabs {
|
|
counter-reset: tab-counts;
|
|
}
|
|
|
|
.tabbrowser-tab:not([hidden="true"]) {
|
|
counter-increment: tab-counts;
|
|
|
|
// https://www.designcise.com/web/tutorial/how-to-add-space-before-or-after-an-element-using-css-pseudo-elements
|
|
&[pinned="true"] .tab-label-container::before {
|
|
content: "\00a0" counter(tab-counts);
|
|
}
|
|
&:not([pinned="true"]) .tab-label-container::before {
|
|
content: counter(tab-counts) ":\00a0";
|
|
}
|
|
|
|
.tab-label-container {
|
|
display: grid;
|
|
|
|
align-content: safe center;
|
|
align-items: safe center;
|
|
|
|
@include _tab_counter_without_centered {
|
|
justify-content: start;
|
|
justify-items: start;
|
|
}
|
|
|
|
&::before {
|
|
display: inline-block;
|
|
grid-row: 1;
|
|
}
|
|
> .tab-text {
|
|
grid-row: 1;
|
|
}
|
|
|
|
&[pinned] {
|
|
width: unset !important; /* Original: 0 */
|
|
> .tab-text,
|
|
> .tab-secondary-label {
|
|
width: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Like centered label
|
|
.tab-label,
|
|
.tab-secondary-label {
|
|
overflow: hidden;
|
|
}
|
|
|
|
// Compatibility with sound tab
|
|
@include Option("userChrome.tab.sound_with_favicons") {
|
|
@include _hidden_tabIcon_soundTabLabel {
|
|
.tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
|
|
&[pinned] .tab-label-container {
|
|
&[labeldirection=ltr],
|
|
&:not([labeldirection]):-moz-locale-dir(ltr) {
|
|
--uc-sound-tab-label-position-x: 2px;
|
|
}
|
|
&[labeldirection=rtl],
|
|
&:not([labeldirection]):-moz-locale-dir(rtl) {
|
|
--uc-sound-tab-label-position-x: -2px;
|
|
}
|
|
}
|
|
.tab-label-container::before {
|
|
transform: translateX(var(--uc-sound-tab-label-position-x, 0px));
|
|
}
|
|
}
|
|
}
|
|
|
|
.tab-label-container::beforee {
|
|
transition: transform 0.25s var(--animation-easing-function);
|
|
}
|
|
}
|