diff options
Diffstat (limited to 'arc-firefox-theme')
9 files changed, 721 insertions, 262 deletions
diff --git a/arc-firefox-theme/chrome/browser/browser.css b/arc-firefox-theme/chrome/browser/browser.css index c95f45b..c21611b 100644 --- a/arc-firefox-theme/chrome/browser/browser.css +++ b/arc-firefox-theme/chrome/browser/browser.css @@ -600,9 +600,9 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba transform: scaleX(-1); } #forward-button { + padding: 0; margin-left: 2px; - margin-right: 2px; - padding: 0; } + margin-right: 2px; } /* tabview menu item */ #menu_tabview { @@ -1436,7 +1436,7 @@ toolbar[brighttext] #loop-button { padding-inline-start: 2px; } #notification-popup-box:not([hidden]) + #identity-box { - padding-inline-start: 10px; + padding-inline-start: 5px; border-radius: 0; } window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box { @@ -2262,6 +2262,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- /* Tabstrip */ :root { --tab-toolbar-navbar-overlap: 1px; + --navbar-tab-toolbar-highlight-overlap: 1px; --tab-min-height: 31px; } #TabsToolbar { @@ -2331,9 +2332,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- .tab-icon-overlay { width: 16px; height: 16px; - margin-top: 10px; + margin-top: -12px; -moz-margin-start: -16px; - display: none; } + position: relative; } .tab-icon-overlay[crashed] { list-style-image: url("chrome://browser/skin/tabbrowser/crashed.svg"); } @@ -2347,16 +2348,16 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-color: white; } .tab-icon-overlay[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio"); } .tab-icon-overlay[muted]:not([crashed]) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio-muted"); } -#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]:not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white"); } +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[soundplaying] { + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio"); } -#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted"); } +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[muted]:not([crashed]) { + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio-muted"); } .tab-throbber[busy] { list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png"); } @@ -2380,58 +2381,40 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- padding: 0; } .tab-icon-sound[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab"); } .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-hover"); } .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-pressed"); } .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-muted"); } .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); } .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); } .tab-icon-sound[visuallyselected=true][soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-hover"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-pressed"); } .tab-icon-sound[visuallyselected=true][muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-muted"); } .tab-icon-sound[visuallyselected=true][muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-muted-hover"); } .tab-icon-sound[visuallyselected=true][muted]: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-white"); } - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-hover"); } - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-pressed"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-hover"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-muted-pressed"); } .tab-background, .tabs-newtab-button { @@ -2449,7 +2432,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-image: url(chrome://browser/skin/custom_images/light/tabs/tab-overflow-indicator.png); background-size: 100% 100%; width: 14px; - margin-bottom: var(--tab-toolbar-navbar-overlap); + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); pointer-events: none; position: relative; z-index: 3; @@ -2598,6 +2581,8 @@ lwtHeader;*/ background-repeat: no-repeat; background-size: 85% 100%; } +/* Tab separators */ +/* Also show separators beside the selected tab when dragging it. */ /* New tab button */ .tabs-newtab-button { width: calc(36px + 30px); } @@ -2699,7 +2684,7 @@ lwtHeader;*/ transition: none; } #TabsToolbar .toolbarbutton-1 { - margin-bottom: var(--tab-toolbar-navbar-overlap); } + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); } #alltabs-button { list-style-image: url("chrome://browser/skin/custom_images/light/tabs/alltabs.svg"); } diff --git a/arc-firefox-theme/chrome/browser/custom_images/dark/tabs/tab-audio-small.svg b/arc-firefox-theme/chrome/browser/custom_images/dark/tabs/tab-audio-small.svg new file mode 100644 index 0000000..c5bff69 --- /dev/null +++ b/arc-firefox-theme/chrome/browser/custom_images/dark/tabs/tab-audio-small.svg @@ -0,0 +1,99 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- This Source Code Form is subject to the terms of the Mozilla Public + - License, v. 2.0. If a copy of the MPL was not distributed with this + - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + width="16" + height="16" + viewBox="0 0 16 16" + id="svg2" + version="1.1" + inkscape:version="0.91 r13725" + sodipodi:docname="tab-audio-small.svg"> + <metadata + id="metadata30"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + <dc:title /> + </cc:Work> + </rdf:RDF> + </metadata> + <defs + id="defs28" /> + <sodipodi:namedview + pagecolor="#b1b1b1" + bordercolor="#666666" + borderopacity="1" + objecttolerance="10" + gridtolerance="10" + guidetolerance="10" + inkscape:pageopacity="0" + inkscape:pageshadow="2" + inkscape:window-width="640" + inkscape:window-height="480" + id="namedview26" + showgrid="false" + inkscape:zoom="12.46875" + inkscape:cx="-0.22891557" + inkscape:cy="5.5804938" + inkscape:current-layer="svg2" /> + <style + id="style4"> + .icon:not(:target) { + display: none; + } + + .icon { + fill: #262626; + } + .icon > .outline { + fill: #fff; + } + + .icon.white { + fill: #fff; + } + .icon.white > .outline { + fill: #000; + fill-opacity: .5; + } + </style> + <g + id="tab-audio" + class="icon"> + <path + class="outline" + d="M12.4,3.6l-1-0.6l-0.9,2.5H10V1.8c0-0.4-0.5-0.7-0.9-0.4L5.6,5H4C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.6l3.6,3.6 c0.3,0.3,0.9,0.1,0.9-0.4v-3.7h0.5l0.9,2.5l1-0.6C14,11.5,15,9.8,15,8S14,4.5,12.4,3.6z M9,13l-3-3H4c-0.6,0-1-0.4-1-1V7 c0-0.6,0.4-1,1-1h2l3-3V13z M10,9.5v-3c0.8,0,1.5,0.7,1.5,1.5S10.8,9.5,10,9.5z M11.9,11.5l-0.4-0.9C12.4,10,13,9.1,13,8 s-0.6-2-1.4-2.5l0.3-1C13.2,5.2,14,6.5,14,8S13.2,10.8,11.9,11.5z" + id="path7" + style="fill:#2f343f;fill-opacity:1" /> + <path + d="M4,6C3.4,6,3,6.4,3,7v2c0,0.6,0.4,1,1,1h2l3,3V3L6,6H4z M10,6.5v3c0.8,0,1.5-0.7,1.5-1.5S10.8,6.5,10,6.5z M11.9,4.5 l-0.4,0.9C12.4,6,13,6.9,13,8s-0.6,2-1.4,2.5l0.4,0.9c1.2-0.7,2.1-2,2.1-3.5S13.2,5.2,11.9,4.5z" + id="path9" + style="fill:#d3dae3;fill-opacity:1" /> + </g> + <g + id="tab-audio-muted" + class="icon"> + <path + class="outline" + d="M5.6,5H4C2.9,5,2,5.9,2,7v2c0,0.7,0.3,1.3,0.9,1.7l-1.8,1.8l2.5,2.5l3-3l2.6,2.6c0.3,0.3,0.9,0.1,0.9-0.4V8.5l3.9-3.9 l-2.5-2.5L10,3.5V1.8c0-0.4-0.5-0.7-0.9-0.4L5.6,5z" + id="path12" + style="fill:#2f343f;fill-opacity:1" /> + <path + d="M11.5,3.5L9,5.9V3L6,6H4C3.4,6,3,6.4,3,7v2c0,0.6,0.4,1,1,1h0.9l-2.5,2.5l1.1,1.1l9-9L11.5,3.5z M9,13V9.7l-1.7,1.7L9,13z" + id="path14" + style="fill:#d3dae3;fill-opacity:1" /> + </g> +</svg> diff --git a/arc-firefox-theme/chrome/browser/custom_images/dark/tabs/tab-audio.svg b/arc-firefox-theme/chrome/browser/custom_images/dark/tabs/tab-audio.svg new file mode 100644 index 0000000..c2ff76e --- /dev/null +++ b/arc-firefox-theme/chrome/browser/custom_images/dark/tabs/tab-audio.svg @@ -0,0 +1,150 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- This Source Code Form is subject to the terms of the Mozilla Public + - License, v. 2.0. If a copy of the MPL was not distributed with this + - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + width="16" + height="16" + viewBox="0 0 16 16" + id="svg2" + version="1.1" + inkscape:version="0.91 r13725" + sodipodi:docname="tab-audio.svg"> + <metadata + id="metadata52"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + </cc:Work> + </rdf:RDF> + </metadata> + <defs + id="defs50" /> + <sodipodi:namedview + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1" + objecttolerance="10" + gridtolerance="10" + guidetolerance="10" + inkscape:pageopacity="0" + inkscape:pageshadow="2" + inkscape:window-width="640" + inkscape:window-height="480" + id="namedview48" + showgrid="false" + inkscape:zoom="12.46875" + inkscape:cx="-11.788201" + inkscape:cy="0.63847986" + inkscape:current-layer="svg2" /> + <style + id="style4"> + .icon:not(:target) { + display: none; + } + + .icon { + fill: #333; + opacity: .75; + } + .icon.hover { + fill: #1a1a1a; + opacity: .85; + } + .icon.pressed { + fill: #0d0d0d; + opacity: .95; + } + + .icon.white { + fill: #fff; + } + .icon.white.hover { + opacity: .9; + } + .icon.white.pressed { + opacity: 1; + } + .icon.white > .outline { + fill: #000; + fill-opacity: .5; + } + + .icon.backgroundTab, + .icon.backgroundTab.hover, + .icon.backgroundTab.pressed { + fill: -moz-MenuBarText; + } + </style> + <path + id="tab-audio" + class="icon" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-hover" + class="icon hover" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-pressed" + class="icon pressed" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-muted" + class="icon" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-muted-hover" + class="icon hover" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-muted-pressed" + class="icon pressed" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab" + class="icon backgroundTab" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-hover" + class="icon backgroundTab hover" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-pressed" + class="icon backgroundTab pressed" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-muted" + class="icon backgroundTab" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-muted-hover" + class="icon backgroundTab hover" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#d3dae3;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-muted-pressed" + class="icon backgroundTab pressed" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#d3dae3;fill-opacity:1" /> +</svg> diff --git a/arc-firefox-theme/chrome/browser/custom_images/light/tabs/tab-audio-small.svg b/arc-firefox-theme/chrome/browser/custom_images/light/tabs/tab-audio-small.svg new file mode 100644 index 0000000..8326f46 --- /dev/null +++ b/arc-firefox-theme/chrome/browser/custom_images/light/tabs/tab-audio-small.svg @@ -0,0 +1,97 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- This Source Code Form is subject to the terms of the Mozilla Public + - License, v. 2.0. If a copy of the MPL was not distributed with this + - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + width="16" + height="16" + viewBox="0 0 16 16" + id="svg2" + version="1.1" + inkscape:version="0.91 r13725" + sodipodi:docname="tab-audio-small.svg"> + <metadata + id="metadata30"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + <dc:title /> + </cc:Work> + </rdf:RDF> + </metadata> + <defs + id="defs28" /> + <sodipodi:namedview + pagecolor="#a1a1a1" + bordercolor="#666666" + borderopacity="1" + objecttolerance="10" + gridtolerance="10" + guidetolerance="10" + inkscape:pageopacity="0" + inkscape:pageshadow="2" + inkscape:window-width="640" + inkscape:window-height="480" + id="namedview26" + showgrid="false" + inkscape:zoom="12.46875" + inkscape:cx="-7.2063593" + inkscape:cy="5.5804938" + inkscape:current-layer="svg2" /> + <style + id="style4"> + .icon:not(:target) { + display: none; + } + + .icon { + fill: #262626; + } + .icon > .outline { + fill: #fff; + } + + .icon.white { + fill: #fff; + } + .icon.white > .outline { + fill: #000; + fill-opacity: .5; + } + </style> + <g + id="tab-audio" + class="icon"> + <path + class="outline" + d="M12.4,3.6l-1-0.6l-0.9,2.5H10V1.8c0-0.4-0.5-0.7-0.9-0.4L5.6,5H4C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.6l3.6,3.6 c0.3,0.3,0.9,0.1,0.9-0.4v-3.7h0.5l0.9,2.5l1-0.6C14,11.5,15,9.8,15,8S14,4.5,12.4,3.6z M9,13l-3-3H4c-0.6,0-1-0.4-1-1V7 c0-0.6,0.4-1,1-1h2l3-3V13z M10,9.5v-3c0.8,0,1.5,0.7,1.5,1.5S10.8,9.5,10,9.5z M11.9,11.5l-0.4-0.9C12.4,10,13,9.1,13,8 s-0.6-2-1.4-2.5l0.3-1C13.2,5.2,14,6.5,14,8S13.2,10.8,11.9,11.5z" + id="path7" /> + <path + d="M4,6C3.4,6,3,6.4,3,7v2c0,0.6,0.4,1,1,1h2l3,3V3L6,6H4z M10,6.5v3c0.8,0,1.5-0.7,1.5-1.5S10.8,6.5,10,6.5z M11.9,4.5 l-0.4,0.9C12.4,6,13,6.9,13,8s-0.6,2-1.4,2.5l0.4,0.9c1.2-0.7,2.1-2,2.1-3.5S13.2,5.2,11.9,4.5z" + id="path9" + style="fill:#5c616c;fill-opacity:1" /> + </g> + <g + id="tab-audio-muted" + class="icon"> + <path + class="outline" + d="M5.6,5H4C2.9,5,2,5.9,2,7v2c0,0.7,0.3,1.3,0.9,1.7l-1.8,1.8l2.5,2.5l3-3l2.6,2.6c0.3,0.3,0.9,0.1,0.9-0.4V8.5l3.9-3.9 l-2.5-2.5L10,3.5V1.8c0-0.4-0.5-0.7-0.9-0.4L5.6,5z" + id="path12" /> + <path + d="M11.5,3.5L9,5.9V3L6,6H4C3.4,6,3,6.4,3,7v2c0,0.6,0.4,1,1,1h0.9l-2.5,2.5l1.1,1.1l9-9L11.5,3.5z M9,13V9.7l-1.7,1.7L9,13z" + id="path14" + style="fill:#5c616c;fill-opacity:1" /> + </g> +</svg> diff --git a/arc-firefox-theme/chrome/browser/custom_images/light/tabs/tab-audio.svg b/arc-firefox-theme/chrome/browser/custom_images/light/tabs/tab-audio.svg new file mode 100644 index 0000000..24231c6 --- /dev/null +++ b/arc-firefox-theme/chrome/browser/custom_images/light/tabs/tab-audio.svg @@ -0,0 +1,150 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- This Source Code Form is subject to the terms of the Mozilla Public + - License, v. 2.0. If a copy of the MPL was not distributed with this + - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + width="16" + height="16" + viewBox="0 0 16 16" + id="svg2" + version="1.1" + inkscape:version="0.91 r13725" + sodipodi:docname="tab-audio.svg"> + <metadata + id="metadata52"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + </cc:Work> + </rdf:RDF> + </metadata> + <defs + id="defs50" /> + <sodipodi:namedview + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1" + objecttolerance="10" + gridtolerance="10" + guidetolerance="10" + inkscape:pageopacity="0" + inkscape:pageshadow="2" + inkscape:window-width="640" + inkscape:window-height="480" + id="namedview48" + showgrid="false" + inkscape:zoom="12.46875" + inkscape:cx="1.0438795" + inkscape:cy="0.63847986" + inkscape:current-layer="svg2" /> + <style + id="style4"> + .icon:not(:target) { + display: none; + } + + .icon { + fill: #333; + opacity: .75; + } + .icon.hover { + fill: #1a1a1a; + opacity: .85; + } + .icon.pressed { + fill: #0d0d0d; + opacity: .95; + } + + .icon.white { + fill: #fff; + } + .icon.white.hover { + opacity: .9; + } + .icon.white.pressed { + opacity: 1; + } + .icon.white > .outline { + fill: #000; + fill-opacity: .5; + } + + .icon.backgroundTab, + .icon.backgroundTab.hover, + .icon.backgroundTab.pressed { + fill: -moz-MenuBarText; + } + </style> + <path + id="tab-audio" + class="icon" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-hover" + class="icon hover" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-pressed" + class="icon pressed" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-muted" + class="icon" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-muted-hover" + class="icon hover" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-muted-pressed" + class="icon pressed" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab" + class="icon backgroundTab" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-hover" + class="icon backgroundTab hover" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-pressed" + class="icon backgroundTab pressed" + d="M4,5C2.9,5,2,5.9,2,7v2c0,1.1,0.9,2,2,2h1.2L9,14V2L5.2,5H4z M11,8c0-0.6-0.4-1-1-1v2C10.6,9,11,8.6,11,8z M13,8 c0-1.4-1-2.6-2.3-2.9L10.4,6C11.3,6.2,12,7,12,8s-0.7,1.8-1.6,2l0.4,0.9C12,10.6,13,9.4,13,8z M11.4,3.2l-0.4,0.9 C12.8,4.6,14,6.2,14,8s-1.2,3.4-2.9,3.8l0.4,0.9C13.5,12.2,15,10.3,15,8S13.5,3.8,11.4,3.2z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-muted" + class="icon backgroundTab" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-muted-hover" + class="icon backgroundTab hover" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#5c616c;fill-opacity:1" /> + <path + id="tab-audio-backgroundTab-muted-pressed" + class="icon backgroundTab pressed" + d="M12.5,3.4L9,6.3V2L5.2,5H4C2.9,5,2,5.9,2,7v2c0,0.9,0.6,1.6,1.4,1.9l-1.9,1.5l1,1.2l11-9L12.5,3.4z M9,14v-4l-2.5,2L9,14z" + style="fill:#5c616c;fill-opacity:1" /> +</svg> diff --git a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss index f69d2b8..1c00ea8 100644 --- a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss +++ b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss @@ -648,6 +648,7 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba border-image: url("chrome://browser/skin/custom_images/navbar-separator.png") 0 0 0 2 / 0 0 0 2px; } + .findbar-button:not(:-moz-any([checked="true"],[disabled="true"])):hover > .toolbarbutton-text, :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1[open]:not([disabled=true]) > .toolbarbutton-menubutton-button > .toolbarbutton-icon, :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not([disabled=true]):not([open]):hover > .toolbarbutton-menubutton-button > .toolbarbutton-icon, @@ -661,6 +662,12 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba box-shadow: var(--toolbarbutton-hover-boxshadow); } +//:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon, +//:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1[open] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { +// margin-top: 4px; +// margin-bottom: 4px; +//} + #TabsToolbar .toolbarbutton-1[open]:not([disabled=true]) > .toolbarbutton-menubutton-button > .toolbarbutton-icon, #TabsToolbar .toolbarbutton-1:not([disabled=true]):not([open]):hover > .toolbarbutton-menubutton-button > .toolbarbutton-icon, #TabsToolbar .toolbarbutton-1:not([disabled=true]):not([open]):hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon, @@ -671,12 +678,6 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba background-clip: padding-box; } -//:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon, -//:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1[open] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { -// margin-top: 4px; -// margin-bottom: 4px; -//} - .findbar-button:not([disabled=true]):-moz-any([checked="true"],:hover:active) > .toolbarbutton-text, :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not([open="true"]) > .toolbarbutton-menubutton-button:not([disabled=true]):-moz-any(:hover:active, [open="true"]) > .toolbarbutton-icon, :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1[open="true"] > .toolbarbutton-menubutton-dropmarker:not([disabled=true]) > .dropmarker-icon, @@ -749,30 +750,41 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba } //#back-button > .toolbarbutton-icon { -// border-radius: 2px; +// border-radius: 10000px; // background-clip: padding-box; -// padding: 3px 7px; +// padding: 6px; // border: none; -// box-shadow: none; -// background: none !important; +// box-shadow: 0 1px 0 hsla(0,0%,100%,.3) inset, +// 0 0 0 1px hsla(0,0%,100%,.3) inset, +// 0 0 0 1px hsla(210,54%,20%,.25), +// 0 1px 0 hsla(210,54%,20%,.35); +// background-image: linear-gradient(hsla(0,0%,100%,.6), hsla(0,0%,100%,.1)); // transition-property: background-color, box-shadow; // transition-duration: 250ms; //} //#back-button:not([disabled="true"]):not([open="true"]):not(:active):hover > .toolbarbutton-icon { -// background-color: transparent; -// box-shadow: none; +// background-color: hsla(210,48%,96%,.75); +// box-shadow: 0 1px 0 hsla(0,0%,100%,.3) inset, +// 0 0 0 1px hsla(0,0%,100%,.3) inset, +// 0 0 0 1px hsla(210,54%,20%,.3), +// 0 1px 0 hsla(210,54%,20%,.4), +// 0 0 4px hsla(210,54%,20%,.2); //} //#back-button:not([disabled="true"]):hover:active > .toolbarbutton-icon, //#back-button[open="true"] > .toolbarbutton-icon { -// background-color: red; -// box-shadow: none; +// background-color: hsla(210,54%,20%,.15); +// box-shadow: 0 1px 1px hsla(210,54%,20%,.1) inset, +// 0 0 1px hsla(210,54%,20%,.2) inset, +// 0 0 0 1px hsla(210,54%,20%,.4), +// 0 1px 0 hsla(210,54%,20%,.2); // transition: none; //} //#main-window:not([customizing]) #back-button[disabled] > .toolbarbutton-icon { -// box-shadow: none !important; +// box-shadow: 0 0 0 1px hsla(210,54%,20%,.55), +// 0 1px 0 hsla(210,54%,20%,.65) !important; // transition: none; //} @@ -781,26 +793,27 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba } #forward-button { +// -moz-box-align: stretch; /* let the button shape grow vertically with the location bar */ + padding: 0; margin-left: 2px; margin-right: 2px; - //-moz-box-align: stretch; - padding: 0; } -#forward-button > .toolbarbutton-icon { +//#forward-button > .toolbarbutton-icon { // background-clip: padding-box; -// padding: 3px 7px; -// border: 1px solid transparent; +// padding-left: 9px; +// padding-right: 3px; +// border: 1px solid #9a9a9a; // border-left-style: none; // border-radius: 0; -} +//} //window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not([switchingtabs]) > #forward-button { // transition: margin-left 150ms ease-out; //} //window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] { -// margin-left: 5px; +// margin-left: -30px; //} //window:not([chromehidden~="toolbar"]) #urlbar-wrapper:hover:not([switchingtabs]) > #forward-button[disabled] { @@ -810,7 +823,7 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba //window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] { // /* when not hovered anymore, trigger a new transition to hide the forward button immediately */ -// margin-left: 10px; +// margin-left: -30.01px; //} /* tabview menu item */ @@ -1737,7 +1750,7 @@ toolbar[brighttext] #loop-button { //window:not([chromehidden~="toolbar"]) #urlbar-wrapper { // clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path"); -// -moz-margin-start: -5px; +// margin-inline-start: calc(-1 * var(--backbutton-urlbar-overlap)); //} //window:not([chromehidden~="toolbar"]) #urlbar-wrapper:-moz-locale-dir(rtl), @@ -1926,7 +1939,7 @@ toolbar[brighttext] #loop-button { } #notification-popup-box:not([hidden]) + #identity-box { - padding-inline-start: 10px; + padding-inline-start: 5px; border-radius: 0; } @@ -2836,10 +2849,10 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-box-align: center; } -#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { - //margin-top: 3px; - //margin-bottom: 3px; -} +//#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { +// margin-top: 3px; +// margin-bottom: 3px; +//} #bookmarks-menu-button[disabled][cui-areatype="toolbar"] > .toolbarbutton-icon, #bookmarks-menu-button[disabled][cui-areatype="toolbar"] > .toolbarbutton-menu-dropmarker, @@ -2919,7 +2932,6 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-color: Window; } - /* Findbar */ .browserContainer > findbar { background-color: $bg_color; @@ -3013,6 +3025,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- :root { --tab-toolbar-navbar-overlap: 1px; + --navbar-tab-toolbar-highlight-overlap: 1px; --tab-min-height: 31px; } #TabsToolbar { @@ -3101,9 +3114,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- .tab-icon-overlay { width: 16px; height: 16px; - margin-top: 10px; + margin-top: -12px; -moz-margin-start: -16px; - display: none; + position: relative; } .tab-icon-overlay[crashed] { @@ -3121,21 +3134,29 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- } .tab-icon-overlay[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio"); + list-style-image: url("chrome://browser/skin/custom_images/#{$darker_asset_path_2}/tabs/tab-audio-small.svg#tab-audio"); } .tab-icon-overlay[muted]:not([crashed]) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-muted"); + list-style-image: url("chrome://browser/skin/custom_images/#{$darker_asset_path_2}/tabs/tab-audio-small.svg#tab-audio-muted"); } -#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]:not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white"); +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[soundplaying] { + list-style-image: url("chrome://browser/skin/custom_images/#{$asset_path}/tabs/tab-audio-small.svg#tab-audio"); } -#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted"); +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[muted]:not([crashed]) { + list-style-image: url("chrome://browser/skin/custom_images/#{$asset_path}/tabs/tab-audio-small.svg#tab-audio-muted"); } +//#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]: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(:hover) { +// list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted"); +//} + .tab-throbber[busy] { list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png"); } @@ -3163,76 +3184,76 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- } .tab-icon-sound[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab"); + list-style-image: url("chrome://browser/skin/custom_images/#{$darker_asset_path_2}/tabs/tab-audio.svg#tab-audio-backgroundTab"); } .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-hover"); + list-style-image: url("chrome://browser/skin/custom_images/#{$darker_asset_path_2}/tabs/tab-audio.svg#tab-audio-backgroundTab-hover"); } .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-pressed"); + list-style-image: url("chrome://browser/skin/custom_images/#{$darker_asset_path_2}/tabs/tab-audio.svg#tab-audio-backgroundTab-pressed"); } .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted"); + list-style-image: url("chrome://browser/skin/custom_images/#{$darker_asset_path_2}/tabs/tab-audio.svg#tab-audio-backgroundTab-muted"); } .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); + list-style-image: url("chrome://browser/skin/custom_images/#{$darker_asset_path_2}/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); } .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); + list-style-image: url("chrome://browser/skin/custom_images/#{$darker_asset_path_2}/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); } .tab-icon-sound[visuallyselected=true][soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); + list-style-image: url("chrome://browser/skin/custom_images/#{$asset_path}/tabs/tab-audio.svg#tab-audio"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover"); + list-style-image: url("chrome://browser/skin/custom_images/#{$asset_path}/tabs/tab-audio.svg#tab-audio-hover"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed"); + list-style-image: url("chrome://browser/skin/custom_images/#{$asset_path}/tabs/tab-audio.svg#tab-audio-pressed"); } .tab-icon-sound[visuallyselected=true][muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted"); + list-style-image: url("chrome://browser/skin/custom_images/#{$asset_path}/tabs/tab-audio.svg#tab-audio-muted"); } .tab-icon-sound[visuallyselected=true][muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover"); + list-style-image: url("chrome://browser/skin/custom_images/#{$asset_path}/tabs/tab-audio.svg#tab-audio-muted-hover"); } .tab-icon-sound[visuallyselected=true][muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-pressed"); + list-style-image: url("chrome://browser/skin/custom_images/#{$asset_path}/tabs/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-white"); -} +//#TabsToolbar[brighttext] .tab-icon-sound[soundplaying] { +// list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white"); +//} -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-hover"); -} +//#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover { +// list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-hover"); +//} -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-pressed"); -} +//#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active { +// list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-pressed"); +//} -#TabsToolbar[brighttext] .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white"); -} +//#TabsToolbar[brighttext] .tab-icon-sound[muted] { +// list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white"); +//} -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-hover"); -} +//#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover { +// list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-hover"); +//} -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-pressed"); -} +//#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active { +// list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-pressed"); +//} .tab-background, .tabs-newtab-button { @@ -3252,7 +3273,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-image: url(chrome://browser/skin/custom_images/#{$darker_asset_path_2}/tabs/tab-overflow-indicator.png); background-size: 100% 100%; width: 14px; - margin-bottom: var(--tab-toolbar-navbar-overlap); + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); pointer-events: none; position: relative; z-index: 3; /* the selected tab's z-index + 1 */ @@ -3404,10 +3425,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- /* new tab button border and gradient on hover */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([visuallyselected=true]), .tabs-newtab-button:hover { - background-image: - url(chrome://browser/skin/custom_images/#{$darker_asset_path}/tabs/tab-start-hover.svg), - url(chrome://browser/skin/custom_images/#{$darker_asset_path}/tabs/tab-middle-hover.svg), - url(chrome://browser/skin/custom_images/#{$darker_asset_path}/tabs/tab-end-hover.svg); + background-image: url(chrome://browser/skin/custom_images/#{$darker_asset_path}/tabs/tab-start-hover.svg), + url(chrome://browser/skin/custom_images/#{$darker_asset_path}/tabs/tab-middle-hover.svg), + url(chrome://browser/skin/custom_images/#{$darker_asset_path}/tabs/tab-end-hover.svg); background-position: left bottom, 30px bottom, right bottom; background-repeat: no-repeat; background-size: 30px 100%, calc(100% - (2 * 30px)) 100%, 30px 100%; @@ -3442,27 +3462,30 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-size: 85% 100%; } -///* Background tab separators (3px wide). -// Also show separators beside the selected tab when dragging it. */ +/* Tab separators */ + +//.tabbrowser-tab::after, +//.tabbrowser-tab::before { +// width: 1px; +// -moz-margin-start: -1px; +// background-image: linear-gradient(transparent 5px, +// currentColor 5px, +// currentColor calc(100% - 4px), +// transparent calc(100% - 4px)); +// opacity: 0.2; +//} + +//#TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab::before, +//#TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab::after { +// opacity: 0.4; +//} + +/* Also show separators beside the selected tab when dragging it. */ //#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after, //.tabbrowser-tab:not([visuallyselected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before, //#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not([beforehovered]):not(:hover)::after { -// -moz-margin-start: -1.5px; -// -moz-margin-end: -1.5px; -// background-image: var(--tab-separator-image); -// background-position: left bottom var(--tab-toolbar-navbar-overlap); -// background-repeat: no-repeat; -// background-size: var(--tab-separator-size); -// opacity: var(--tab-separator-opacity); // content: ""; // display: -moz-box; -// width: 3px; -//} - -//#TabsToolbar[brighttext] { -// --tab-separator-image: linear-gradient(transparent 0%, transparent 15%, currentColor 15%, currentColor 90%, transparent 90%); -// --tab-separator-size: 1px 100%; -// --tab-separator-opacity: 0.4; //} /* New tab button */ @@ -3604,7 +3627,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- } #TabsToolbar .toolbarbutton-1 { - margin-bottom: var(--tab-toolbar-navbar-overlap); + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); } #alltabs-button { diff --git a/arc-firefox-theme/chrome/browser/sass/browser-dark.css b/arc-firefox-theme/chrome/browser/sass/browser-dark.css index a17f8d2..b939b29 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-dark.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-dark.css @@ -600,9 +600,9 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba transform: scaleX(-1); } #forward-button { + padding: 0; margin-left: 2px; - margin-right: 2px; - padding: 0; } + margin-right: 2px; } /* tabview menu item */ #menu_tabview { @@ -1437,7 +1437,7 @@ toolbar[brighttext] #loop-button { padding-inline-start: 2px; } #notification-popup-box:not([hidden]) + #identity-box { - padding-inline-start: 10px; + padding-inline-start: 5px; border-radius: 0; } window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box { @@ -2262,6 +2262,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- /* Tabstrip */ :root { --tab-toolbar-navbar-overlap: 1px; + --navbar-tab-toolbar-highlight-overlap: 1px; --tab-min-height: 31px; } #TabsToolbar { @@ -2331,9 +2332,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- .tab-icon-overlay { width: 16px; height: 16px; - margin-top: 10px; + margin-top: -12px; -moz-margin-start: -16px; - display: none; } + position: relative; } .tab-icon-overlay[crashed] { list-style-image: url("chrome://browser/skin/tabbrowser/crashed.svg"); } @@ -2347,16 +2348,16 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-color: white; } .tab-icon-overlay[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio-small.svg#tab-audio"); } .tab-icon-overlay[muted]:not([crashed]) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio-small.svg#tab-audio-muted"); } -#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]:not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white"); } +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[soundplaying] { + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio-small.svg#tab-audio"); } -#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted"); } +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[muted]:not([crashed]) { + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio-small.svg#tab-audio-muted"); } .tab-throbber[busy] { list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png"); } @@ -2380,58 +2381,40 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- padding: 0; } .tab-icon-sound[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab"); } .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-hover"); } .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-pressed"); } .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-muted"); } .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); } .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); } .tab-icon-sound[visuallyselected=true][soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-hover"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-pressed"); } .tab-icon-sound[visuallyselected=true][muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-muted"); } .tab-icon-sound[visuallyselected=true][muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-muted-hover"); } .tab-icon-sound[visuallyselected=true][muted]: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-white"); } - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-hover"); } - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-pressed"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-hover"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-muted-pressed"); } .tab-background, .tabs-newtab-button { @@ -2449,7 +2432,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-image: url(chrome://browser/skin/custom_images/dark/tabs/tab-overflow-indicator.png); background-size: 100% 100%; width: 14px; - margin-bottom: var(--tab-toolbar-navbar-overlap); + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); pointer-events: none; position: relative; z-index: 3; @@ -2598,6 +2581,8 @@ lwtHeader;*/ background-repeat: no-repeat; background-size: 85% 100%; } +/* Tab separators */ +/* Also show separators beside the selected tab when dragging it. */ /* New tab button */ .tabs-newtab-button { width: calc(36px + 30px); } @@ -2699,7 +2684,7 @@ lwtHeader;*/ transition: none; } #TabsToolbar .toolbarbutton-1 { - margin-bottom: var(--tab-toolbar-navbar-overlap); } + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); } #alltabs-button { list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/alltabs.svg"); } diff --git a/arc-firefox-theme/chrome/browser/sass/browser-darker.css b/arc-firefox-theme/chrome/browser/sass/browser-darker.css index 8e4374d..14c7d20 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-darker.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-darker.css @@ -600,9 +600,9 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba transform: scaleX(-1); } #forward-button { + padding: 0; margin-left: 2px; - margin-right: 2px; - padding: 0; } + margin-right: 2px; } /* tabview menu item */ #menu_tabview { @@ -1436,7 +1436,7 @@ toolbar[brighttext] #loop-button { padding-inline-start: 2px; } #notification-popup-box:not([hidden]) + #identity-box { - padding-inline-start: 10px; + padding-inline-start: 5px; border-radius: 0; } window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box { @@ -2262,6 +2262,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- /* Tabstrip */ :root { --tab-toolbar-navbar-overlap: 1px; + --navbar-tab-toolbar-highlight-overlap: 1px; --tab-min-height: 31px; } #TabsToolbar { @@ -2331,9 +2332,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- .tab-icon-overlay { width: 16px; height: 16px; - margin-top: 10px; + margin-top: -12px; -moz-margin-start: -16px; - display: none; } + position: relative; } .tab-icon-overlay[crashed] { list-style-image: url("chrome://browser/skin/tabbrowser/crashed.svg"); } @@ -2347,16 +2348,16 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-color: white; } .tab-icon-overlay[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio-small.svg#tab-audio"); } .tab-icon-overlay[muted]:not([crashed]) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio-small.svg#tab-audio-muted"); } -#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]:not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white"); } +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[soundplaying] { + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio"); } -#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted"); } +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[muted]:not([crashed]) { + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio-muted"); } .tab-throbber[busy] { list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png"); } @@ -2380,58 +2381,40 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- padding: 0; } .tab-icon-sound[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab"); } .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-hover"); } .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-pressed"); } .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-muted"); } .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); } .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); } .tab-icon-sound[visuallyselected=true][soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-hover"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-pressed"); } .tab-icon-sound[visuallyselected=true][muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-muted"); } .tab-icon-sound[visuallyselected=true][muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-muted-hover"); } .tab-icon-sound[visuallyselected=true][muted]: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-white"); } - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-hover"); } - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-pressed"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-hover"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-muted-pressed"); } .tab-background, .tabs-newtab-button { @@ -2449,7 +2432,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-image: url(chrome://browser/skin/custom_images/dark/tabs/tab-overflow-indicator.png); background-size: 100% 100%; width: 14px; - margin-bottom: var(--tab-toolbar-navbar-overlap); + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); pointer-events: none; position: relative; z-index: 3; @@ -2598,6 +2581,8 @@ lwtHeader;*/ background-repeat: no-repeat; background-size: 85% 100%; } +/* Tab separators */ +/* Also show separators beside the selected tab when dragging it. */ /* New tab button */ .tabs-newtab-button { width: calc(36px + 30px); } @@ -2699,7 +2684,7 @@ lwtHeader;*/ transition: none; } #TabsToolbar .toolbarbutton-1 { - margin-bottom: var(--tab-toolbar-navbar-overlap); } + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); } #alltabs-button { list-style-image: url("chrome://browser/skin/custom_images/dark/tabs/alltabs.svg"); } diff --git a/arc-firefox-theme/chrome/browser/sass/browser-light.css b/arc-firefox-theme/chrome/browser/sass/browser-light.css index c95f45b..c21611b 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-light.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-light.css @@ -600,9 +600,9 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba transform: scaleX(-1); } #forward-button { + padding: 0; margin-left: 2px; - margin-right: 2px; - padding: 0; } + margin-right: 2px; } /* tabview menu item */ #menu_tabview { @@ -1436,7 +1436,7 @@ toolbar[brighttext] #loop-button { padding-inline-start: 2px; } #notification-popup-box:not([hidden]) + #identity-box { - padding-inline-start: 10px; + padding-inline-start: 5px; border-radius: 0; } window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box { @@ -2262,6 +2262,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- /* Tabstrip */ :root { --tab-toolbar-navbar-overlap: 1px; + --navbar-tab-toolbar-highlight-overlap: 1px; --tab-min-height: 31px; } #TabsToolbar { @@ -2331,9 +2332,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- .tab-icon-overlay { width: 16px; height: 16px; - margin-top: 10px; + margin-top: -12px; -moz-margin-start: -16px; - display: none; } + position: relative; } .tab-icon-overlay[crashed] { list-style-image: url("chrome://browser/skin/tabbrowser/crashed.svg"); } @@ -2347,16 +2348,16 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-color: white; } .tab-icon-overlay[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio"); } .tab-icon-overlay[muted]:not([crashed]) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio-muted"); } -#TabsToolbar[brighttext] .tab-icon-overlay[soundplaying]:not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white"); } +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[soundplaying] { + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio"); } -#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not(:hover) { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted"); } +.tabbrowser-tab[visuallyselected=true] .tab-icon-overlay[muted]:not([crashed]) { + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio-small.svg#tab-audio-muted"); } .tab-throbber[busy] { list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png"); } @@ -2380,58 +2381,40 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- padding: 0; } .tab-icon-sound[soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab"); } .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-hover"); } .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-pressed"); } .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-muted"); } .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-hover"); } .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-backgroundTab-muted-pressed"); } .tab-icon-sound[visuallyselected=true][soundplaying] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-hover"); } .tab-icon-sound[visuallyselected=true][soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-pressed"); } .tab-icon-sound[visuallyselected=true][muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-muted"); } .tab-icon-sound[visuallyselected=true][muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-hover"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-muted-hover"); } .tab-icon-sound[visuallyselected=true][muted]: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-white"); } - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-hover"); } - -#TabsToolbar[brighttext] .tab-icon-sound[soundplaying]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-white-pressed"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted] { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-hover"); } - -#TabsToolbar[brighttext] .tab-icon-sound[muted]:hover:active { - list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted-white-pressed"); } + list-style-image: url("chrome://browser/skin/custom_images/light/tabs/tab-audio.svg#tab-audio-muted-pressed"); } .tab-background, .tabs-newtab-button { @@ -2449,7 +2432,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- background-image: url(chrome://browser/skin/custom_images/light/tabs/tab-overflow-indicator.png); background-size: 100% 100%; width: 14px; - margin-bottom: var(--tab-toolbar-navbar-overlap); + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); pointer-events: none; position: relative; z-index: 3; @@ -2598,6 +2581,8 @@ lwtHeader;*/ background-repeat: no-repeat; background-size: 85% 100%; } +/* Tab separators */ +/* Also show separators beside the selected tab when dragging it. */ /* New tab button */ .tabs-newtab-button { width: calc(36px + 30px); } @@ -2699,7 +2684,7 @@ lwtHeader;*/ transition: none; } #TabsToolbar .toolbarbutton-1 { - margin-bottom: var(--tab-toolbar-navbar-overlap); } + margin-bottom: var(--navbar-tab-toolbar-highlight-overlap); } #alltabs-button { list-style-image: url("chrome://browser/skin/custom_images/light/tabs/alltabs.svg"); } |
