From 9900def526ab287c4ce4f6ab39ec97a375c50cb3 Mon Sep 17 00:00:00 2001 From: wolfbeast Date: Sun, 9 Sep 2018 08:23:21 +0200 Subject: Revert "Add tabbrowser findbar styling for Linux and OSX" This reverts commit e4b01ba84463fbaf5209ae8d2bb6a612f491bb5b. --- application/palemoon/themes/osx/browser.css | 6 ------ 1 file changed, 6 deletions(-) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index 97073b161..a915af3a3 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1601,12 +1601,6 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- -moz-padding-start: 0px; } -.browserContainer > findbar { - background-color: -moz-dialog; - color: -moz-DialogText; - text-shadow: none; -} - /* ::::: throbber ::::: */ #navigator-throbber { -- cgit v1.2.3 From becd71a8600c7229f765d8eda21c1843c4f4adf1 Mon Sep 17 00:00:00 2001 From: FranklinDM Date: Fri, 16 Nov 2018 20:59:11 +0800 Subject: Issue #638 - Part 1: Provide a visual indicator for muting/unmuting tabs --- application/palemoon/themes/osx/browser.css | 73 +++++++++++++++++++++++++++++ 1 file changed, 73 insertions(+) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index a915af3a3..d9b7d1271 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1821,6 +1821,79 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- } } +/* Tab sound indicator */ +.tab-icon-sound { + -moz-margin-start: 4px; + width: 16px; + height: 16px; + padding: 0; +} + +.tab-icon-sound:not(:-moz-any([soundplaying],[muted])), +.tab-icon-sound[pinned] { + display: none; +} + +.tab-icon-sound[soundplaying] { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); +} + +.tab-icon-sound[soundplaying]:hover { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover"); +} + +.tab-icon-sound[soundplaying]:hover:active { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed"); +} + +.tab-icon-sound[muted], +.tab-icon-sound[blocked] { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted"); +} + +.tab-icon-sound[muted]:hover, +.tab-icon-sound[blocked]:hover { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover"); +} + +.tab-icon-sound[muted]:hover:active, +.tab-icon-sound[blocked]:hover:active { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-pressed"); +} + +#TabsToolbar[brighttext] .tab-icon-sound[soundplaying] { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-dark"); +} + +#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-dark-hover"); +} + +#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-dark-pressed"); +} + +#TabsToolbar[brighttext] .tab-icon-sound[blocked], +#TabsToolbar[brighttext] .tab-icon-sound[muted] { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-dark"); +} + +#TabsToolbar[brighttext] .tab-icon-sound[blocked]:hover, +#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-dark-hover"); +} + +#TabsToolbar[brighttext] .tab-icon-sound[blocked]:hover:active, +#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-dark-pressed"); +} + +.tab-icon-sound[soundplaying-scheduledremoval]:not([muted]):not(:hover), +.tab-icon-overlay[soundplaying-scheduledremoval]:not([muted]):not(:hover) { + transition: opacity .3s linear var(--soundplaying-removal-delay); + opacity: 0; +} + /* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */ .tabbrowser-arrowscrollbox > .scrollbutton-up, -- cgit v1.2.3 From 719234847ecbab2fe8b4b4c2f153fa0c12bffbc6 Mon Sep 17 00:00:00 2001 From: FranklinDM Date: Fri, 16 Nov 2018 22:40:59 +0800 Subject: Issue #638 - Part 4: Add tab sound icon to tab drop-down list --- application/palemoon/themes/osx/browser.css | 3 +++ 1 file changed, 3 insertions(+) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index d9b7d1271..754740562 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1834,6 +1834,7 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- display: none; } +.alltabs-endimage[soundplaying], .tab-icon-sound[soundplaying] { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); } @@ -1846,6 +1847,8 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed"); } +.alltabs-endimage[muted], +.alltabs-endimage[blocked], .tab-icon-sound[muted], .tab-icon-sound[blocked] { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted"); -- cgit v1.2.3 From 66cc7d91a44fd6789b80cd61ee7b84c63d402122 Mon Sep 17 00:00:00 2001 From: FranklinDM Date: Sat, 17 Nov 2018 10:25:16 +0800 Subject: Issue #638 - Part 7: Remove hover and active states for sound indicator --- application/palemoon/themes/osx/browser.css | 50 ++++------------------------- 1 file changed, 7 insertions(+), 43 deletions(-) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index 754740562..e402a3f0d 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1829,7 +1829,7 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- padding: 0; } -.tab-icon-sound:not(:-moz-any([soundplaying],[muted])), +.tab-icon-sound:not(:-moz-any([soundplaying],[muted],[blocked])), .tab-icon-sound[pinned] { display: none; } @@ -1839,56 +1839,20 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); } -.tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover"); -} - -.tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed"); -} - .alltabs-endimage[muted], -.alltabs-endimage[blocked], -.tab-icon-sound[muted], -.tab-icon-sound[blocked] { +.tab-icon-sound[muted] { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted"); } -.tab-icon-sound[muted]:hover, -.tab-icon-sound[blocked]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover"); -} - -.tab-icon-sound[muted]:hover:active, -.tab-icon-sound[blocked]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-pressed"); -} - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-dark"); -} - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-dark-hover"); -} - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-dark-pressed"); +.alltabs-endimage[blocked], +.tab-icon-sound[blocked] { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-blocked"); } +#TabsToolbar[brighttext] .tab-icon-sound[soundplaying], #TabsToolbar[brighttext] .tab-icon-sound[blocked], #TabsToolbar[brighttext] .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-dark"); -} - -#TabsToolbar[brighttext] .tab-icon-sound[blocked]:hover, -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-dark-hover"); -} - -#TabsToolbar[brighttext] .tab-icon-sound[blocked]:hover:active, -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-dark-pressed"); + filter: invert(1); } .tab-icon-sound[soundplaying-scheduledremoval]:not([muted]):not(:hover), -- cgit v1.2.3 From a6b250b47730cc4751cfc5ca9e96a4b74e4d6572 Mon Sep 17 00:00:00 2001 From: FranklinDM Date: Sat, 17 Nov 2018 10:55:10 +0800 Subject: Issue #638 - Part 8: Add overlay sound icon for pinned tabs - This also moves some styles to tabbrowser.css --- application/palemoon/themes/osx/browser.css | 54 ++++++++++++++++++++++++++--- 1 file changed, 49 insertions(+), 5 deletions(-) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index e402a3f0d..b2e935b0b 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1829,11 +1829,6 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- padding: 0; } -.tab-icon-sound:not(:-moz-any([soundplaying],[muted],[blocked])), -.tab-icon-sound[pinned] { - display: none; -} - .alltabs-endimage[soundplaying], .tab-icon-sound[soundplaying] { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); @@ -1861,6 +1856,55 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- opacity: 0; } +/* Tab icon overlay */ +.tab-icon-overlay { + width: 16px; + height: 16px; + margin-top: -8px; + margin-inline-start: -15px; + margin-inline-end: -1px; + position: relative; +} + +.tab-icon-overlay[soundplaying], +.tab-icon-overlay[muted]:not([crashed]), +.tab-icon-overlay[blocked]:not([crashed]) { + border-radius: 10px; +} + +.tab-icon-overlay[soundplaying]:hover, +.tab-icon-overlay[muted]:not([crashed]):hover, +.tab-icon-overlay[blocked]:not([crashed]):hover { + background-color: white; +} + +.tab-icon-overlay[soundplaying] { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio"); +} + +.tab-icon-overlay[muted] { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-muted"); +} + +.tab-icon-overlay[blocked] { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-blocked"); +} + +#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]:not([selected]):not(:hover), +.tab-icon-overlay[soundplaying][selected]:-moz-lwtheme-brighttext:not(:hover) { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white"); +} + +#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not([selected]):not(:hover), +.tab-icon-overlay[muted][selected]:-moz-lwtheme-brighttext:not(:hover) { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted"); +} + +#TabsToolbar[brighttext] .tab-icon-overlay[blocked]:not([crashed]):not([selected]):not(:hover), +.tab-icon-overlay[blocked][selected]:-moz-lwtheme-brighttext:not(:hover) { + list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-blocked"); +} + /* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */ .tabbrowser-arrowscrollbox > .scrollbutton-up, -- cgit v1.2.3 From deb4791e21e9cda73083f0c61c44a51270f433e2 Mon Sep 17 00:00:00 2001 From: FranklinDM Date: Sat, 17 Nov 2018 12:11:34 +0800 Subject: Issue #638 - Part 10: Rename all tabs sound icon to be consistent with others - alltabs => allTabs --- application/palemoon/themes/osx/browser.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index b2e935b0b..a7bd683bd 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1829,17 +1829,17 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- padding: 0; } -.alltabs-endimage[soundplaying], +.allTabs-endimage[soundplaying], .tab-icon-sound[soundplaying] { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); } -.alltabs-endimage[muted], +.allTabs-endimage[muted], .tab-icon-sound[muted] { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted"); } -.alltabs-endimage[blocked], +.allTabs-endimage[blocked], .tab-icon-sound[blocked] { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-blocked"); } -- cgit v1.2.3 From 46958a2aa33cd40d48b665d4f6a3e8734e1585e3 Mon Sep 17 00:00:00 2001 From: FranklinDM Date: Sat, 26 Jan 2019 11:47:53 +0800 Subject: Only use white audio indicator when using a lightweight theme --- application/palemoon/themes/osx/browser.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index a7bd683bd..c73c6108b 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1844,9 +1844,9 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-blocked"); } -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying], -#TabsToolbar[brighttext] .tab-icon-sound[blocked], -#TabsToolbar[brighttext] .tab-icon-sound[muted] { +#TabsToolbar:-moz-lwtheme-brighttext .tab-icon-sound[soundplaying], +#TabsToolbar:-moz-lwtheme-brighttext .tab-icon-sound[blocked], +#TabsToolbar:-moz-lwtheme-brighttext .tab-icon-sound[muted] { filter: invert(1); } -- cgit v1.2.3 From b39e0b131c7ab714bdeddc655298489a96e51ae2 Mon Sep 17 00:00:00 2001 From: FranklinDM Date: Sun, 27 Jan 2019 17:02:57 +0800 Subject: Only use white audio indicator when using a lightweight theme [pinned tabs] --- application/palemoon/themes/osx/browser.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index c73c6108b..ddf050785 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1890,17 +1890,17 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-blocked"); } -#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]:not([selected]):not(:hover), +#TabsToolbar:-moz-lwtheme-brighttext .tab-icon-overlay[soundplaying]:not([selected]):not(:hover), .tab-icon-overlay[soundplaying][selected]:-moz-lwtheme-brighttext:not(:hover) { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white"); } -#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not([selected]):not(:hover), +#TabsToolbar:-moz-lwtheme-brighttext .tab-icon-overlay[muted]:not([crashed]):not([selected]):not(:hover), .tab-icon-overlay[muted][selected]:-moz-lwtheme-brighttext:not(:hover) { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted"); } -#TabsToolbar[brighttext] .tab-icon-overlay[blocked]:not([crashed]):not([selected]):not(:hover), +#TabsToolbar:-moz-lwtheme-brighttext .tab-icon-overlay[blocked]:not([crashed]):not([selected]):not(:hover), .tab-icon-overlay[blocked][selected]:-moz-lwtheme-brighttext:not(:hover) { list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-blocked"); } -- cgit v1.2.3 From ca141778245946e9378704dbcf05355c6cb108f3 Mon Sep 17 00:00:00 2001 From: Lootyhoof Date: Fri, 15 Mar 2019 22:53:09 +0000 Subject: Draw a border when hiding the tab bar --- application/palemoon/themes/osx/browser.css | 11 +++++++++++ 1 file changed, 11 insertions(+) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index ddf050785..20e8c5eac 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1630,6 +1630,17 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- background-image: linear-gradient(to top, @toolbarShadowColor@ 1px, rgba(0,0,0,.05) 1px, transparent 50%); } +/* When the tab bar is collapsed, show a 1px border in its place. */ +#TabsToolbar[collapsed="true"] { + visibility: visible; + height: 1px; + border-bottom-width: 1px; + /* !important here to override border-style: none on the toolbar */ + border-bottom-style: solid !important; + border-bottom-color: ThreeDShadow; + overflow: hidden; +} + @media (-moz-mac-lion-theme) { #main-window[sizemode=normal] #TabsToolbar { padding-left: 2px; -- cgit v1.2.3 From 520f996015e9ca1d0a6b8618541885e22f52ceaf Mon Sep 17 00:00:00 2001 From: Lootyhoof Date: Mon, 1 Apr 2019 21:29:49 +0100 Subject: Only draw a border on the tab bar when on bottom --- application/palemoon/themes/osx/browser.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'application/palemoon/themes/osx/browser.css') diff --git a/application/palemoon/themes/osx/browser.css b/application/palemoon/themes/osx/browser.css index 20e8c5eac..6d0d92015 100644 --- a/application/palemoon/themes/osx/browser.css +++ b/application/palemoon/themes/osx/browser.css @@ -1631,7 +1631,7 @@ richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url- } /* When the tab bar is collapsed, show a 1px border in its place. */ -#TabsToolbar[collapsed="true"] { +#TabsToolbar[tabsontop="false"][collapsed="true"] { visibility: visible; height: 1px; border-bottom-width: 1px; -- cgit v1.2.3