diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 01:13:33 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 01:13:33 +0000 |
commit | 086c044dc34dfc0f74fbe41f4ecb402b2cd34884 (patch) | |
tree | a4f824bd33cb075dd5aa3eb5a0a94af221bbe83a /browser/components/firefoxview/fxview-tab-row.css | |
parent | Adding debian version 124.0.1-1. (diff) | |
download | firefox-086c044dc34dfc0f74fbe41f4ecb402b2cd34884.tar.xz firefox-086c044dc34dfc0f74fbe41f4ecb402b2cd34884.zip |
Merging upstream version 125.0.1.
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'browser/components/firefoxview/fxview-tab-row.css')
-rw-r--r-- | browser/components/firefoxview/fxview-tab-row.css | 91 |
1 files changed, 65 insertions, 26 deletions
diff --git a/browser/components/firefoxview/fxview-tab-row.css b/browser/components/firefoxview/fxview-tab-row.css index ceb059a33b..219d7e8aa2 100644 --- a/browser/components/firefoxview/fxview-tab-row.css +++ b/browser/components/firefoxview/fxview-tab-row.css @@ -31,6 +31,12 @@ user-select: none; cursor: pointer; text-decoration: none; + + :host(.pinned) & { + padding: var(--space-small); + min-width: unset; + margin: 0; + } } .fxview-tab-row-main, @@ -44,6 +50,10 @@ .fxview-tab-row-button.ghost-button.icon-button:enabled:hover { background-color: var(--fxviewtabrow-element-background-hover); color: var(--fxviewtabrow-text-color-hover); + + & .fxview-tab-row-favicon-wrapper .fxview-tab-row-favicon::after { + stroke: var(--fxview-indicator-stroke-color-hover); + } } .fxview-tab-row-main:hover:active, @@ -52,15 +62,16 @@ } @media (prefers-contrast) { - .fxview-tab-row-main, - .fxview-tab-row-main:hover, - .fxview-tab-row-main:active { + a.fxview-tab-row-main, + a.fxview-tab-row-main:hover, + a.fxview-tab-row-main:active { background-color: transparent; border: 1px solid LinkText; color: LinkText; } - .fxview-tab-row-main:visited .fxview-tab-row-main:visited:hover { + a.fxview-tab-row-main:visited, + a.fxview-tab-row-main:visited:hover { border: 1px solid VisitedText; color: VisitedText; } @@ -68,14 +79,17 @@ .fxview-tab-row-favicon-wrapper { height: 16px; + position: relative; - .fxview-tab-row-favicon::after { + .fxview-tab-row-favicon::after, + .fxview-tab-row-button::after, + &.pinned .fxview-tab-row-pinned-media-button { display: block; content: ""; background-size: 12px; background-position: center; background-repeat: no-repeat; - position: absolute; + position: relative; height: 12px; width: 12px; -moz-context-properties: fill, stroke; @@ -83,36 +97,47 @@ stroke: var(--fxview-background-color-secondary); } - &.bookmark .fxview-tab-row-favicon::after { - background-image: url("chrome://browser/skin/bookmark-12.svg"); + &:is(.pinnedOnNewTab, .bookmark):not(.attention) .fxview-tab-row-favicon::after { inset-block-start: 9px; inset-inline-end: -6px; + } + + &.pinnedOnNewTab .fxview-tab-row-favicon::after, + &.pinnedOnNewTab .fxview-tab-row-button::after { + background-image: url("chrome://browser/skin/pin-12.svg"); + } + + &.bookmark .fxview-tab-row-favicon::after, + &.bookmark .fxview-tab-row-button::after { + background-image: url("chrome://browser/skin/bookmark-12.svg"); fill: var(--fxview-primary-action-background); } - &.notification .fxview-tab-row-favicon::after { + &.attention .fxview-tab-row-favicon::after, + &.attention .fxview-tab-row-button::after { background-image: radial-gradient(circle, light-dark(rgb(42, 195, 162), rgb(84, 255, 189)), light-dark(rgb(42, 195, 162), rgb(84, 255, 189)) 2px, transparent 2px); height: 4px; width: 100%; inset-block-start: 20px; } - &.soundplaying .fxview-tab-row-favicon::after { - background-image: url("chrome://global/skin/media/audio.svg"); - inset-block-start: -5px; - inset-inline-end: -7px; + &.pinned .fxview-tab-row-pinned-media-button { + inset-block-start: -10px; + inset-inline-end: -10px; border-radius: 100%; background-color: var(--fxview-background-color-secondary); - padding: 2px; - } + padding: 6px; + min-width: 0; + min-height: 0; + position: absolute; - &.muted .fxview-tab-row-favicon::after { - background-image: url("chrome://global/skin/media/audio-muted.svg"); - inset-block-start: -5px; - inset-inline-end: -7px; - border-radius: 100%; - background-color: var(--fxview-background-color-secondary); - padding: 2px; + &[muted="true"] { + background-image: url("chrome://global/skin/media/audio-muted.svg"); + } + + &[soundplaying="true"] { + background-image: url("chrome://global/skin/media/audio.svg"); + } } } @@ -179,26 +204,40 @@ &[soundplaying="true"] { background-image: url("chrome://global/skin/media/audio.svg"); } + + &.dismiss-button { + background-image: url("chrome://global/skin/icons/close.svg"); + } + + &.options-button { + background-image: url("chrome://global/skin/icons/more.svg"); + } } @media (prefers-contrast) { - .fxview-tab-row-button { + .fxview-tab-row-button, + button.fxview-tab-row-main { border: 1px solid ButtonText; color: ButtonText; } - .fxview-tab-row-button.ghost-button.icon-button:enabled:hover { + .fxview-tab-row-button.ghost-button.icon-button:enabled:hover, + button.fxview-tab-row-main:enabled:hover { border: 1px solid SelectedItem; color: SelectedItem; } - .fxview-tab-row-button.ghost-button.icon-button:enabled:active { + .fxview-tab-row-button.ghost-button.icon-button:enabled:active, + button.fxview-tab-row-main:enabled:active { color: SelectedItem; } .fxview-tab-row-button.ghost-button.icon-button:enabled, .fxview-tab-row-button.ghost-button.icon-button:enabled:hover, - .fxview-tab-row-button.ghost-button.icon-button:enabled:active { + .fxview-tab-row-button.ghost-button.icon-button:enabled:active + button.fxview-tab-row-main:enabled, + button.fxview-tab-row-main:enabled:hover, + button.fxview-tab-row-main:enabled:active { background-color: ButtonFace; } } |