fix tab audio icons/text

This commit is contained in:
bmFtZQ 2021-12-01 06:19:56 +08:00
parent 26df277f1b
commit 3fc5a50bb4
5 changed files with 52 additions and 2 deletions

View file

@ -429,3 +429,16 @@
.popup-notification-icon[popupid="addon-install-origin-blocked"] { .popup-notification-icon[popupid="addon-install-origin-blocked"] {
list-style-image: url(extension-blocked.svg) !important; list-style-image: url(extension-blocked.svg) !important;
} }
/* tab sound icons */
.tab-icon-overlay[soundplaying] {
list-style-image: url("tab-audio-playing-small.svg") !important;
}
.tab-icon-overlay[muted] {
list-style-image: url("tab-audio-muted-small.svg") !important;
}
.tab-icon-overlay[activemedia-blocked] {
list-style-image: url("tab-audio-blocked-small.svg") !important;
}

View file

@ -0,0 +1,4 @@
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" fill="context-fill" fill-opacity="context-fill-opacity">
<path fill="context-stroke" d="M11.73 1.181 5.259 2.482l-.068.023A1.807 1.807 0 0 0 3.996 4.2v4.79c-1.645 0-3 1.354-3 3 0 1.644 1.355 3 3 3s3-1.356 3-3V8.17l4-.762v.582c-1.645 0-3 1.355-3 3s1.355 3 3 3 3-1.355 3-3V2.916c0-1.214-1.263-2.104-2.406-1.695z"/>
<path d="M12 6.2v3.058a2 2 0 1 0 1 1.732V2.916a.8.8 0 0 0-1.069-.753l-6.4 1.285a.8.8 0 0 0-.53.753v6.056a2 2 0 1 0 1 1.732V7.343zm0-1.062L6 6.28V4.342L12 3.2zM11 9.99a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm-7 1a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
</svg>

After

Width:  |  Height:  |  Size: 620 B

View file

@ -0,0 +1,4 @@
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" fill="context-fill" fill-opacity="context-fill-opacity">
<path fill="context-stroke" d="M8.5 1c-.397 0-.78.158-1.061.44L4.878 4H3.499a2.511 2.511 0 0 0-2.5 2.5v3c0 1.372 1.128 2.5 2.5 2.5h1.379l2.561 2.561a1.537 1.537 0 0 0 1.635.325c.51-.212.925-.76.926-1.385v-2.6a1.516 1.516 0 0 0 1.582-.34l.44-.44.439.44a1.516 1.516 0 0 0 2.12 0 1.515 1.515 0 0 0 0-2.121L14.143 8l.44-.44a1.515 1.515 0 0 0 0-2.12 1.516 1.516 0 0 0-2.121 0l-.44.44-.44-.44a1.51 1.51 0 0 0-1.06-.44c-.176 0-.353.034-.522.096V2.498A1.506 1.506 0 0 0 8.5 1z"/>
<path d="M8.5 2a.5.5 0 0 0-.353.146L5.291 5.002H3.5C2.677 5 2 5.678 2 6.5v3c0 .822.678 1.5 1.5 1.5h1.793l2.854 2.854A.5.5 0 0 0 9 13.5v-11a.5.5 0 0 0-.5-.5zM8 3.707v8.586l-2.146-2.146A.5.5 0 0 0 5.501 10h-2a.493.493 0 0 1-.5-.5v-3c0-.282.217-.5.5-.5h2a.5.5 0 0 0 .353-.146zM10.521 6a.5.5 0 0 0-.354.853L11.315 8l-1.146 1.146a.5.5 0 0 0 .707.707l1.146-1.146 1.146 1.146a.5.5 0 0 0 .707-.707L12.728 8l1.146-1.146a.5.5 0 0 0-.707-.707L12.02 7.292l-1.146-1.146A.498.498 0 0 0 10.52 6z"/>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -0,0 +1,4 @@
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" fill="context-fill" fill-opacity="context-fill-opacity">
<path fill="context-stroke" d="M8.5 1c-.397 0-.78.158-1.061.44L4.878 4H3.499a2.511 2.511 0 0 0-2.5 2.5v3c0 1.372 1.128 2.5 2.5 2.5h1.379l2.561 2.561a1.537 1.537 0 0 0 1.635.325c.51-.212.925-.76.926-1.385v-1.695c.085.032.147.112.236.129-.22.504-.261 1.075.107 1.52l.003.003c.52.627 1.48.718 2.109.199v-.002S15 11.552 15 8c0-3.551-2.545-5.654-2.545-5.654l-.002-.004a1.501 1.501 0 0 0-1.092-.334h-.003c-.394.037-.758.229-1.012.533l-.003.004c-.367.444-.329 1.012-.112 1.516-.09.017-.147.098-.232.13V2.5a1.506 1.506 0 0 0-1.5-1.498z"/>
<path d="M8.5 2a.5.5 0 0 0-.353.146L5.291 5.002H3.5C2.677 5 2 5.678 2 6.5v3c0 .822.678 1.5 1.5 1.5h1.793l2.854 2.854A.5.5 0 0 0 9 13.5v-11a.5.5 0 0 0-.309-.46A.5.5 0 0 0 8.5 2zm2.953 1.004a.5.5 0 0 0-.338.178.5.5 0 0 0 .067.703S13 5.39 13 8c0 2.61-1.818 4.115-1.818 4.115a.5.5 0 0 0-.067.703.5.5 0 0 0 .703.066S14 11.078 14 8c0-3.079-2.182-4.885-2.182-4.885a.5.5 0 0 0-.365-.111zM8 3.707v8.586l-2.146-2.146a.5.5 0 0 0-.353-.146h-2a.493.493 0 0 1-.5-.5v-3c0-.282.217-.5.5-.5h2a.5.5 0 0 0 .353-.147zm2.441 1.297a.5.5 0 0 0-.334.186.5.5 0 0 0 .082.703s.81.592.81 2.107-.81 2.107-.81 2.107a.5.5 0 0 0-.082.703.5.5 0 0 0 .703.082S12 9.904 12 7.999s-1.19-2.893-1.19-2.893a.5.5 0 0 0-.369-.104z"/>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View file

