mirror of
https://github.com/black7375/Firefox-UI-Fix.git
synced 2025-12-06 02:30:54 -08:00
Add: Tab - Sound icon with text #463
This commit is contained in:
parent
4cd0a0149e
commit
5af723fa70
3 changed files with 55 additions and 12 deletions
42
css/leptonChrome.css
generated
42
css/leptonChrome.css
generated
|
|
@ -8080,10 +8080,18 @@
|
||||||
}
|
}
|
||||||
/* Makes the speaker icon to always appear if the tab is playing (not only on hover) */
|
/* Makes the speaker icon to always appear if the tab is playing (not only on hover) */
|
||||||
.tabbrowser-tab {
|
.tabbrowser-tab {
|
||||||
--uc-sound-tab-icon-position-x: -0.5px;
|
--uc-sound-tab-icon-position-x-default: -0.5px;
|
||||||
|
--uc-sound-tab-icon-position-x: var(--uc-sound-tab-icon-position-x-default);
|
||||||
|
--uc-sound-tab-icon-position-y: -6px;
|
||||||
}
|
}
|
||||||
.tabbrowser-tab:-moz-locale-dir(rtl) {
|
.tabbrowser-tab:-moz-locale-dir(rtl) {
|
||||||
--uc-sound-tab-icon-position-x: 0.5px;
|
--uc-sound-tab-icon-position-x: calc(-1 * var(--uc-sound-tab-icon-position-x-default));
|
||||||
|
}
|
||||||
|
@supports -moz-bool-pref("userChrome.tab.sound_with_favicons.with_text") {
|
||||||
|
.tabbrowser-tab:not([pinned]) {
|
||||||
|
--uc-sound-tab-icon-position-x-default: 7px;
|
||||||
|
--uc-sound-tab-icon-position-y: -1px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.tab-icon-overlay:not([crashed]),
|
.tab-icon-overlay:not([crashed]),
|
||||||
.tab-icon-overlay[pinned][crashed][selected] {
|
.tab-icon-overlay[pinned][crashed][selected] {
|
||||||
|
|
@ -8091,7 +8099,7 @@
|
||||||
top: 0 !important;
|
top: 0 !important;
|
||||||
inset-inline-end: -9px !important;
|
inset-inline-end: -9px !important;
|
||||||
z-index: 1 !important;
|
z-index: 1 !important;
|
||||||
transform: translateX(var(--uc-sound-tab-icon-position-x)) translateY(-6px);
|
transform: translateX(var(--uc-sound-tab-icon-position-x)) translateY(var(--uc-sound-tab-icon-position-y));
|
||||||
/* Shape */
|
/* Shape */
|
||||||
padding: 1.5px !important;
|
padding: 1.5px !important;
|
||||||
border-radius: 10px !important;
|
border-radius: 10px !important;
|
||||||
|
|
@ -8108,17 +8116,27 @@
|
||||||
}
|
}
|
||||||
/* Label */
|
/* Label */
|
||||||
@supports not -moz-bool-pref("userChrome.hidden.tab_icon") {
|
@supports not -moz-bool-pref("userChrome.hidden.tab_icon") {
|
||||||
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
|
.tab-label-container {
|
||||||
|
--uc-sound-tab-label-position-x-default: 4px;
|
||||||
|
}
|
||||||
|
@supports -moz-bool-pref("userChrome.tab.sound_with_favicons.with_text") {
|
||||||
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
|
.tab-label-container {
|
||||||
|
--uc-sound-tab-label-position-x-default: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container[labeldirection="ltr"],
|
.tab-label-container[labeldirection="ltr"],
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container:not([labeldirection]):-moz-locale-dir(ltr) {
|
.tab-label-container:not([labeldirection]):-moz-locale-dir(ltr) {
|
||||||
--uc-sound-tab-label-position-x: 4px;
|
--uc-sound-tab-label-position-x: var(--uc-sound-tab-label-position-x-default);
|
||||||
}
|
}
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container[labeldirection="rtl"],
|
.tab-label-container[labeldirection="rtl"],
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container:not([labeldirection]):-moz-locale-dir(rtl) {
|
.tab-label-container:not([labeldirection]):-moz-locale-dir(rtl) {
|
||||||
--uc-sound-tab-label-position-x: -4px;
|
--uc-sound-tab-label-position-x: calc(-1 * var(--uc-sound-tab-label-position-x-default));
|
||||||
}
|
}
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container
|
.tab-label-container
|
||||||
|
|
@ -8128,17 +8146,27 @@
|
||||||
}
|
}
|
||||||
@supports -moz-bool-pref("userChrome.hidden.tab_icon") {
|
@supports -moz-bool-pref("userChrome.hidden.tab_icon") {
|
||||||
@supports not -moz-bool-pref("userChrome.hidden.tab_icon.always") {
|
@supports not -moz-bool-pref("userChrome.hidden.tab_icon.always") {
|
||||||
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
|
.tab-label-container {
|
||||||
|
--uc-sound-tab-label-position-x-default: 4px;
|
||||||
|
}
|
||||||
|
@supports -moz-bool-pref("userChrome.tab.sound_with_favicons.with_text") {
|
||||||
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
|
.tab-label-container {
|
||||||
|
--uc-sound-tab-label-position-x-default: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container[labeldirection="ltr"],
|
.tab-label-container[labeldirection="ltr"],
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container:not([labeldirection]):-moz-locale-dir(ltr) {
|
.tab-label-container:not([labeldirection]):-moz-locale-dir(ltr) {
|
||||||
--uc-sound-tab-label-position-x: 4px;
|
--uc-sound-tab-label-position-x: var(--uc-sound-tab-label-position-x-default);
|
||||||
}
|
}
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container[labeldirection="rtl"],
|
.tab-label-container[labeldirection="rtl"],
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container:not([labeldirection]):-moz-locale-dir(rtl) {
|
.tab-label-container:not([labeldirection]):-moz-locale-dir(rtl) {
|
||||||
--uc-sound-tab-label-position-x: -4px;
|
--uc-sound-tab-label-position-x: calc(-1 * var(--uc-sound-tab-label-position-x-default));
|
||||||
}
|
}
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])
|
||||||
.tab-label-container
|
.tab-label-container
|
||||||
|
|
|
||||||
|
|
@ -32,9 +32,18 @@
|
||||||
|
|
||||||
/* Makes the speaker icon to always appear if the tab is playing (not only on hover) */
|
/* Makes the speaker icon to always appear if the tab is playing (not only on hover) */
|
||||||
.tabbrowser-tab {
|
.tabbrowser-tab {
|
||||||
--uc-sound-tab-icon-position-x: -0.5px;
|
--uc-sound-tab-icon-position-x-default: -0.5px;
|
||||||
|
--uc-sound-tab-icon-position-x: var(--uc-sound-tab-icon-position-x-default);
|
||||||
|
--uc-sound-tab-icon-position-y: -6px;
|
||||||
&:-moz-locale-dir(rtl) {
|
&:-moz-locale-dir(rtl) {
|
||||||
--uc-sound-tab-icon-position-x: 0.5px;
|
--uc-sound-tab-icon-position-x: calc(-1 * var(--uc-sound-tab-icon-position-x-default));
|
||||||
|
}
|
||||||
|
|
||||||
|
@include Option("userChrome.tab.sound_with_favicons.with_text") {
|
||||||
|
&:not([pinned]) {
|
||||||
|
--uc-sound-tab-icon-position-x-default: 7px;
|
||||||
|
--uc-sound-tab-icon-position-y: -1px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.tab-icon-overlay:not([crashed]),
|
.tab-icon-overlay:not([crashed]),
|
||||||
|
|
@ -43,7 +52,7 @@
|
||||||
top: 0 !important;
|
top: 0 !important;
|
||||||
inset-inline-end: -9px !important;
|
inset-inline-end: -9px !important;
|
||||||
z-index: 1 !important;
|
z-index: 1 !important;
|
||||||
transform: translateX(var(--uc-sound-tab-icon-position-x)) translateY(-6px);
|
transform: translateX(var(--uc-sound-tab-icon-position-x)) translateY(var(--uc-sound-tab-icon-position-y));
|
||||||
|
|
||||||
/* Shape */
|
/* Shape */
|
||||||
padding: 1.5px !important;
|
padding: 1.5px !important;
|
||||||
|
|
@ -64,13 +73,18 @@
|
||||||
@include _hidden_tabIcon_soundTabLabel {
|
@include _hidden_tabIcon_soundTabLabel {
|
||||||
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
|
.tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
|
||||||
.tab-label-container {
|
.tab-label-container {
|
||||||
|
--uc-sound-tab-label-position-x-default: 4px;
|
||||||
|
@include Option("userChrome.tab.sound_with_favicons.with_text") {
|
||||||
|
--uc-sound-tab-label-position-x-default: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
&[labeldirection=ltr],
|
&[labeldirection=ltr],
|
||||||
&:not([labeldirection]):-moz-locale-dir(ltr) {
|
&:not([labeldirection]):-moz-locale-dir(ltr) {
|
||||||
--uc-sound-tab-label-position-x: 4px;
|
--uc-sound-tab-label-position-x: var(--uc-sound-tab-label-position-x-default);
|
||||||
}
|
}
|
||||||
&[labeldirection=rtl],
|
&[labeldirection=rtl],
|
||||||
&:not([labeldirection]):-moz-locale-dir(rtl) {
|
&:not([labeldirection]):-moz-locale-dir(rtl) {
|
||||||
--uc-sound-tab-label-position-x: -4px;
|
--uc-sound-tab-label-position-x: calc(-1 * var(--uc-sound-tab-label-position-x-default));
|
||||||
}
|
}
|
||||||
|
|
||||||
> * {
|
> * {
|
||||||
|
|
|
||||||
1
user.js
1
user.js
|
|
@ -184,6 +184,7 @@ user_pref("userChrome.rounding.square_tab", false);
|
||||||
// user_pref("userChrome.tab.close_button_at_hover.with_selected", true); // Need close_button_at_hover
|
// user_pref("userChrome.tab.close_button_at_hover.with_selected", true); // Need close_button_at_hover
|
||||||
// user_pref("userChrome.tab.sound_show_label", true); // Need remove sound_hide_label
|
// user_pref("userChrome.tab.sound_show_label", true); // Need remove sound_hide_label
|
||||||
// user_pref("userChrome.tab.container.on_top", true);
|
// user_pref("userChrome.tab.container.on_top", true);
|
||||||
|
// user_pref("userChrome.tab.sound_with_favicons.with_text", true);
|
||||||
// user_pref("userChrome.tab.selected_bold", true);
|
// user_pref("userChrome.tab.selected_bold", true);
|
||||||
|
|
||||||
// user_pref("userChrome.navbar.as_sidebar", true);
|
// user_pref("userChrome.navbar.as_sidebar", true);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue