X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fbrowser.css;h=61ea7c6fc224f4f945fe04a38faacf52938778ac;hp=2212fea4351abca4c0070fe670cc87febfd9ba02;hb=dbad77eabc8467c637024bc9963f45310d15565c;hpb=ec6b35d822a99b5e8ed93538398ec054713bb38b diff --git a/LCARStrek/browser/browser.css b/LCARStrek/browser/browser.css index 2212fea4..61ea7c6f 100644 --- a/LCARStrek/browser/browser.css +++ b/LCARStrek/browser/browser.css @@ -36,6 +36,124 @@ menubar { -moz-binding: url("chrome://global/skin/globalBindings.xml#menubar"); } +/* === BEGIN browser.inc.css === */ + +/* Go button */ +.urlbar-go-button { + padding: 0 3px; + list-style-image: url("chrome://browser/skin/reload-stop-goFx.png"); +} + +.urlbar-go-button { + -moz-image-region: rect(0, 42px, 14px, 28px); +} + +.urlbar-go-button:hover { + -moz-image-region: rect(14px, 42px, 28px, 28px); +} + +.urlbar-go-button:-moz-locale-dir(rtl) { + transform: scaleX(-1); +} + +@media (min-resolution: 1.1dppx) { + .urlbar-go-button { + list-style-image: url("chrome://browser/skin/reload-stop-go@2x.png"); + -moz-image-region: rect(0, 84px, 28px, 56px); + width: 14px; + } + + .urlbar-go-button:hover { + -moz-image-region: rect(28px, 84px, 56px, 56px); + } + + .urlbar-go-button:hover:active { + -moz-image-region: rect(56px, 84px, 84px, 56px); + } +} + +/* Zoom button */ +#urlbar-zoom-button { + margin: 0 3px; + font-size: .8em; + padding: 0 8px; + border-radius: 1em; +/* background-color: hsla(0,0%,0%,.05); + border: 1px solid ThreeDLightShadow;*/ +} + +#urlbar-zoom-button[animate="true"] { + animation-name: urlbar-zoom-reset-pulse; + animation-duration: 250ms; +} + +#urlbar-zoom-button:hover { +/* background-color: hsla(0,0%,0%,.1);*/ +} + +#urlbar-zoom-button:hover:active { +/* background-color: hsla(0,0%,0%,.15);*/ +} + +#urlbar-zoom-button > .toolbarbutton-text { + display: -moz-box; +} + +#urlbar-zoom-button > .toolbarbutton-icon { + display: none; +} + +/* Page action button */ +#urlbar-page-action-button { + list-style-image: url("chrome://browser/skin/page-action.svg"); +/* margin: 0; + padding: 0 6px;*/ + -moz-context-properties: fill; + fill: currentColor; +} + +#urlbar-page-action-button > .toolbarbutton-icon { + width: 16px; +} + +#page-action-copy-url-button { + list-style-image: url("chrome://browser/skin/copy-url.svg"); + -moz-context-properties: fill; + fill: currentColor; +} + +#page-action-email-link-button { + list-style-image: url("chrome://browser/skin/email-link.svg"); + -moz-context-properties: fill; + fill: currentColor; +} + +#page-action-send-to-device-button { + list-style-image: url("chrome://browser/skin/device-mobile.svg"); + -moz-context-properties: fill; + fill: currentColor; +} + +.page-action-sendToDevice-device[clientType=mobile] { + list-style-image: url("chrome://browser/skin/device-mobile.svg"); + -moz-context-properties: fill; + fill: currentColor; +} + +.page-action-sendToDevice-device[clientType=desktop] { + list-style-image: url("chrome://browser/skin/device-desktop.svg"); + -moz-context-properties: fill; + fill: currentColor; +} + +#page-action-sendToDevice-fxa-button { + list-style-image: url("chrome://browser/skin/sync.svg"); + -moz-context-properties: fill; + fill: currentColor; +} + +/* === END browser.inc.css === */ + :root { /*--backbutton-urlbar-overlap: 5px;*/ @@ -50,8 +168,8 @@ menubar { --arrowpanel-hover: #FFCF00; --arrowpanel-active: #FF9F00; --arrowpanel-dimmed: #402000; -/* --arrowpanel-dimmed-further: hsla(0,0%,80%,.45); - --arrowpanel-dimmed-even-further: hsla(0,0%,80%,.8); */ + --arrowpanel-dimmed-further: #794900; + --arrowpanel-dimmed-even-further: #603000; --urlbar-separator-color: #9C9CFF; } @@ -106,13 +224,6 @@ menubar { display: none; } -#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[customizing-dragovertarget].customization-target::before, -#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar[customizing-dragovertarget].customization-target::before, -#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #toolbar-menubar.customization-target:hover::before, -#main-window[customize-entered][tabsintitlebar]:not([inFullscreen]) #TabsToolbar.customization-target:hover::before { - outline-color: #A09090; -} - #navigator-toolbox { } @@ -446,7 +557,7 @@ menuitem.bookmark-item { /* ::::: bookmark items ::::: */ .bookmark-item { - list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png"); + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg"); -moz-image-region: auto; } @@ -867,6 +978,10 @@ menuitem.bookmark-item { transform: scaleX(-1); } +#nav-bar-overflow-button > .toolbarbutton-animatable-box > .toolbarbutton-animatable-image { + display: none; +} + #tabview-button { -moz-image-region: rect(0, 648px, 18px, 630px); } @@ -916,6 +1031,10 @@ menuitem.bookmark-item { -moz-image-region: rect(18px, 738px, 36px, 720px); } +#pocket-button { + fill: currentColor !important; +} + /* === END toolbarbuttons.inc.css === */ /* === BEGIN menupanel.inc.css === */ @@ -968,7 +1087,7 @@ toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, # #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } @@ -1124,7 +1243,7 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > toolbarbutton { #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton > .toolbarbutton-icon, toolbarpaletteitem[place="palette"] > #edit-controls > toolbarbutton > .toolbarbutton-icon, toolbarpaletteitem[place="palette"] > #zoom-controls > toolbarbutton > .toolbarbutton-icon { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } @@ -1277,14 +1396,14 @@ toolbarbutton[constrain-size="true"][cui-areatype="toolbar"] > .toolbarbutton-ba #nav-bar .toolbarbutton-1[type=panel] > .toolbarbutton-icon, #nav-bar .toolbarbutton-1[type=panel] > .toolbarbutton-badge-stack, -#nav-bar .toolbarbutton-1[type=menu]:not(#PanelUI-menu-button):not(#back-button):not(#forward-button) > .toolbarbutton-icon, +#nav-bar .toolbarbutton-1[type=menu]:not(#PanelUI-menu-button):not(#back-button):not(#forward-button):not(#new-tab-button) > .toolbarbutton-icon, #nav-bar .toolbarbutton-1[type=menu]:not(#PanelUI-menu-button) > .toolbarbutton-badge-stack, #nav-bar .toolbarbutton-1[type=menu] > .toolbarbutton-text /* hack for add-ons that forcefully display the label */ { /* padding-inline-end: 17px;*/ } #nav-bar .toolbarbutton-1[type=panel] > .toolbarbutton-icon, -#nav-bar .toolbarbutton-1[type=menu]:not(#PanelUI-menu-button):not(#back-button):not(#forward-button) > .toolbarbutton-icon { +#nav-bar .toolbarbutton-1[type=menu]:not(#PanelUI-menu-button):not(#back-button):not(#forward-button):not(#new-tab-button) > .toolbarbutton-icon { /* horizontal padding + border + icon width */ /* max-width: 43px;*/ } @@ -1450,6 +1569,12 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-but #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { transform: scaleX(-1); } + +#forward-button > .toolbarbutton-menu-dropmarker, +#back-button > .toolbarbutton-menu-dropmarker { + display: none; +} + /* .unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr), .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) { @@ -1699,34 +1824,7 @@ html|*.urlbar-input:-moz-lwtheme::placeholder, #urlbar-zoom-button { /* -moz-appearance: none;*/ - margin: 0 3px; - font-size: .8em; - padding: 0 8px; - border-radius: 1em; -/* background-color: hsla(0,0%,0%,.05); - color: inherit; - border: 1px solid ThreeDLightShadow;*/ -} - -#urlbar-zoom-button[animate="true"] { - animation-name: urlbar-zoom-reset-pulse; - animation-duration: 250ms; -} - -#urlbar-zoom-button:hover { -/* background-color: hsla(0,0%,0%,.1);*/ -} - -#urlbar-zoom-button:hover:active { -/* background-color: hsla(0,0%,0%,.15);*/ -} - -#urlbar-zoom-button > .toolbarbutton-text { - display: -moz-box; -} - -#urlbar-zoom-button > .toolbarbutton-icon { - display: none; +/* color: inherit;*/ } .search-go-container { @@ -1751,17 +1849,15 @@ html|*.urlbar-input:-moz-lwtheme::placeholder, } #urlbar-search-splitter { - min-width: 6px; - margin-inline-start: -3px; + /* The splitter width should equal the location and search bars' combined + neighboring margin and border width. */ + min-width: 8px; + margin: 0 -4px; + position: relative; border: none; background: transparent; } -#urlbar-search-splitter + #urlbar-container > #urlbar, -#urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox { - margin-inline-start: 0; -} - .urlbar-display { border-inline-end: 1px solid #9C9CFF; margin-inline-end: 3px; @@ -1914,6 +2010,9 @@ html|*.urlbar-input:-moz-lwtheme::placeholder, visibility: visible; } +#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon, #urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon { list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); visibility: visible; @@ -1925,13 +2024,6 @@ html|*.urlbar-input:-moz-lwtheme::placeholder, visibility: visible; } -#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon { - list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); - visibility: visible; -} - /* === END identity-block/icons.inc.css === */ #identity-box { @@ -2020,6 +2112,13 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-but height: 16px; } +#urlbar[actiontype="extension"] > #identity-box > #identity-icon { + -moz-image-region: inherit; + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg); + width: 16px; + height: 16px; +} + /* SHARING ICON */ #sharing-icon { @@ -2031,31 +2130,30 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-but } #identity-box[sharing="camera"] > #sharing-icon { - list-style-image: url("chrome://browser/skin/notification-icons.svg#camera"); + list-style-image: url("chrome://browser/skin/notification-icons.svg#camera-sharing"); } #identity-box[sharing="microphone"] > #sharing-icon { - list-style-image: url("chrome://browser/skin/notification-icons.svg#microphone"); + list-style-image: url("chrome://browser/skin/notification-icons.svg#microphone-sharing"); } #identity-box[sharing="screen"] > #sharing-icon { - list-style-image: url("chrome://browser/skin/notification-icons.svg#screen"); + list-style-image: url("chrome://browser/skin/notification-icons.svg#screen-sharing"); } #identity-box[sharing] > #sharing-icon { display: -moz-box; - filter: url("chrome://browser/skin/filters.svg#fill"); - fill: #FF0000; animation-delay: -1.5s; } #identity-box[sharing] > #identity-icon, #sharing-icon { - animation: 3s linear pulse infinite; + animation: 3s linear identity-box-sharing-icon-pulse infinite; } -@keyframes pulse { +@keyframes identity-box-sharing-icon-pulse { +/* This should remain identical to tab-sharing-icon-pulse in tabs.inc.css */ 0%, 16.66%, 83.33%, 100% { opacity: 0; } @@ -2162,6 +2260,72 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box /* autocomplete */ +/* === BEGIN autocomplete.inc.css === */ + +#PopupAutoComplete > richlistbox > richlistitem { + height: 20px; + min-height: 20px; + border: 0; + border-radius: 0; + padding: 0px 1px 0px 1px; +} + +#PopupAutoComplete > richlistbox > richlistitem > .ac-site-icon { + margin-inline-start: 4px; + margin-inline-end: 0; +} + +#PopupAutoComplete > richlistbox > richlistitem > .ac-title { + font: icon; + margin-inline-start: 4px; +} + +#PopupAutoComplete > richlistbox { + padding: 0; +} + +/* Login form autocompletion */ +#PopupAutoComplete > richlistbox > richlistitem[originaltype="login"] > .ac-site-icon { + display: initial; + list-style-image: url(chrome://browser/skin/notification-icons.svg#login); +} + +#PopupAutoComplete > richlistbox > richlistitem[originaltype="login"] > .ac-site-icon[selected] { + list-style-image: url(chrome://browser/skin/notification-icons.svg#login-highlighted); +} + +/* Insecure field warning */ +#PopupAutoComplete > richlistbox > richlistitem[originaltype="insecureWarning"] { + background-color: var(--arrowpanel-dimmed); + border-bottom: 1px solid var(--panel-separator-color); + padding-bottom: 4px; + padding-top: 4px; +} + +#PopupAutoComplete > richlistbox > richlistitem[originaltype="insecureWarning"][selected] { + background-color: var(--arrowpanel-dimmed-further); + color: #FFCF00; +} + +#PopupAutoComplete > richlistbox > richlistitem[originaltype="insecureWarning"] > .ac-title { + color: #A09090; + font-size: 1em; +} + +#PopupAutoComplete > richlistbox > richlistitem[originaltype="insecureWarning"][selected] > .ac-title { + color: inherit; +} + +#PopupAutoComplete > richlistbox > richlistitem[originaltype="insecureWarning"] > .ac-site-icon { + list-style-image: url(chrome://browser/skin/connection-mixed-active-loaded.svg#icon); +} + +/* === END autocomplete.inc.css === */ + +#PopupAutoComplete > richlistbox > richlistitem[originaltype~="datalist-first"] { + border-top: 1px solid #A09090; +} + #treecolAutoCompleteImage { max-width: 36px; } @@ -2178,14 +2342,9 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box border-radius: 2px; border: 1px solid transparent; } - -.autocomplete-richlistitem[selected=true] { - background-color: hsl(210, 80%, 52%); -} */ .ac-title { font-size: 14px; -/* color: hsl(0, 0%, 0%);*/ } .ac-tags { @@ -2193,8 +2352,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box } /* html|span.ac-tag { - background-color: hsl(216, 0%, 88%); - color: hsl(0, 0%, 0%); border-radius: 2px; border: 1px solid transparent; padding: 0 1px; @@ -2207,30 +2364,6 @@ html|span.ac-tag { font-size: 12px; } -.ac-separator { -/* color: hsl(0, 0%, 50%);*/ -} - -.ac-url { - color: #9C9CFF; -} - -.ac-action { - color: #9C9CFF; -} - -.ac-title[selected=true], -.ac-separator[selected], -.ac-url[selected=true], -.ac-action[selected=true] { - color: #000000; -} - -.ac-tags-text[selected] > html|span.ac-tag { - background-color: #A09090; - color: #000000; -} - html|span.ac-emphasize-text-title, html|span.ac-emphasize-text-tag, html|span.ac-emphasize-text-url { @@ -2245,33 +2378,28 @@ html|span.ac-emphasize-text-url { /* list-style-image: url("chrome://browser/skin/urlbar-star.svg#star-inverted");*/ } -.ac-result-type-bookmark, -.autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) { +.ac-result-type-bookmark { list-style-image: url("chrome://browser/skin/places/bookmark.png"); -moz-image-region: rect(0px 16px 16px 0px); width: 16px; height: 16px; } -richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type-bookmark, -.autocomplete-treebody::-moz-tree-image(selected, current, bookmark, treecolAutoCompleteImage) { +richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type-bookmark { /* -moz-image-region: rect(0px 48px 16px 32px);*/ } .ac-type-icon[type=keyword], -.ac-site-icon[type=searchengine], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { +.ac-site-icon[type=searchengine] { list-style-image: url("chrome://global/skin/icons/autocomplete-search.svg#search-icon"); } .ac-type-icon[type=keyword][selected], -.ac-site-icon[type=searchengine][selected], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { +.ac-site-icon[type=searchengine][selected] { list-style-image: url("chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted"); } -.ac-result-type-tag, -.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { +.ac-result-type-tag { list-style-image: url("chrome://mozapps/skin/places/tagContainerIcon.png"); width: 16px; height: 16px; @@ -2315,6 +2443,12 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- border-image-slice: 1; } +/* XXX: temporary for Photon preview changes */ +#reload-button, +#stop-button { + list-style-image: url("chrome://browser/skin/reload-stop-goFx.png"); +} + #urlbar:-moz-locale-dir(ltr) > toolbarbutton { border-top-left-radius: 0px; border-bottom-left-radius: 0px; @@ -2331,18 +2465,22 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- padding-inline-start: 3px; } +#reload-button, #urlbar-reload-button { -moz-image-region: rect(0px, 14px, 14px, 0px); } +#reload-button[disabled=true], #urlbar-reload-button[disabled=true] { -moz-image-region: rect(28px, 14px, 42px, 0px); } +#reload-button:not([disabled=true]):hover, #urlbar-reload-button:not([disabled=true]):hover { -moz-image-region: rect(14px, 14px, 28px, 0px); } +#reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, #urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { transform: scaleX(-1); } @@ -2359,21 +2497,27 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- transform: scaleX(-1); } +#stop-button, #urlbar-stop-button { -moz-image-region: rect(0px, 28px, 14px, 14px); } +#stop-button:hover, #urlbar-stop-button:hover { -moz-image-region: rect(14px, 28px, 28px, 14px); } @media (min-resolution: 1.1dppx) { + #reload-button, + #stop-button, #urlbar-go-button, #urlbar-reload-button, #urlbar-stop-button { list-style-image: url("chrome://browser/skin/reload-stop-go@2x.png"); } + #reload-button > .toolbarbutton-icon, + #stop-button > .toolbarbutton-icon, #urlbar-go-button > .toolbarbutton-icon, #urlbar-reload-button > .toolbarbutton-icon, #urlbar-stop-button > .toolbarbutton-icon { @@ -2392,26 +2536,32 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- -moz-image-region: rect(56px, 84px, 84px, 56px); } + #reload-button, #urlbar-reload-button { -moz-image-region: rect(0, 28px, 28px, 0); } + #reload-button:not([disabled]):hover, #urlbar-reload-button:not([disabled]):hover { -moz-image-region: rect(28px, 28px, 56px, 0); } + #reload-button:not([disabled]):hover:active, #urlbar-reload-button:not([disabled]):hover:active { -moz-image-region: rect(56px, 28px, 84px, 0); } + #stop-button, #urlbar-stop-button { -moz-image-region: rect(0, 56px, 28px, 28px); } + #stop-button:not([disabled]):hover, #urlbar-stop-button:not([disabled]):hover { -moz-image-region: rect(28px, 56px, 56px, 28px); } + #stop-button:hover:active, #urlbar-stop-button:hover:active { -moz-image-region: rect(56px, 56px, 84px, 28px); } @@ -2739,15 +2889,16 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- } .tab-icon-image { - list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png"); + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg"); } .tab-icon-image[sharing]:not([selected]), .tab-sharing-icon-overlay { - animation: 3s linear pulse infinite; + animation: 3s linear tab-sharing-icon-pulse infinite; } -@keyframes pulse { +@keyframes tab-sharing-icon-pulse { +/* This should remain identical to identity-box-sharing-icon-pulse in identity-block.inc.css */ 0%, 16.66%, 83.33%, 100% { opacity: 0; } @@ -2792,12 +2943,14 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- } .tab-icon-overlay[soundplaying], -.tab-icon-overlay[muted]:not([crashed]) { +.tab-icon-overlay[muted]:not([crashed]), +.tab-icon-overlay[blocked]:not([crashed]) { border-radius: 10px; } .tab-icon-overlay[soundplaying]:hover, -.tab-icon-overlay[muted]:hover { +.tab-icon-overlay[muted]:hover, +.tab-icon-overlay[blocked]:not([crashed]):hover { background-color: #FFCF00; } @@ -2809,15 +2962,25 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- list-style-image: url("chrome://browser/skin/tabbrowser/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"); +.tab-icon-overlay[blocked]:not([crashed]) { + 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(:hover) { +#TabsToolbar[brighttext] .tab-icon-overlay[muted]:not([crashed]):not([selected]):not(:hover), +.tab-icon-overlay[mouted][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-throbber[busy] { list-style-image: url("chrome://communicator/skin/brand/throbber16-anim-connect.png"); } @@ -2857,9 +3020,10 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- } .tab-icon-sound[soundplaying], -.tab-icon-sound[muted] { +.tab-icon-sound[muted], +.tab-icon-sound[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } @@ -2867,11 +3031,21 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted); } +.tab-icon-sound[blocked] { + list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-blocked); +} + .tab-close-button { margin-top: 1px; padding: 0; } +.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-background, .tabs-newtab-button { /* overlap the tab curves */ @@ -2937,6 +3111,7 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- .tabs-newtab-button, .tab-icon-overlay[soundplaying], .tab-icon-overlay[muted]:not([crashed]), +.tab-icon-overlay[blocked]:not([crashed]), .tab-icon-sound, .tab-close-button { pointer-events: auto; @@ -3013,10 +3188,6 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- .tab-background-end[selected=true]:-moz-locale-dir(ltr)::after, .tab-background-start[selected=true]:-moz-locale-dir(rtl)::after { } - - .tab-icon-image { - list-style-image: url("chrome://mozapps/skin/places/defaultFavicon@2x.png"); - } } /* All tabs menupopup */ @@ -3026,9 +3197,10 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- } .alltabs-endimage[soundplaying], -.alltabs-endimage[muted] { +.alltabs-endimage[muted], +.alltabs-endimage[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } @@ -3036,6 +3208,10 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted); } +.alltabs-endimage[blocked] { + list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-blocked); +} + /* === END tabs.inc.css === */ /* Tab DnD indicator */ @@ -3046,19 +3222,29 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- /* Tab close button */ .tab-close-button { - list-style-image: url("chrome://global/skin/icons/close-button.gif"); + list-style-image: url("chrome://global/skin/icons/close-button.gif") !important; + -moz-image-region: auto !important; } .tab-close-button:hover, .tab-close-button:hover[selected="true"] { - list-style-image: url("chrome://global/skin/icons/close-button-hover.gif"); + list-style-image: url("chrome://global/skin/icons/close-button-hover.gif") !important; + -moz-image-region: auto !important; } .tab-close-button:hover:active, .tab-close-button:hover:active[selected="true"] { - list-style-image: url("chrome://global/skin/icons/close-button-hover.gif"); + list-style-image: url("chrome://global/skin/icons/close-button-hover.gif") !important; + -moz-image-region: auto !important; } +.tab-close-button > .button-icon, +.tab-close-button > .button-box > .button-icon, +.tab-close-button > .toolbarbutton-icon { + width: auto !important; +} + + /* Tab scrollbox arrow, tabstrip new tab and all-tabs buttons */ .tabbrowser-arrowscrollbox > .scrollbutton-up, @@ -3088,7 +3274,7 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- transition: 1s background-color ease-out; } -.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] { +.tabbrowser-arrowscrollbox > .scrollbutton-down[highlight] { background-color: #008484; } @@ -3128,6 +3314,7 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- #TabsToolbar > #new-tab-button { width: 26px; + -moz-box-orient: horizontal; } #alltabs-button { @@ -3154,7 +3341,7 @@ richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type- /* All tabs menupopup */ .alltabs-item > .menu-iconic-left > .menu-iconic-icon { - list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png"); + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg"); -moz-image-region: auto; } @@ -3256,7 +3443,7 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { type of icon displayed. This rule must be defined before the others in order for its list-style-image to be overridden. */ .notification-anchor-icon { - list-style-image: url("chrome://global/skin/icons/information-16.png"); + list-style-image: url(chrome://browser/skin/notification-icons.svg#default-info); } .notification-anchor-icon:-moz-focusring { @@ -3265,25 +3452,16 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { @media (min-resolution: 1.1dppx) { .notification-anchor-icon { - list-style-image: url(chrome://global/skin/icons/information-32.png); + list-style-image: url(chrome://global/skin/icons/info.svg); } } -.popup-notification-icon { - width: 64px; - height: 64px; - margin-inline-end: 10px; -} - .notification-anchor-icon:not(.plugin-blocked), #blocked-permissions-container > .blocked-permission-icon { filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } -.notification-anchor-icon:not(.plugin-blocked):not(:hover) { -} - /* INDIVIDUAL NOTIFICATIONS */ .popup-notification-icon[popupid="web-notifications"], @@ -3324,8 +3502,7 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { list-style-image: url(chrome://browser/skin/notification-icons.svg#login-detailed); } -.camera-icon, -.popup-notification-icon[popupid="webRTC-shareDevices"] { +.camera-icon { list-style-image: url(chrome://browser/skin/notification-icons.svg#camera); } @@ -3349,11 +3526,10 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { list-style-image: url(chrome://browser/skin/notification-icons.svg#microphone-blocked); } -.popup-notification-icon[popupid="webRTC-shareMicrophone"] { +.popup-notification-icon.microphone-icon { list-style-image: url(chrome://browser/skin/notification-icons.svg#microphone-detailed); } -.popup-notification-icon[popupid="webRTC-shareScreen"], .screen-icon { list-style-image: url(chrome://browser/skin/notification-icons.svg#screen); } @@ -3366,6 +3542,34 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { list-style-image: url(chrome://browser/skin/notification-icons.svg#screen-blocked); } +#webRTC-preview:not([hidden]) { + display: -moz-stack; + border-radius: 4px; + border: 1px solid #A09090; + overflow: hidden; + min-width: 300px; + min-height: 10em; +} + +html|*#webRTC-previewVideo { + width: 300px; + /* If we don't set the min-width, width is ignored. */ + min-width: 300px; + max-height: 200px; +} + +#webRTC-previewWarning { + background: #FF0000 url("chrome://browser/skin/warning-white.svg") no-repeat .75em .75em; + margin: 0; + padding: .5em; + padding-inline-start: calc(1.5em + 16px); + border-top: 1px solid #A09090; +} + +#webRTC-previewWarning > .text-link { + margin-inline-start: 0; +} + /* This icon has a block sign in it, so we don't need a blocked version. */ .popup-icon { list-style-image: url("chrome://browser/skin/notification-icons.svg#popup"); @@ -3396,7 +3600,7 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { /* INSTALL ADDONS */ .install-icon { - list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#default); + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg); } .popup-notification-icon[popupid="xpinstall-disabled"], @@ -3499,6 +3703,40 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] { max-width: 28em; } +.addon-install-confirmation-name { + font-weight: bold; +} + +.addon-webext-perm-header { + font-size: 1.3em; +} + +.addon-webext-name { + display: inline; + font-weight: bold; + margin: 0; +} + +.addon-addon-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/menuPanel.svg"); + -moz-image-region: rect(0px, 288px, 32px, 256px); +} + +.addon-toolbar-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/ToolbarFx.png"); + -moz-image-region: rect(0, 486px, 18px, 468px); +} + +/* Notification icon box */ + +.notification-anchor-icon:-moz-focusring { +/* outline: 1px dotted -moz-DialogText;*/ +} + /* Translation infobar */ /* === BEGIN infobar.inc.css === */ @@ -3667,7 +3905,6 @@ html|*.pointerlockfswarning[data-identity="verifiedDomain"]::before { html|*.pointerlockfswarning[data-identity="unknownIdentity"]::before { content: url("chrome://browser/skin/fullscreen/insecure.svg"); } - html|*.pointerlockfswarning-domain-text, html|*.pointerlockfswarning-generic-text { font-size: 21px; @@ -3681,13 +3918,9 @@ html|*.pointerlockfswarning-domain { margin: 0; } +html|*#fullscreen-exit-button, html|*.pointerlockfswarning-exit-button { - padding: 5px 30px; - font-family: "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif; - font-size: 14px; - font-weight: lighter; margin: 0; - box-sizing: content-box; border-radius: 300px; border: none; @@ -4400,6 +4633,22 @@ notification.pluginVulnerable .messageImage { --drag-drop-transition-duration: .3s; } +#main-window[customization-lwtheme] #tab-view-deck:-moz-lwtheme { + background-repeat: no-repeat; + background-position: right top; + background-attachment: fixed; + background-color: transparent; + background-image: -moz-image-rect(var(--lwt-header-image), 0, 100%, + var(--toolbox-rect-height), 0), + linear-gradient(to bottom, + var(--lwt-accent-color) calc(var(--toolbox-rect-height-with-unit) - 1px), + rgba(0,0,0,0.25) calc(var(--toolbox-rect-height-with-unit) - 1px), + rgba(0,0,0,0.25) calc(var(--toolbox-rect-height-with-unit) + 1px), + rgba(255,255,255,0.5) calc(var(--toolbox-rect-height-with-unit) + 1px), + rgba(255,255,255,0.5) calc(var(--toolbox-rect-height-with-unit) + 2px), + transparent calc(var(--toolbox-rect-height-with-unit) + 2px)); +} + #main-window:-moz-any([customize-entering],[customize-entered]) #browser-bottombox { margin-bottom: 1em; } @@ -4589,6 +4838,7 @@ notification.pluginVulnerable .messageImage { width: 20px; height: 20px; border-radius: 2px; + background-image: url("chrome://browser/content/default-theme-icon.svg"); background-size: contain; } @@ -4790,7 +5040,7 @@ toolbarpaletteitem[place="toolbar"]:not([mousedown="true"]):-moz-focusring { } .customization-lwtheme-menu-theme[defaulttheme] { - list-style-image: url(chrome://browser/skin/Fxtheme-switcher-icon.png); + list-style-image: url(chrome://browser/content/default-theme-icon.svg); } .customization-lwtheme-menu-theme[active="true"] { @@ -4947,15 +5197,6 @@ toolbarpaletteitem[place="toolbar"]:not([mousedown="true"]):-moz-focusring { background-attachment: fixed; } -#main-window[customization-lwtheme] > #tab-view-deck:-moz-lwtheme { - background-repeat: no-repeat; - background-position: right top; - background-attachment: fixed; - /* The image will get set from CustomizeMode.jsm */ - background-image: none; - background-color: transparent; -} - #main-window[customization-lwtheme]:-moz-lwtheme { background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png"); background-repeat: repeat; @@ -5310,7 +5551,7 @@ notification.heartbeat { #UITourTooltipButtons { /** - * Override the --panel-arrowcontent-padding so the background extends + * Override the --arrowpanel-padding so the background extends * to the sides and bottom of the panel. */ margin-left: -10px; @@ -5341,7 +5582,7 @@ menugroup > .menuitem-iconic[disabled="true"] > .menu-iconic-left { width: 16px; height: 16px; margin: 7px; - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } @@ -5407,3 +5648,55 @@ menugroup > .menuitem-iconic[disabled="true"] > .menu-iconic-left { .webextension-popup-browser { border-radius: inherit; } + +.contentSelectDropdown-ingroup > .menu-iconic-text { + padding-inline-start: 20px; +} + +#ContentSelectDropdown > menupopup { + background-color: #000000; + -moz-border-top-colors: #A09090; + -moz-border-right-colors: #A09090; + -moz-border-bottom-colors: #A09090; + -moz-border-left-colors: #A09090; +} + +#ContentSelectDropdown > menupopup > menucaption, +#ContentSelectDropdown > menupopup > menuitem { + padding: 0 6px; + border-width: 0; +/* font: -moz-list;*/ +} + +#ContentSelectDropdown > menupopup > menucaption > .menu-iconic-text, +#ContentSelectDropdown > menupopup > menuitem > .menu-iconic-text { + /* Padding should follow the 4/12 ratio, where 12px is the default font-size + with 4px being the preferred padding size. */ + padding-top: .3333em; + padding-bottom: .3333em; +} + +#ContentSelectDropdown > menupopup > menucaption > .menu-iconic-text { + font-weight: bold; +} + +#ContentSelectDropdown > menupopup > menuitem[_moz-menuactive="true"][disabled="true"] { + color: #A09090; + background-color: unset; +} + +#ContentSelectDropdown > menupopup > menucaption { + background-color: buttonface; +} + +#ContentSelectDropdown > menupopup > menucaption[disabled="true"] { + color: #A09090; +} + +#ContentSelectDropdown > .isOpenedViaTouch > menucaption > .menu-iconic-text, +#ContentSelectDropdown > .isOpenedViaTouch > menuitem > .menu-iconic-text { + /* Touch padding should follow the 11/12 ratio, where 12px is the default + font-size with 11px being the preferred padding size. */ + padding-top: .9167em; + padding-bottom: .9167em; +}