@ -105,7 +105,8 @@
fill: var(--lwt-text-color) !important; fill: var(--lwt-text-color) !important;
} }
.tabbrowser-tab[multiselected]:not(:-moz-lwtheme), .tabbrowser-tab[visuallyselected="true"]:not(:-moz-lwtheme) { .tabbrowser-tab[multiselected]:not(:-moz-lwtheme),
.tabbrowser-tab[visuallyselected="true"]:not(:-moz-lwtheme) {
color: var(--lwt-tab-text, var(--toolbar-color)) !important; color: var(--lwt-tab-text, var(--toolbar-color)) !important;
} }
@ -117,10 +118,34 @@
border-radius: 2px !important; border-radius: 2px !important;
} }
.tab-throbber:not([pinned]), .tab-icon-pending:not([pinned]), .tab-icon-image:not([pinned]), .tab-sharing-icon-overlay:not([pinned]), .tab-icon-overlay:not([pinned]) { .tab-throbber:not([pinned]),
.tab-icon-pending:not([pinned]),
.tab-icon-image:not([pinned]),
.tab-sharing-icon-overlay:not([pinned]) {
margin-inline-end: 10px !important; margin-inline-end: 10px !important;
} }
/* tab volume icon/text */
.tab-secondary-label {
display: none !important;
}
.tab-icon-stack:is([soundplaying], [muted], [activemedia-blocked]) > .tab-icon-overlay,
.tabbrowser-tab:hover .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) > :not(.tab-icon-overlay) {
opacity: 1 !important;
}
.tab-icon-overlay:not([pinned]) {
margin-inline: 22px 6px !important;
}
.tab-icon-overlay[soundplaying]:not([crashed]),
.tab-icon-overlay[muted]:not([crashed]),
.tab-icon-overlay[activemedia-blocked]:not([crashed]) {
border-radius: 2px !important;
padding: 0 !important;
}
.tabbrowser-tab { .tabbrowser-tab {
font-size: 12px !important; font-size: 12px !important;
padding-inline: 0 !important; padding-inline: 0 !important;