/*
-# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*-
+# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil -*-
# 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/.
-/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*-
+/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil -*-
* 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/. */
-/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*-
+/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil -*-
* 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/. */
/*
-# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*-
+# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil -*-
# 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/.
/*
-# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*-
+# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil -*-
# 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/.
#advancedPanelContainer {
position: absolute;
padding: 24px 0;
+ width: 100%;
}
.advanced-panel {
#automaticallyReportInFuture {
cursor: pointer;
+ display: inline-block;
+ padding-inline-start: 2.3em;
+ text-indent: -2.3em;
+ line-height: 16px
}
#errorCode:not([href]) {
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
width="16" height="16" viewBox="0 0 16 16">
<defs>
- <style>
- use:not(:target) {
- display: none;
- }
- .style-icon-notification {
- fill: #A09090;
- }
- .style-icon-notification.hover {
- fill: #000000;
- }
- .style-icon-notification.active {
- fill: #000000;
- }
- </style>
- <path id="shape-notifcations-addons" d="M10,15c0.5,0,1-0.4,1-1v-3c0,0,0-0.8,0.8-0.8c0.6,0,0.6,0.8,1.8,0.8c0.6,0,1.5-0.2,1.5-2c0-1.8-0.9-2-1.5-2 c-1.1,0-1.1,0.7-1.8,0.7C11,7.7,11,7,11,7V6c0-0.6-0.5-1-1-1H8c0,0-0.8,0-0.8-0.8C7.2,3.6,8,3.6,8,2.5C8,1.9,7.8,1,6,1 C4.2,1,4,1.9,4,2.5c0,1.1,0.8,1.1,0.8,1.8C4.8,5,4,5,4,5H2C1.5,5,1,5.4,1,6l0,1.5c0,0-0.1,1,1.1,1c0.8,0,0.9-1,1.9-1 C4.5,7.4,5,8,5,9c0,1-0.5,1.6-1,1.6c-1,0-1.1-1.1-1.9-1.1C0.9,9.5,1,10.8,1,10.8V14c0,0.6,0.5,1,1,1l2.6,0c0,0,1.1,0,1.1-1 c0-0.8-1-0.1-1-1.1c0-0.5,0.7-1.2,1.8-1.2s1.8,0.7,1.8,1.2c0,1-1.1,0.3-1.1,1.1c0,1,1.2,1,1.2,1H10z"/>
+ <path id="shape-notifications-addons" d="M10,15c0.5,0,1-0.4,1-1v-3c0,0,0-0.8,0.8-0.8c0.6,0,0.6,0.8,1.8,0.8c0.6,0,1.5-0.2,1.5-2c0-1.8-0.9-2-1.5-2 c-1.1,0-1.1,0.7-1.8,0.7C11,7.7,11,7,11,7V6c0-0.6-0.5-1-1-1H8c0,0-0.8,0-0.8-0.8C7.2,3.6,8,3.6,8,2.5C8,1.9,7.8,1,6,1 C4.2,1,4,1.9,4,2.5c0,1.1,0.8,1.1,0.8,1.8C4.8,5,4,5,4,5H2C1.5,5,1,5.4,1,6l0,1.5c0,0-0.1,1,1.1,1c0.8,0,0.9-1,1.9-1 C4.5,7.4,5,8,5,9c0,1-0.5,1.6-1,1.6c-1,0-1.1-1.1-1.9-1.1C0.9,9.5,1,10.8,1,10.8V14c0,0.6,0.5,1,1,1l2.6,0c0,0,1.1,0,1.1-1 c0-0.8-1-0.1-1-1.1c0-0.5,0.7-1.2,1.8-1.2s1.8,0.7,1.8,1.2c0,1-1.1,0.3-1.1,1.1c0,1,1.2,1,1.2,1H10z"/>
</defs>
- <use id="default" xlink:href="#shape-notifcations-addons" class="style-icon-notification"/>
- <use id="hover" xlink:href="#shape-notifcations-addons" class="style-icon-notification hover"/>
- <use id="active" xlink:href="#shape-notifcations-addons" class="style-icon-notification active"/>
+ <use id="default" xlink:href="#shape-notifications-addons"/>
</svg>
/* We want a 4px gap between the TabsToolbar and the toolbar-menubar when the
toolbar-menu is displayed, and a 16px gap when it is not. 1px is taken care
of by the (light) outer shadow of the tab, the remaining 3/15 are these margins. */
-#toolbar-menubar:not([moz-collapsed=true]):not([autohide=true]) ~ #TabsToolbar,
-#toolbar-menubar:not([moz-collapsed=true])[autohide=true]:not([inactive]) ~ #TabsToolbar {
+#toolbar-menubar:not([autohide=true]) ~ #TabsToolbar:not([inFullscreen]),
+#toolbar-menubar[autohide=true]:not([inactive]) ~ #TabsToolbar:not([inFullscreen]) {
/* margin-top: 3px;*/
}
toolbarbutton.bookmark-item:not(.subviewbutton),
#personal-bookmarks[cui-areatype="toolbar"]:not([overflowedItem=true]) > #bookmarks-toolbar-placeholder {
/* margin: 0;
- padding: 2px 3px;*/
+ padding: 2px 3px;
+ -moz-appearance: none;
+ border: 1px solid transparent;*/
}
-toolbarbutton.bookmark-item:not([disabled="true"]):not(.subviewbutton):hover:active,
-toolbarbutton.bookmark-item[open="true"] {
-/* padding-top: 3px;
- padding-bottom: 1px;
- padding-inline-start: 4px;
- padding-inline-end: 2px;*/
+toolbarbutton.bookmark-item:not(.subviewbutton):hover:not([disabled="true"]):not([open]) {
+/* border-color: var(--toolbarbutton-hover-bordercolor);
+ background: var(--toolbarbutton-hover-background);*/
+}
+
+toolbarbutton.bookmark-item:not(.subviewbutton):hover:active:not([disabled="true"]),toolbarbutton.bookmark-item[open="true"] {
+/* border-color: var(--toolbarbutton-active-bordercolor);
+ box-shadow: var(--toolbarbutton-active-boxshadow);
+ background: var(--toolbarbutton-active-background);*/
}
.bookmark-item > .toolbarbutton-icon,
transition-duration: 150ms;*/
}
/*
-#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-icon,
-#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-badge-stack,
-#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
- padding: 3px 7px;
+#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@, .toolbarbutton-legacy-addon)) > .toolbarbutton-icon,
+#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@, .toolbarbutton-legacy-addon)) > .toolbarbutton-badge-stack,
+#nav-bar .toolbarbutton-1:not(:-moz-any(@primaryToolbarButtons@, .toolbarbutton-legacy-addon)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
+ padding: calc(var(--toolbarbutton-vertical-inner-padding) + 1px) 7px;
}
*/
/* ::::: fullscreen window controls ::::: */
-#window-controls {
- margin-inline-start: 4px;
-}
-
#minimize-button,
#restore-button,
#close-button {
-/* list-style-image: url("chrome://global/skin/icons/windowControls.png");
- padding: 0; */
+ -moz-appearance: none;
+ border: none;
+/* margin: 0 !important;
+ padding: 6px 12px;*/
}
#minimize-button {
- list-style-image: url("chrome://navigator/skin/icons/win-minimize.gif");
+ list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize);
}
#minimize-button:hover {
- list-style-image: url("chrome://navigator/skin/icons/win-minimize-hover.gif");
+ list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize-hover);
}
#restore-button {
- list-style-image: url("chrome://navigator/skin/icons/win-restore.gif");
+ list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore);
+}
+
+#restore-button:hover {
+ list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore-hover);
}
+#minimize-button:hover,
#restore-button:hover {
- list-style-image: url("chrome://navigator/skin/icons/win-restore-hover.gif");
+/* background-color: hsla(0, 0%, 0%, .12);*/
+}
+
+#minimize-button:hover:active,
+#restore-button:hover:active {
+/* background-color: hsla(0, 0%, 0%, .22);*/
}
#close-button {
- list-style-image: url("chrome://navigator/skin/icons/win-close.gif");
+ list-style-image: url(chrome://browser/skin/caption-buttons.svg#close);
}
#close-button:hover {
- list-style-image: url("chrome://navigator/skin/icons/win-close-hover.gif");
+/* background-color: hsl(355, 86%, 49%);*/
+ list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-hover);
+}
+
+#close-button:hover:active {
+/* background-color: hsl(355, 82%, 69%);*/
}
/* ::::: Location Bar ::::: */
margin-inline-start: 0;
}
+.urlbar-input-box,
+
+#urlbar-display-box {
+ padding-inline-start: 4px;
+ border-inline-start: 1px solid var(--urlbar-separator-color);
+ border-inline-end: 1px solid var(--urlbar-separator-color);
+ border-image: linear-gradient(transparent 15%, var(--urlbar-separator-color) 15%, var(--urlbar-separator-color) 85%, transparent 85%);
+ border-image-slice: 1;
+}
+
#urlbar-icons {
-moz-box-align: center;
}
margin-inline-start: 0;
}
-#urlbar-display-box {
-}
-
.urlbar-display {
border-inline-end: 1px solid #9C9CFF;
margin-inline-end: 3px;
transition: none;
}
-#navigator-toolbox:not(:hover) #urlbar:not([focused]) > .urlbar-textbox-container > .urlbar-history-dropmarker {
+#navigator-toolbox:not(:hover) #nav-bar:not([customizing="true"]) #urlbar:not([focused]) > .urlbar-textbox-container > .urlbar-history-dropmarker {
opacity: 0;
}
/* === BEGIN identity-block.inc.css === */
#identity-box {
-/* --identity-box-hover-background-color: #FFCF00;
- --identity-box-selected-background-color: #FF9F00; */
--identity-box-verified-color: #008484;
/* Default theme does different color per channel, we can't as they do it build-time. */
--identity-box-chrome-color: #9C9CFF;
- border-inline-end: 1px solid var(--urlbar-separator-color);
font-size: .9em;
border-radius: 2px;
padding: 3px 5px;
- margin-inline-end: 4px;
overflow: hidden;
/* The latter two properties have a transition to handle the delayed hiding of
the forward button when hovered. */
border-inline-end: 1px solid var(--identity-box-chrome-color);
}
-#identity-box:hover > :not(#identity-icon),
-#identity-box[open=true] > :not(#identity-icon) {
-/* filter: grayscale(100%);*/
-}
-
#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
color: var(--identity-box-verified-color);
border-inline-end: 1px solid var(--identity-box-verified-color);
padding-right: 2px;
}
-#notification-popup-box:not([hidden]) + #identity-box {
- padding-inline-start: 10px;
- border-radius: 0;
-}
-
window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box {
/* border-radius: 0;
padding-inline-start: 2px; */
margin-inline-end: 1px;
}
-window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] + #urlbar >
- #notification-popup-box[hidden] + #identity-box {
+window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] + #urlbar > #identity-box {
padding-inline-start: 2px;
}
-window:not([chromehidden~="toolbar"]) #urlbar-wrapper:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar >
- #notification-popup-box[hidden] + #identity-box {
+window:not([chromehidden~="toolbar"]) #urlbar-wrapper:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar > #identity-box {
/* Forward button hiding is delayed when hovered, so we should use the same
delay for the identity box. We handle both horizontal paddings (for LTR and
RTL), the latter two delays here are for padding-left and padding-right. */
transition-delay: 0s, 100s, 100s;
}
-window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] + #urlbar >
- #notification-popup-box[hidden] + #identity-box {
+window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] + #urlbar > #identity-box {
/* when not hovered anymore, trigger a new non-delayed transition to react to the forward button hiding */
padding-inline-start: 2.01px;
}
list-style-image: url(chrome://browser/skin/identity-icon.svg#normal);
}
-#identity-box:hover > #identity-icon,
+#identity-box:hover > #identity-icon:not(.no-hover),
#identity-box[open=true] > #identity-icon {
list-style-image: url(chrome://browser/skin/identity-icon.svg#hover);
}
+#identity-box.grantedPermissions > #identity-icon {
+ list-style-image: url(chrome://browser/skin/identity-icon.svg#notice);
+}
+
+#identity-box.grantedPermissions:hover > #identity-icon:not(.no-hover),
+#identity-box.grantedPermissions[open=true] > #identity-icon {
+ list-style-image: url(chrome://browser/skin/identity-icon.svg#notice-hover);
+}
+
#urlbar[pageproxystate="valid"] > #identity-box.chromeUI > #identity-icon {
list-style-image: url(chrome://branding/content/identity-icons-brand.svg);
}
}
#urlbar[pageproxystate="valid"] > #identity-box.verifiedDomain > #connection-icon,
-#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity > #connection-icon {
+#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity > #connection-icon,
+#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveBlocked > #connection-icon {
list-style-image: url(chrome://browser/skin/identity-secure.svg);
visibility: visible;
}
+#urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon {
+ list-style-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg);
+ visibility: visible;
+}
+
#urlbar[pageproxystate="valid"] > #identity-box.insecureLoginForms > #connection-icon,
#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveContent > #connection-icon {
list-style-image: url(chrome://browser/skin/identity-mixed-active-loaded.svg);
visibility: visible;
}
-#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveBlocked > #connection-icon {
- list-style-image: url(chrome://browser/skin/identity-mixed-active-blocked.svg);
- visibility: visible;
-}
-
-#urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon {
- list-style-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg);
- visibility: visible;
-}
-
/* === END identity-block.inc.css === */
#page-proxy-favicon {
#urlbar-stop-button {
border-style: none;
list-style-image: url("chrome://browser/skin/reload-stop-goFx.png");
-/* padding: 0 9px;*/
+/* margin: 0 9px; */
margin-inline-start: 0px;
border-inline-start: 1px solid var(--urlbar-separator-color);
border-image: linear-gradient(transparent 15%,
min-width: 27em;
}
-.panel-promo-box {
- margin: 5px 0 -6px;
- padding: 5px 0;
- border-top: 1px solid #9C9CFF;
- border-bottom-left-radius: 5px;
- border-bottom-right-radius: 5px;
-}
-
-.panel-promo-icon {
- list-style-image: url("chrome://browser/skin/sync-notification-24.png");
- margin-inline-end: 10px;
- vertical-align: middle;
-}
-
-.panel-promo-closebutton {
- list-style-image: url("chrome://global/skin/icons/close-button.gif");
- margin-inline-end: -3px;
- margin-top: -3px;
-}
-
-.panel-promo-closebutton:hover {
- list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
-}
-
-.panel-promo-closebutton:hover:active {
- list-style-image: url("chrome://global/skin/icons/close-button-hover.gif");
-}
-
-.panel-promo-closebutton > .toolbarbutton-text {
- padding: 0;
-}
-
/* ::::: content area ::::: */
#sidebar-box {
.tab-throbber,
.tab-icon-image,
+.tab-sharing-icon-overlay,
.tab-icon-sound,
.tab-close-button {
}
.tab-throbber,
+.tab-sharing-icon-overlay,
.tab-icon-image {
height: 16px;
width: 16px;
list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
}
+.tab-icon-image[sharing]:not([selected]),
+.tab-sharing-icon-overlay {
+ animation: 3s linear pulse infinite;
+}
+
+@keyframes pulse {
+ 0%, 16.66%, 83.33%, 100% {
+ opacity: 0;
+ }
+ 33.33%, 66.66% {
+ opacity: 1;
+ }
+}
+
+.tab-icon-image[sharing]:not([selected]) {
+ animation-delay: -1.5s;
+}
+
+.tab-sharing-icon-overlay {
+ /* 16px of the icon + 6px of margin-inline-end of .tab-icon-image */
+ margin-inline-start: -22px;
+ position: relative;
+}
+
+.tab-sharing-icon-overlay[sharing="camera"] {
+ list-style-image: url("chrome://browser/skin/notification-icons.svg#camera");
+}
+
+.tab-sharing-icon-overlay[sharing="microphone"] {
+ list-style-image: url("chrome://browser/skin/notification-icons.svg#microphone");
+}
+
+.tab-sharing-icon-overlay[sharing="screen"] {
+ list-style-image: url("chrome://browser/skin/notification-icons.svg#screen");
+}
+
+.tab-sharing-icon-overlay[sharing] {
+ filter: url("chrome://browser/skin/filters.svg#fill");
+ fill: #FFCF00;
+}
+
.tab-icon-overlay {
width: 16px;
height: 16px;
width: 28px;
/* width: calc(36px + var(--tab-curve-width)); */
}
+@media (min-resolution: 1.1dppx) {
+ /* image preloading hack from like lowdpi styles */
+ #tabbrowser-tabs::before {
+ }
-/* === END tabs.inc.css === */
+ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([visuallyselected=true]),
+ .tabs-newtab-button:hover {
+ }
-/* Background tabs:
- *
- * Decrease the height of the hoverable region of background tabs whenever the tabs are at the top
- * of the window (e.g. no menubar, tabs in titlebar, etc.) to make it easier to drag the window by
- * the titlebar. We don't need this in fullscreen since window dragging is not an issue there.
- */
-#main-window[tabsintitlebar][sizemode=normal] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar .tab-background-middle:not([visuallyselected=true]) {
-/* clip-path: url(chrome://browser/content/browser.xul#tab-hover-clip-path);*/
+ .tab-background-middle[visuallyselected=true] {
+ }
+
+ .tab-background-start[visuallyselected=true]:-moz-locale-dir(ltr)::after,
+ .tab-background-end[visuallyselected=true]:-moz-locale-dir(rtl)::after {
+ }
+
+ .tab-background-end[visuallyselected=true]:-moz-locale-dir(ltr)::after,
+ .tab-background-start[visuallyselected=true]:-moz-locale-dir(rtl)::after {
+ }
+
+ .tab-icon-image {
+ list-style-image: url("chrome://mozapps/skin/places/defaultFavicon@2x.png");
+ }
}
+/* === END tabs.inc.css === */
+
/* Tab DnD indicator */
.tab-drop-indicator {
list-style-image: url("chrome://browser/skin/tabbrowser/tabDragIndicator.png");
/* === BEGIN notification-icons.inc.css === */
+#notification-popup-box {
+ border-radius: 3px 0 0 3px;
+ padding: 5px 0px;
+ margin: -5px 0px;
+ margin-inline-end: -5px;
+ padding-inline-end: 5px;
+}
+
+/* This class can be used alone or in combination with the class defining the
+ 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 {
+ width: 16px;
+ height: 16px;
+ margin-inline-start: 2px;
+ list-style-image: url("chrome://global/skin/icons/information-16.png");
+}
+
+.notification-anchor-icon:-moz-focusring {
+ outline: 1px dotted #008484;
+}
+
+@media (min-resolution: 1.1dppx) {
+ .notification-anchor-icon {
+ list-style-image: url(chrome://global/skin/icons/information-32.png);
+ }
+}
+
.popup-notification-icon {
width: 64px;
height: 64px;
margin-inline-end: 10px;
}
-.popup-notification-icon[popupid="geolocation"] {
- list-style-image: url("chrome://browser/skin/Geolocation-64.png");
+#notification-popup-box > .notification-anchor-icon:not(.in-use):hover {
+ fill: #000000;
}
-.popup-notification-icon[popupid="xpinstall-disabled"],
-.popup-notification-icon[popupid="addon-install-blocked"],
-.popup-notification-icon[popupid="addon-install-origin-blocked"] {
- list-style-image: url(chrome://browser/skin/addons/addon-install-blocked.svg);
+/* INDIVIDUAL NOTIFICATIONS */
+
+/* For the moment we apply the color filter only on the icons listed here.
+ The first two selectors are used by socialchat.xml (bug 1275558). */
+.webRTC-sharingDevices-notification-icon,
+.webRTC-sharingMicrophone-notification-icon,
+.camera-icon,
+.geo-icon,
+.indexedDB-icon,
+.install-icon,
+.login-icon,
+.microphone-icon,
+.plugin-icon,
+.pointerLock-icon,
+.popup-icon,
+.screen-icon,
+.desktop-notification-icon,
+.popup-notification-icon[popupid="geolocation"],
+.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
+.popup-notification-icon[popupid="password"],
+.popup-notification-icon[popupid="pointerLock"],
+.popup-notification-icon[popupid="webRTC-shareDevices"],
+.popup-notification-icon[popupid="webRTC-shareMicrophone"],
+.popup-notification-icon[popupid="webRTC-shareScreen"],
+.popup-notification-icon[popupid="webRTC-sharingDevices"],
+.popup-notification-icon[popupid="webRTC-sharingMicrophone"],
+.popup-notification-icon[popupid="webRTC-sharingScreen"],
+.popup-notification-icon[popupid="web-notifications"] {
+ filter: url(chrome://browser/skin/filters.svg#fill);
+ fill: #A09090;
}
-.popup-notification-icon[popupid="addon-progress"] {
- list-style-image: url(chrome://browser/skin/addons/addon-install-downloading.svg);
+/* The first two selectors are used by socialchat.xml (bug 1275558). The
+ notifications in the chat window are only shown when they are in use. */
+.webRTC-sharingDevices-notification-icon,
+.webRTC-sharingMicrophone-notification-icon,
+.in-use {
+ fill: #008484;
}
-.popup-notification-icon[popupid="addon-install-failed"] {
- list-style-image: url(chrome://browser/skin/addons/addon-install-error.svg);
+.popup-notification-icon[popupid="web-notifications"],
+.desktop-notification-icon {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#desktop-notification);
}
-.popup-notification-icon[popupid="addon-install-confirmation"] {
- list-style-image: url(chrome://browser/skin/addons/addon-install-confirm.svg);
+.desktop-notification-icon.blocked {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#desktop-notification-blocked);
}
-#addon-install-confirmation-notification[warning] .popup-notification-icon[popupid="addon-install-confirmation"] {
- list-style-image: url(chrome://browser/skin/addons/addon-install-warning.svg);
+.geo-icon {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#geo-windows);
}
-.popup-notification-icon[popupid="addon-install-complete"] {
- list-style-image: url(chrome://browser/skin/addons/addon-install-installed.svg);
+.geo-icon.blocked {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#geo-windows-blocked);
}
-.popup-notification-icon[popupid="addon-install-restart"] {
- list-style-image: url(chrome://browser/skin/addons/addon-install-restart.svg);
+.popup-notification-icon[popupid="geolocation"] {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#geo-windows-detailed);
}
-.popup-notification-icon[popupid="click-to-play-plugins"] {
- list-style-image: url("chrome://mozapps/skin/plugins/pluginBlocked-64.png");
+.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
+.indexedDB-icon {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#indexedDB);
}
-.popup-notification-icon[popupid="web-notifications"] {
- list-style-image: url("chrome://browser/skin/web-notifications-icon.svg");
+.indexedDB-icon.blocked {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#indexedDB-blocked);
}
-.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
-.popup-notification-icon[popupid*="offline-app-requested"],
-.popup-notification-icon[popupid="offline-app-usage"] {
- list-style-image: url("chrome://global/skin/icons/alert-question.gif");
+.login-icon {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#login);
}
.popup-notification-icon[popupid="password"] {
- list-style-image: url("chrome://mozapps/skin/passwordmgr/key-64.png");
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#login-detailed);
}
-.popup-notification-icon[popupid="webRTC-sharingDevices"],
-.popup-notification-icon[popupid="webRTC-shareDevices"] {
- list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png");
+#login-fill-notification-icon {
+ /* Temporary solution until the capture and fill doorhangers are unified. */
+ transform: scaleX(-1);
}
-.popup-notification-icon[popupid="webRTC-sharingMicrophone"],
-.popup-notification-icon[popupid="webRTC-shareMicrophone"] {
- list-style-image: url("chrome://browser/skin/webRTC-shareMicrophone-64.png");
+/* The first selector is used by socialchat.xml (bug 1275558). */
+.webRTC-sharingDevices-notification-icon,
+.camera-icon,
+.popup-notification-icon[popupid="webRTC-shareDevices"],
+.popup-notification-icon[popupid="webRTC-sharingDevices"] {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#camera);
}
-.popup-notification-icon[popupid="webRTC-sharingScreen"],
-.popup-notification-icon[popupid="webRTC-shareScreen"] {
- list-style-image: url(chrome://browser/skin/webRTC-shareScreen-64.png);
+.camera-icon.blocked {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#camera-blocked);
}
-.popup-notification-icon[popupid="pointerLock"] {
- list-style-image: url("chrome://browser/skin/pointerLock-64.png");
+/* The first selector is used by socialchat.xml (bug 1275558). */
+.webRTC-sharingMicrophone-notification-icon,
+.microphone-icon {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#microphone);
}
-/* Notification icon box */
-#notification-popup .panel-promo-box {
-/* margin: 10px -10px -10px; */
+.microphone-icon.blocked {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#microphone-blocked);
}
-#notification-popup-box {
- position: relative;
- background-color: #000000;
- background-clip: padding-box;
- padding-left: 3px;
- padding-right: 8px;
- border-radius: 3px 0 0 3px;
- border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 / 0 8px 0 0;
- margin-inline-end: -8px;
- border-right-width: 8px;
+.popup-notification-icon[popupid="webRTC-shareMicrophone"],
+.popup-notification-icon[popupid="webRTC-sharingMicrophone"] {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#microphone-detailed);
}
-window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] + #urlbar > #notification-popup-box {
-/* padding-left: 7px; */
+.popup-notification-icon[popupid="webRTC-shareScreen"],
+.popup-notification-icon[popupid="webRTC-sharingScreen"],
+.screen-icon {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#screen);
}
-/* This changes the direction of the main notification box on the url bar. */
-#notification-popup-box:-moz-locale-dir(rtl),
-/* This adds a second flip for the notification anchors, as they don't switch direction
- for RTL mode. */
-.notification-anchor-icon:-moz-locale-dir(rtl) {
- transform: scaleX(-1);
+.screen-icon.blocked {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#screen-blocked);
}
-/* For the anchor icons in the chat window, we don't have the notification popup box,
- so we need to cancel the RTL transform. */
-.notification-anchor-icon.chat-toolbarbutton:-moz-locale-dir(rtl) {
- transform: none;
+.popup-notification-icon[popupid="pointerLock"],
+.pointerLock-icon {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#pointerLock);
}
-.notification-anchor-icon {
- list-style-image: url("chrome://global/skin/icons/information-16.png");
+.pointerLock-icon.blocked {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#pointerLock-blocked);
+}
- width: 16px;
- height: 16px;
- margin: 0 2px;
+/* 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");
}
-.notification-anchor-icon:-moz-focusring {
- outline: 1px dotted #008484;
+/* EME */
+
+.popup-notification-icon[popupid="drmContentPlaying"],
+.drm-icon {
+ list-style-image: url("chrome://browser/skin/drm-icon.svg#chains");
+}
+
+.drm-icon:hover:active {
+ list-style-image: url("chrome://browser/skin/drm-icon.svg#chains-pressed");
+}
+
+#eme-notification-icon[firstplay=true] {
+ animation: emeTeachingMoment 0.2s linear 0s 5 normal;
}
-.geo-notification-icon,
-#geo-notification-icon {
- list-style-image: url("chrome://browser/skin/Geolocation-16.png");
+@keyframes emeTeachingMoment {
+ 0% {transform: translateX(0); }
+ 25% {transform: translateX(3px) }
+ 75% {transform: translateX(-3px) }
+ 100% { transform: translateX(0); }
}
-#addons-notification-icon {
+/* INSTALL ADDONS */
+
+.install-icon {
list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#default);
}
-#addons-notification-icon:hover {
- list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#hover);
+.popup-notification-icon[popupid="xpinstall-disabled"],
+.popup-notification-icon[popupid="addon-install-blocked"],
+.popup-notification-icon[popupid="addon-install-origin-blocked"] {
+ list-style-image: url(chrome://browser/skin/addons/addon-install-blocked.svg);
}
-#addons-notification-icon:hover:active {
- list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#active);
+.popup-notification-icon[popupid="addon-progress"] {
+ list-style-image: url(chrome://browser/skin/addons/addon-install-downloading.svg);
}
-.indexedDB-notification-icon,
-#indexedDB-notification-icon {
- list-style-image: url("chrome://global/skin/icons/question-16.png");
+.popup-notification-icon[popupid="addon-install-failed"] {
+ list-style-image: url(chrome://browser/skin/addons/addon-install-error.svg);
}
-#password-notification-icon {
- list-style-image: url("chrome://mozapps/skin/passwordmgr/key-16.png");
+.popup-notification-icon[popupid="addon-install-confirmation"] {
+ list-style-image: url(chrome://browser/skin/addons/addon-install-confirm.svg);
}
-#login-fill-notification-icon {
- /* Temporary icon until the capture and fill doorhangers are unified. */
- list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png);
- transform: scaleX(-1);
+#addon-install-confirmation-notification[warning] .popup-notification-icon[popupid="addon-install-confirmation"] {
+ list-style-image: url(chrome://browser/skin/addons/addon-install-warning.svg);
}
-#plugins-notification-icon {
- list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
+.popup-notification-icon[popupid="addon-install-complete"] {
+ list-style-image: url(chrome://browser/skin/addons/addon-install-installed.svg);
}
-#plugins-notification-icon.plugin-hidden {
- list-style-image: url("chrome://browser/skin/notification-pluginAlert.png");
+.popup-notification-icon[popupid="addon-install-restart"] {
+ list-style-image: url(chrome://browser/skin/addons/addon-install-restart.svg);
}
-#plugins-notification-icon.plugin-blocked {
- list-style-image: url("chrome://browser/skin/notification-pluginBlocked.png");
+.popup-notification-icon[popupid="click-to-play-plugins"] {
+ list-style-image: url(chrome://mozapps/skin/plugins/pluginBlocked-64.png);
}
-#plugins-notification-icon {
-/* -moz-image-region: rect(0, 16px, 16px, 0);*/
+/* OFFLINE APPS */
+
+.popup-notification-icon[popupid*="offline-app-requested"],
+.popup-notification-icon[popupid="offline-app-usage"] {
+ list-style-image: url(chrome://global/skin/icons/question-64.png);
+}
+
+/* PLUGINS */
+
+.plugin-icon {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin);
}
-#plugins-notification-icon:hover {
-/* -moz-image-region: rect(0, 32px, 16px, 16px);*/
+.plugin-icon.plugin-blocked {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin-blocked);
+ fill: #FF0000 !important; /* important! to override the default hover color */
}
#notification-popup-box[hidden] {
}
}
-.webRTC-shareDevices-notification-icon,
-#webRTC-shareDevices-notification-icon {
- list-style-image: url("chrome://browser/skin/webRTC-shareDevice-16.png");
-}
+/* SOCIAL API */
-.webRTC-sharingDevices-notification-icon,
-#webRTC-sharingDevices-notification-icon {
- list-style-image: url("chrome://browser/skin/webRTC-sharingDevice-16.png");
-}
-
-.webRTC-shareMicrophone-notification-icon,
-#webRTC-shareMicrophone-notification-icon {
- list-style-image: url("chrome://browser/skin/webRTC-shareMicrophone-16.png");
-}
-
-.webRTC-sharingMicrophone-notification-icon,
-#webRTC-sharingMicrophone-notification-icon {
- list-style-image: url("chrome://browser/skin/webRTC-sharingMicrophone-16.png");
-}
-
-.webRTC-shareScreen-notification-icon,
-#webRTC-shareScreen-notification-icon {
- list-style-image: url(chrome://browser/skin/webRTC-shareScreen-16.png);
-}
-
-.webRTC-sharingScreen-notification-icon,
-#webRTC-sharingScreen-notification-icon {
- list-style-image: url(chrome://browser/skin/webRTC-sharingScreen-16.png);
-}
-
-.web-notifications-notification-icon,
-#web-notifications-notification-icon {
- list-style-image: url("chrome://browser/skin/web-notifications-tray.svg");
- -moz-image-region: rect(0, 16px, 16px, 0);
-}
-
-.web-notifications-notification-icon:hover,
-#web-notifications-notification-icon:hover {
- -moz-image-region: rect(0, 32px, 16px, 16px);
+.popup-notification-icon[popupid="servicesInstall"] {
+ list-style-image: url(chrome://browser/skin/social/services-64.png);
}
-.web-notifications-notification-icon:hover:active,
-#web-notifications-notification-icon:hover:active {
- -moz-image-region: rect(0, 48px, 16px, 32px);
+.service-icon {
+ list-style-image: url(chrome://browser/skin/social/services-16.png);
}
-#pointerLock-notification-icon {
- list-style-image: url("chrome://browser/skin/pointerLock-16.png");
-}
+/* TRANSLATION */
-.translate-notification-icon,
-#translate-notification-icon {
- list-style-image: url("chrome://browser/skin/translation-16.png");
+.translation-icon {
+ list-style-image: url(chrome://browser/skin/translation-16.png);
-moz-image-region: rect(0px, 16px, 16px, 0px);
}
-.translated-notification-icon,
-#translated-notification-icon {
- list-style-image: url("chrome://browser/skin/translation-16.png");
+.translation-icon.in-use {
-moz-image-region: rect(0px, 32px, 16px, 16px);
}
-.popup-notification-icon[popupid="servicesInstall"] {
- list-style-image: url("chrome://browser/skin/social/services-64.png");
-}
-#servicesInstall-notification-icon {
- list-style-image: url("chrome://browser/skin/social/services-16.png");
-}
-
-/* EME notifications */
-
-.popup-notification-icon[popupid="drmContentPlaying"],
-#eme-notification-icon {
- list-style-image: url("chrome://browser/skin/drm-icon.svg#chains");
-}
-
-#eme-notification-icon:hover:active {
- list-style-image: url("chrome://browser/skin/drm-icon.svg#chains-pressed");
-}
-
-#eme-notification-icon[firstplay=true] {
- animation: emeTeachingMoment 0.2s linear 0s 5 normal;
-}
-
-@keyframes emeTeachingMoment {
- 0% {transform: translateX(0); }
- 25% {transform: translateX(3px) }
- 75% {transform: translateX(-3px) }
- 100% { transform: translateX(0); }
-}
-
-/* HiDPI notification icons */
-@media (min-resolution: 1.1dppx) {
-/* #notification-popup-box {
- border-image: url("chrome://browser/skin/urlbar-arrow@2x.png") 0 16 0 0 fill;
- }
-*/
- .notification-anchor-icon {
- list-style-image: url(chrome://global/skin/icons/information-32.png);
- }
-
- .webRTC-shareDevices-notification-icon,
- #webRTC-shareDevices-notification-icon {
- list-style-image: url(chrome://browser/skin/webRTC-shareDevice-16@2x.png);
- }
-
- .webRTC-sharingDevices-notification-icon,
- #webRTC-sharingDevices-notification-icon {
- list-style-image: url(chrome://browser/skin/webRTC-sharingDevice-16@2x.png);
- }
-
- .webRTC-shareMicrophone-notification-icon,
- #webRTC-shareMicrophone-notification-icon {
- list-style-image: url(chrome://browser/skin/webRTC-shareMicrophone-16@2x.png);
- }
-
- .webRTC-sharingMicrophone-notification-icon,
- #webRTC-sharingMicrophone-notification-icon {
- list-style-image: url(chrome://browser/skin/webRTC-sharingMicrophone-16@2x.png);
- }
-
- .webRTC-shareScreen-notification-icon,
- #webRTC-shareScreen-notification-icon {
- list-style-image: url(chrome://browser/skin/webRTC-shareScreen-16@2x.png);
- }
-
- .webRTC-sharingScreen-notification-icon,
- #webRTC-sharingScreen-notification-icon {
- list-style-image: url(chrome://browser/skin/webRTC-sharingScreen-16@2x.png);
- }
-
- .popup-notification-icon[popupid="webRTC-sharingDevices"],
- .popup-notification-icon[popupid="webRTC-shareDevices"] {
- list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64@2x.png);
- }
-
- .popup-notification-icon[popupid="webRTC-sharingMicrophone"],
- .popup-notification-icon[popupid="webRTC-shareMicrophone"] {
- list-style-image: url(chrome://browser/skin/webRTC-shareMicrophone-64@2x.png);
- }
-
- .popup-notification-icon[popupid="webRTC-sharingScreen"],
- .popup-notification-icon[popupid="webRTC-shareScreen"] {
- list-style-image: url(chrome://browser/skin/webRTC-shareScreen-64@2x.png);
- }
-}
-
/* === END notification-icons.inc.css === */
.popup-notification-body[popupid="addon-progress"],
-moz-image-region: auto;
}
-/* ::::: Keyboard UI Panel ::::: */
-
-.KUI-panel {
- color: #FF9F00;
- border-style: none;
- border-radius: 20px;
-}
-
-.KUI-panel[level="top"] {
- /*background-color: rgba(27%,27%,27%,.65);*/
-}
-
/* Ctrl-Tab */
#ctrlTab-panel {
+ -moz-appearance: none;
+ background: rgba(0%,0%,0%,.7);
+ color: #FF9F00;
+ border-style: none;
padding: 20px 10px 10px;
font-weight: bold;
}
}
.ctrlTab-preview-inner > .tabPreview-canvas {
+/* box-shadow: 1px 1px 2px hsl(0,0%,12%);*/
}
.ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
margin-top: .5em;
}
-/* Sync Panel */
-
-.sync-panel-icon {
- height:32px;
- width: 32px;
- background: url("chrome://browser/content/abouthome/sync.png") top left no-repeat;
-}
-
-.sync-panel-inner {
- width: 0;
- padding-left: 10px;
-}
-
-.sync-panel-button-box {
- margin-top: 1em;
-}
-
-#sync-start-panel-title {
- font-size: 120%;
- font-weight: bold;
- margin-bottom: 5px;
-}
-
-#sync-start-panel-subtitle {
- margin-bottom: 0;
-}
-
/* Status panel */
.statuspanel-label {
/* === BEGIN fullscreen/warning.inc.css === */
-html|*#fullscreen-warning {
+html|*.pointerlockfswarning {
align-items: center;
background: rgba(0, 0, 0, 0.9);
border: 2px solid #A09090;
font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
}
-html|*#fullscreen-warning::before {
+html|*.pointerlockfswarning::before {
margin: 0;
width: 24px; height: 24px;
}
-html|*#fullscreen-warning.verifiedIdentity::before,
-html|*#fullscreen-warning.verifiedDomain::before {
+html|*.pointerlockfswarning[data-identity="verifiedIdentity"]::before,
+html|*.pointerlockfswarning[data-identity="verifiedDomain"]::before {
content: url("chrome://browser/skin/fullscreen/secure.svg");
}
-html|*#fullscreen-warning.unknownIdentity::before {
+html|*.pointerlockfswarning[data-identity="unknownIdentity"]::before {
content: url("chrome://browser/skin/fullscreen/insecure.svg");
}
-html|*#fullscreen-domain-text,
-html|*#fullscreen-generic-text {
+html|*.pointerlockfswarning-domain-text,
+html|*.pointerlockfswarning-generic-text {
font-size: 21px;
font-weight: lighter;
color: #A09090;
margin: 0 16px;
}
-html|*#fullscreen-domain {
+html|*.pointerlockfswarning-domain {
font-weight: bold;
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;
margin-inline-end: 5px;
}
-/* Social toolbar item */
-
-#social-notification-icon-mentions {
- background-color: #000000;
- border-radius: 3px;
- margin-inline-start: 2px;
-}
-
-#social-notification-icon-mentions:hover {
- background-color: #FFCF00;
-}
-
-#social-notification-icon-mentions[open="true"] {
- background-color: #FF9F00;
-}
-
-#social-sidebar-splitter {
- border: 0;
-}
-
-#socialActivatedNotification .popup-notification-button-container {
- margin-left: 6px;
-}
-
-.social-activation-icon {
- width: auto;
- height: auto;
- max-height: 64px;
- max-width: 64px;
-}
-
-#social-activation-message {
- max-width: 250px;
-}
-
-#social-activation-message > label {
- margin: 0;
-}
-
/* social toolbar provider menu */
.social-statusarea-popup {
margin-top: 0;
}
.messageImage[value="plugin-hidden"] {
- list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin);
+ filter: url(chrome://browser/skin/filters.svg#fill);
+ fill: #A09090;
}
/* Keep any changes to this style in sync with pluginProblem.css */
}
notification.pluginVulnerable .messageImage {
- list-style-image: url("chrome://browser/skin/notification-pluginBlocked.png");
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin-blocked);
+ filter: url(chrome://browser/skin/filters.svg#fill);
+ fill: #FF0000;
}
/* === END plugin-doorhanger.inc.css === */
/* Customization mode */
+:root {
+ --drag-drop-transition-duration: .3s;
+}
+
#main-window:-moz-any([customize-entering],[customize-entered]) #browser-bottombox {
margin-bottom: 1em;
}
.panel-customization-placeholder,
toolbarpaletteitem[place="palette"],
toolbarpaletteitem[place="panel"] {
- transition: transform .3s ease-in-out;
+ transition: transform var(--drag-drop-transition-duration) ease-in-out;
}
#customization-palette {
opacity: 1;
}
+toolbarpaletteitem toolbarbutton[disabled] {
+/* color: inherit !important;*/
+}
+
toolbarpaletteitem[notransition].panel-customization-placeholder,
toolbarpaletteitem[notransition][place="toolbar"],
toolbarpaletteitem[notransition][place="palette"],
toolbarpaletteitem > toolbarbutton > .toolbarbutton-badge-stack > .toolbarbutton-icon,
toolbarpaletteitem > toolbaritem.panel-wide-item,
toolbarpaletteitem > toolbarbutton[type="menu-button"] {
- transition: transform .3s cubic-bezier(.6, 2, .75, 1.5) !important;
+ transition: transform var(--drag-drop-transition-duration) cubic-bezier(.6, 2, .75, 1.5) !important;
}
toolbarpaletteitem[mousedown] > toolbarbutton > .toolbarbutton-icon,
toolbarpaletteitem[place="palette"]:-moz-focusring,
toolbarpaletteitem[place="panel"]:-moz-focusring,
toolbarpaletteitem[place="toolbar"]:-moz-focusring {
+ outline-width: 0;
+}
+
+toolbarpaletteitem[place="palette"]:not([mousedown="true"]):-moz-focusring,
+toolbarpaletteitem[place="panel"]:not([mousedown="true"]):-moz-focusring,
+toolbarpaletteitem[place="toolbar"]:not([mousedown="true"]):-moz-focusring {
+ /* Delay adding the focusring back until after the transform transition completes. */
+ transition: outline-width .01s linear var(--drag-drop-transition-duration);
outline: 1px dotted #A09090;
- outline-offset: -5px;
-moz-outline-radius: 2.5px;
}
+toolbarpaletteitem[place="toolbar"]:not([mousedown="true"]):-moz-focusring {
+ outline-offset: -5px;
+}
+
#wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton,
#wrapper-edit-controls[place="palette"] > #edit-controls > separator,
#wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton,
}
#UITourTooltipBody {
- margin-inline-end: 14px;
- margin-inline-start: 14px;
- margin-top: -16px;
- margin-bottom: 8px;
+ -moz-box-align: start;
+}
+
+#UITourTooltipTitleContainer {
+ -moz-box-align: start;
+ margin-bottom: 10px;
}
#UITourTooltipIcon {
width: 48px;
height: 48px;
- margin-inline-start: 14px;
- margin-inline-end: 14px;
+ margin-inline-end: 10px;
}
#UITourTooltipTitle,
#UITourTooltipTitle {
font-size: 1.45rem;
font-weight: bold;
- margin-inline-start: 0;
- /* Avoid the title overlapping the close button */
- margin-inline-end: 14px;
- margin-top: 0;
- margin-bottom: 9px;
+ margin: 0;
}
#UITourTooltipDescription {
background-color: rgba(0,0,0,.2);
border-top: 1px solid rgba(0,0,0,.4);
margin: 10px -16px -16px;
- padding: 2em 15px;
+ padding: 16px;
}
#UITourTooltipButtons > label,
margin-inline-start: 0;
}
+#UITourTooltipButtons > label:last-child,
+#UITourTooltipButtons > button:last-child {
+ margin-inline-end: 0;
+}
+
#UITourTooltipButtons > button[image] > .button-box > .button-icon {
width: 16px;
height: 16px;
background-image: url(chrome://browser/skin/controlcenter/permissions.svg);
}
-#identity-popup-permission-list menulist {
- min-width: 60px;
+#identity-popup-permissions-headline {
+ /* Make sure the label is as tall as the icon so that the permission list
+ which is aligned with the icon doesn't cover it up. */
+ min-height: 24px;
+}
+
+#identity-popup-permission-list {
+ /* Offset the padding set on #identity-popup-permissions-content so that it
+ shows up just below the section. The permission icons are 16px wide and
+ should be right aligned with the section icon. */
+ margin-inline-start: calc(-1em - 16px);
+}
+
+.identity-popup-permission-item {
+ min-height: 24px;
}
#identity-popup-permission-list:not(:empty) {
display: none;
}
+.identity-popup-permission-icon {
+ width: 16px;
+ height: 16px;
+}
+
.identity-popup-permission-label {
- margin-inline-start: 0;
- word-wrap: break-word;
+ margin-inline-start: 1em;
+}
+
+.identity-popup-permission-state-label {
+ text-align: end;
+ opacity: 0.6;
+}
+
+.identity-popup-permission-remove-button {
+ margin: 0;
+ border-width: 0;
+ border-radius: 50%;
+ min-width: 0;
+ padding: 2px;
+ background-color: transparent;
+}
+
+.identity-popup-permission-remove-button > .button-box {
+ padding: 0;
+}
+
+.identity-popup-permission-remove-button > .button-box > .button-icon {
+ margin: 0;
+ width: 16px;
+ height: 16px;
+ list-style-image: url(chrome://browser/skin/panel-icons.svg#cancel);
+ filter: url(chrome://browser/skin/filters.svg#fill);
+ fill: #A09090;
+}
+
+.identity-popup-permission-remove-button > .button-box > .button-text {
+ display: none;
+}
+
+.identity-popup-permission-remove-button:not(:-moz-focusring):hover {
+ background-color: #FFCF00;
+}
+
+.identity-popup-permission-remove-button:not(:-moz-focusring):hover > .button-box > .button-icon {
+ fill: #000000;
+}
+
+.identity-popup-permission-remove-button:not(:-moz-focusring):hover:active {
+ background-color: #FF9F00;
}
/* === END panel.inc.css === */
panelview[id^=PanelUI-webext-] {
overflow: hidden;
- border-radius: 3.5px;
}
panelview:not([mainview]) .toolbarbutton-text,
border-bottom-left-radius: 4px;
}
-#main-window[customizing] #PanelUI-footer-fxa > toolbarseparator {
+#main-window[customizing] #PanelUI-footer-fxa {
display: none;
}
visibility: hidden;
}
+#PanelUI-containersItems > .subviewbutton > .toolbarbutton-icon {
+ width: 16px;
+ height: 16px;
+}
+
.panel-mainview[panelid=customizationui-widget-panel],
#customizationui-widget-multiview > .panel-viewcontainer,
#customizationui-widget-multiview > .panel-viewcontainer > .panel-viewstack,
+++ /dev/null
-/* 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/. */
-
-/* === BEGIN panelUIOverlay.inc.css === */
-
-:root {
- --panel-ui-exit-subview-gutter-width: 38px;
-}
-
-#PanelUI-popup #PanelUI-contents:empty {
- height: 128px;
-}
-
-#PanelUI-popup #PanelUI-contents:empty::before {
- content: "";
- background-image: url(chrome://browser/skin/customizableui/whimsy.png);
- background-size: 64px 64px;
- display: block;
- width: 64px;
- height: 64px;
- position: absolute;
- transition: transform 1s ease-out;
- animation: whimsyMoveX 3.05s linear 0s infinite alternate,
- whimsyMoveY 3.4s linear 0s infinite alternate;
-}
-
-#PanelUI-popup #PanelUI-contents:not(:hover):empty::before {
- filter: grayscale(100%);
-}
-
-#PanelUI-popup #PanelUI-contents:active:empty::before {
- animation: whimsyMoveX 3.05s linear 0s infinite alternate,
- whimsyMoveY 3.4s linear 0s infinite alternate,
- whimsyRotate 1s linear 0s infinite normal;
-}
-
-#PanelUI-popup #PanelUI-contents:-moz-locale-dir(rtl):empty::before {
- animation: whimsyMoveXRTL 3.05s linear 0s infinite alternate,
- whimsyMoveY 3.4s linear 0s infinite alternate;
-}
-
-#PanelUI-popup #PanelUI-contents:-moz-locale-dir(rtl):active:empty::before {
- animation: whimsyMoveXRTL 3.05s linear 0s infinite alternate,
- whimsyMoveY 3.4s linear 0s infinite alternate,
- whimsyRotate 1s linear 0s infinite normal;
-}
-
-@media (min-resolution: 2dppx) {
- #PanelUI-popup #PanelUI-contents:empty::before {
- background-image: url("chrome://browser/skin/customizableui/whimsy@2x.png");
- }
-}
-
-@keyframes whimsyMoveX {
- /* These values are adjusted for the padding on the panel. */
- from { margin-left: -9px; } to { margin-left: calc(100% - 55px); }
-}
-
-@keyframes whimsyMoveXRTL {
- /* These values are adjusted for the padding on the panel. */
- from { margin-right: -9px; } to { margin-right: calc(100% - 55px); }
-}
-
-@keyframes whimsyMoveY {
- /* These values are adjusted for the padding and height of the panel. */
- from { margin-top: -.5em; } to { margin-top: calc(64px - .5em); }
-}
-
-@keyframes whimsyRotate {
- to { transform: perspective(5000px) rotateY(360deg); }
-}
-
-#customization-panelHolder {
- border-radius: 4px;
-}
-
-#PanelUI-button {
- margin-inline-start: 3px;
-}
-
-#PanelUI-button:-moz-locale-dir(rtl) {
-}
-
-#PanelUI-menu-button[badge-status] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
- display: -moz-box;
- height: 10px;
- width: 10px;
- background-size: contain;
- border: none;
-}
-
-#PanelUI-menu-button[badge-status="download-success"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
- display: none;
-}
-
-#PanelUI-menu-button[badge-status="update-succeeded"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
- background: #008484 url(chrome://browser/skin/update-badge.svg) no-repeat center;
- height: 13px;
-}
-
-#PanelUI-menu-button[badge-status="download-severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge,
-#PanelUI-menu-button[badge-status="update-failed"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
- background: #FF0000 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center;
- height: 13px;
-}
-
-#PanelUI-menu-button[badge-status="download-warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge,
-#PanelUI-menu-button[badge-status="fxa-needs-authentication"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
- height: 13px;
- box-shadow: none;
-}
-
-#PanelUI-menu-button[badge-status="download-warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
- background: #FFBF00 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center;
-}
-
-#PanelUI-menu-button[badge-status="fxa-needs-authentication"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
- background: transparent url(chrome://browser/skin/warning.svg) no-repeat center;
-}
-
-#PanelUI-menu-button[badge-status="download-warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive,
-#PanelUI-menu-button[badge-status="fxa-needs-authentication"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive {
-}
-
-.panel-subviews {
- padding: 4px;
- margin-inline-start: var(--panel-ui-exit-subview-gutter-width);
-}
-
-.panel-viewstack[viewtype="main"] > .panel-subviews {
- transform: translateX(22.35em);
-}
-
-.panel-viewstack[viewtype="main"] > .panel-subviews:-moz-locale-dir(rtl) {
- transform: translateX(-22.35em);
-}
-
-panelmultiview[nosubviews=true] > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
- display: none;
-}
-
-.panel-viewstack:not([viewtype="main"]) > .panel-mainview > #PanelUI-mainView {
- -moz-box-flex: 1;
-}
-
-.panel-subview-body {
- overflow-y: auto;
- overflow-x: hidden;
- -moz-box-flex: 1;
-}
-
-#PanelUI-popup .panel-subview-body {
- margin: -4px;
- padding: 4px 4px;
-}
-
-.panel-subview-header,
-.subviewbutton.panel-subview-footer {
- box-sizing: border-box;
-/* min-height: 41px; */
- padding: 3px;
-}
-
-.panel-subview-header {
- margin: 0 0 4px;
- background-color: #A09090;
- color: #000000;
- font-variant: small-caps;
- border-radius: 4px;
-}
-
-.panel-subview-footer {
- border-top: 1px solid #A09090;
-}
-
-.cui-widget-panelview .panel-subview-header {
- display: none;
-}
-
-.cui-widget-panelview .subviewbutton.panel-subview-footer {
- margin: 4px 0 0;
- -moz-box-pack: center;
-}
-
-#PanelUI-mainView {
- display: flex;
- flex-direction: column;
- border-radius: 4px;
-}
-
-#PanelUI-popup > arrowscrollbox > autorepeatbutton {
- display: none;
-}
-#PanelUI-popup > arrowscrollbox > scrollbox {
- overflow: visible;
-}
-
-#PanelUI-popup > .panel-arrowcontainer > .panel-arrowcontent {
- overflow: hidden;
- padding: 0;
-}
-
-#PanelUI-contents {
- padding: .5em 0;
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-multiline-text {
-/* line-height: 1.2;*/
- max-height: 2.4em;
-}
-
-.panelUI-grid .toolbarbutton-1:not([auto-hyphens="off"]) > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
-.panelUI-grid .toolbarbutton-1:not([auto-hyphens="off"]) > .toolbarbutton-multiline-text {
- -moz-hyphens: auto;
-}
-
-.panelUI-grid:not([customize-transitioning]) .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
-.panelUI-grid:not([customize-transitioning]) .toolbarbutton-1 > .toolbarbutton-multiline-text {
- position: absolute;
- clip: rect(-0.1em, auto, 2.6em, auto);
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-text,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-multiline-text {
- text-align: center;
- /* Need to override toolkit theming which sets margin: 0 !important; */
- margin: 2px 0 0 !important;
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text {
- text-align: center;
- margin: -1px 0 0;
-}
-
-#wrapper-edit-controls:-moz-any([place="palette"],[place="panel"]) > #edit-controls,
-#wrapper-zoom-controls:-moz-any([place="palette"],[place="panel"]) > #zoom-controls {
- margin-inline-start: 0;
-}
-
-#PanelUI-contents {
- max-width: 22.35em;
-}
-
-#BMB_bookmarksPopup,
-.panel-mainview:not([panelid="PanelUI-popup"]) {
- max-width: 30em;
-}
-
-/* Give WebExtension stand-alone panels extra width for Chrome compatibility */
-.cui-widget-panel[viewId^=PanelUI-webext-] .panel-mainview {
- max-width: 800px;
-}
-
-.cui-widget-panel[viewId^=PanelUI-webext-] > .panel-arrowcontainer > .panel-arrowcontent {
- padding: 0;
-}
-
-.cui-widget-panelview[id^=PanelUI-webext-] {
- border-radius: 3.5px;
-}
-
-panelview:not([mainview]) .toolbarbutton-text,
-.cui-widget-panel toolbarbutton > .toolbarbutton-text {
- text-align: start;
- display: -moz-box;
-}
-
-.cui-widget-panel > .panel-arrowcontainer > .panel-arrowcontent {
- padding: 0;
-}
-
-.cui-widget-panel.cui-widget-panelWithFooter > .panel-arrowcontainer > .panel-arrowcontent {
- padding-bottom: 0;
-}
-
-.cui-widget-panel > :-moz-any(menu,menuitem,toolbarbutton):first-child {
- border-radius: 4px 4px 0 0;
-}
-
-.cui-widget-panel > :-moz-any(menu,menuitem,toolbarbutton):last-child {
- border-radius: 0 0 4px 4px;
-}
-
-#PanelUI-contents {
- display: block;
- flex: 1 0 auto;
- margin-left: auto;
- margin-right: auto;
- max-width: 22.35em;
-}
-
-#PanelUI-contents-scroller {
- overflow-y: auto;
- overflow-x: hidden;
- width: 22.35em;
- flex: auto;
-}
-
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton > .toolbarbutton-icon {
- min-width: 0;
- min-height: 0;
- margin: 0;
-}
-
-toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item),
-.panelUI-grid .toolbarbutton-1,
-.panel-customization-placeholder-child {
- -moz-appearance: none;
- -moz-box-orient: vertical;
- width: calc(22.35em / 3 - 0.1px - 2px); /* LCARStrek: XXX: found out to be needed to fit the icons */
- height: calc(51px + 2.2em);
-}
-
-/* In order to have button labels constrained appropriately, items inside the toolbarpaletteitem
- * should have a min-width set so they abide by the width set above (which they do outside of
- * customize mode because they're in a flexed container) */
-toolbarpaletteitem[place="panel"]:not([haswideitem=true]) > .toolbarbutton-1 {
- min-width: 0.01px;
-}
-
-/* Help SDK buttons fit in. */
-toolbarpaletteitem[place="palette"] > toolbarbutton[constrain-size="true"] > .toolbarbutton-icon,
-toolbarpaletteitem[place="palette"] > toolbarbutton[constrain-size="true"] > .toolbarbutton-badge-stack > .toolbarbutton-icon,
-toolbarbutton[constrain-size="true"][cui-areatype="menu-panel"] > .toolbarbutton-icon,
-toolbarbutton[constrain-size="true"][cui-areatype="menu-panel"] > .toolbarbutton-badge-stack > .toolbarbutton-icon {
- height: 32px;
- width: 32px;
-}
-
-.customization-palette .toolbarbutton-1 {
- -moz-appearance: none;
- -moz-box-orient: vertical;
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button {
- -moz-appearance: none;
- -moz-box-orient: vertical;
- width: calc(22.35em / 3 - 0.1px - 2px);
- height: calc(49px + 2.2em);
- border: 0;
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-text,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text {
- margin-top: 2px; /* Hack needed to get the label of type=menu-button aligned with other buttons */
-}
-
-.panel-customization-placeholder-child {
- margin: 6px 0 0;
-/* padding: 2px 6px;*/
-}
-
-.panelUI-grid .toolbarbutton-1[type="menu"] {
- background-image: url("chrome://global/skin/arrow/arrow-down-sharp.gif");
- background-position: right 3px top 16px;
- background-repeat: no-repeat;
-}
-
-.panelUI-grid .toolbarbutton-1[type="menu"]:-moz-locale-dir(rtl) {
- background-position: left 3px top 16px;
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
- display: none;
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
- -moz-box-align: center;
- width: 16px;
- margin-inline-start: -16px;
- height: 51px;
- margin-bottom: 2.2em;
- padding: 0;
-}
-
-.panelUI-grid .toolbarbutton-1:not([buttonover]):not([disabled]):-moz-any([open],:hover:active) > .toolbarbutton-menubutton-dropmarker {
- border-radius: 0 0 0 2px;
-}
-
-.panelUI-grid .toolbarbutton-1:not([buttonover]):not([disabled]):-moz-any([open],:hover:active)> .toolbarbutton-menubutton-dropmarker:-moz-locale-dir(rtl) {
- border-radius: 0 0 2px 0;
-}
-
-#main-window:not([customizing]) .panel-combined-button[disabled] > .toolbarbutton-icon {
-/* opacity: .5; */
-}
-
-toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) {
- width: calc(22.35em / 3 - 0.1px);
- margin: 0 !important;
-}
-
-toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) {
- -moz-box-align: center;
- -moz-box-pack: center;
-}
-
-toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] > iframe {
- margin: 4px auto;
-}
-
-#PanelUI-multiView[viewtype="subview"] > .panel-viewcontainer > .panel-viewstack > .panel-mainview > #PanelUI-mainView {
-}
-
-#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-contents-scroller > #PanelUI-contents > .panel-wide-item,
-#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-contents-scroller > #PanelUI-contents > .toolbarbutton-1:not([panel-multiview-anchor="true"]),
-#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-update-status,
-#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-fxa > #PanelUI-fxa-status > #PanelUI-fxa-avatar,
-#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-fxa > #PanelUI-fxa-status > #PanelUI-fxa-label,
-#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-fxa > #PanelUI-fxa-icon,
-#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-inner > toolbarseparator,
-#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-inner > #PanelUI-customize,
-#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-inner > #PanelUI-help:not([panel-multiview-anchor="true"]) {
- opacity: .5;
-}
-
-/*
- * XXXgijs: this is a workaround for a layout issue that was caused by these iframes,
- * which was affecting subview display. Because of this, we're hiding the iframe *only*
- * when displaying a subview. The discerning user might notice this, but it's not nearly
- * as bad as the brokenness.
- * This hack should be removed once https://bugzilla.mozilla.org/show_bug.cgi?id=975375
- * is addressed.
- */
-#PanelUI-multiView[viewtype="subview"] toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > iframe {
- visibility: hidden;
-}
-
-toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text {
- text-align: center;
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-icon,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-badge-stack,
-.customization-palette .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
-.customization-palette .toolbarbutton-1 > .toolbarbutton-icon,
-.customization-palette .toolbarbutton-1 > .toolbarbutton-badge-stack,
-.panelUI-grid #bookmarks-toolbar-placeholder > .toolbarbutton-icon,
-.customization-palette #bookmarks-toolbar-placeholder > .toolbarbutton-icon,
-.panel-customization-placeholder-child > .toolbarbutton-icon {
- min-width: 32px;
- min-height: 32px;
- /* Explanation for the below formula (A / B - C)
- A
- Each button is 22.35em / 3 - 0.1px wide
- B
- Each button has two margins.
- C (44px / 2 = 22px)
- The button icon is 32 pixels wide.
- The button has 12px of horizontal padding (6 on each side).
- The button has 0px of horizontal border (0 on each side).
- Total width of button's icon + button padding should therefore be 44px,
- which means each horizontal margin should be the half the button's width - (44/2) px.
- */
- margin: 4px calc((22.35em / 3 - 0.1px) / 2 - 22px);
-}
-
-/* above we treat the container as the icon for the margins, that is so the
-/* badge itself is positioned correctly. Here we make sure that the icon itself
-/* has the minum size we want, but no padding/margin. */
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-badge-stack > .toolbarbutton-icon,
-.customization-palette .toolbarbutton-1 > .toolbarbutton-badge-stack > .toolbarbutton-icon {
- width: 32px;
- height: 32px;
- min-width: 32px;
- min-height: 32px;
- margin: 0;
- padding: 0;
-}
-
-toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
- -moz-box-flex: 1;
-}
-
-#personal-bookmarks[overflowedItem=true] > #bookmarks-toolbar-placeholder {
- -moz-box-flex: 1;
-}
-
-#personal-bookmarks[cui-areatype="toolbar"][overflowedItem=true] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
- margin-inline-end: 2px;
-}
-
-#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button,
-#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-reset-button {
- border-left: none;
- border-right: none;
- border-radius: 0;
-}
-
-#zoom-in-button > .toolbarbutton-text,
-#zoom-out-button > .toolbarbutton-text,
-#zoom-reset-button > .toolbarbutton-icon {
- display: none;
-}
-
-#PanelUI-footer {
- display: flex;
- flex-shrink: 0;
- flex-direction: column;
-/* background-color: hsla(210,4%,10%,.07);*/
- padding: 0;
- margin: 0;
-/* min-height: 4em;*/
- border-bottom-right-radius: 4px;
- border-bottom-left-radius: 4px;
-}
-
-#main-window[customizing] #PanelUI-footer-fxa > toolbarseparator {
- display: none;
-}
-
-#PanelUI-footer-fxa:not([fxastatus="signedin"]) > toolbarseparator,
-#PanelUI-footer-fxa:not([fxastatus="signedin"]) > #PanelUI-fxa-icon,
-#PanelUI-footer-fxa:not([fxaprofileimage]) > #PanelUI-fxa-status > #PanelUI-fxa-avatar {
- display: none;
-}
-
-#PanelUI-footer-fxa[fxastatus="error"] > #PanelUI-fxa-status::after {
- content: url("chrome://browser/skin/warning.svg");
- width: 47px;
- padding-top: 1px;
- display: block;
- text-align: center;
- position: relative;
- top: 25%;
-}
-
-#PanelUI-update-status[update-status]::after {
- content: "";
- width: 14px;
- height: 14px;
- margin-right: 16.5px;
- border-radius: 2px;
- background-size: contain;
- display: -moz-box;
-}
-
-#PanelUI-update-status[update-status="succeeded"]::after {
- background-image: url(chrome://browser/skin/update-badge.svg);
- background-color: #008484;
-}
-
-#PanelUI-update-status[update-status="failed"]::after {
- background-image: url(chrome://browser/skin/update-badge-failed.svg);
- background-color: #FF0000;
-}
-
-#PanelUI-fxa-status {
- display: flex;
- flex: 1 1 0%;
- width: 1px;
-}
-
-#PanelUI-footer-inner,
-#PanelUI-footer-fxa:not([hidden]) {
- display: flex;
- border-top: 1px solid #9C9CFF;
-}
-
-#PanelUI-multiView[viewtype="subview"] #PanelUI-footer-inner,
-#PanelUI-multiView[viewtype="subview"] #PanelUI-footer-fxa {
- position: relative;
-}
-
-#PanelUI-footer-inner > toolbarseparator,
-#PanelUI-footer-fxa > toolbarseparator {
- border: 0;
- border-left: 1px solid #9C9CFF;
- margin: 0;
-}
-
-#PanelUI-footer-inner:hover > toolbarseparator,
-#PanelUI-footer-fxa:hover > toolbarseparator {
-/* margin: 0;*/
-}
-
-#PanelUI-update-status,
-#PanelUI-help,
-#PanelUI-fxa-label,
-#PanelUI-fxa-icon,
-#PanelUI-customize,
-#PanelUI-quit {
- margin: 0;
- padding: 11px 0;
- box-sizing: border-box;
- min-height: 40px;
- box-shadow: none;
- border: none;
- border-radius: 0;
- transition: background-color;
- -moz-box-orient: horizontal;
-}
-
-#PanelUI-update-status {
- border-top: 1px solid #9C9CFF;
- border-bottom: 1px solid transparent;
- margin-bottom: -1px;
-}
-
-#PanelUI-update-status > .toolbarbutton-text {
- width: 0; /* Fancy cropping solution for flexbox. */
-}
-
-#PanelUI-help[panel-multiview-anchor="true"] {
- -moz-image-region: rect(0, 32px, 16px, 16px);
-}
-
-#PanelUI-help,
-#PanelUI-quit {
- min-width: 44px;
-}
-
-#PanelUI-update-status > .toolbarbutton-text,
-#PanelUI-fxa-label > .toolbarbutton-text,
-#PanelUI-customize > .toolbarbutton-text {
- margin: 0;
- padding: 0 6px;
- text-align: start;
-}
-
-#PanelUI-help > .toolbarbutton-text,
-#PanelUI-quit > .toolbarbutton-text,
-#PanelUI-fxa-avatar > .toolbarbutton-text {
- display: none;
-}
-
-#PanelUI-update-status > .toolbarbutton-icon,
-#PanelUI-fxa-label > .toolbarbutton-icon,
-#PanelUI-fxa-icon > .toolbarbutton-icon,
-#PanelUI-customize > .toolbarbutton-icon,
-#PanelUI-help > .toolbarbutton-icon,
-#PanelUI-quit > .toolbarbutton-icon {
- margin-inline-end: 0;
-}
-
-#PanelUI-fxa-icon {
- padding-inline-start: 15px;
- padding-inline-end: 15px;
-}
-
-#PanelUI-fxa-label,
-#PanelUI-customize {
- flex: 1;
- padding-inline-start: 15px;
- border-inline-start-style: none;
-}
-
-#PanelUI-footer-fxa[fxaprofileimage="set"] > #PanelUI-fxa-status > #PanelUI-fxa-label,
-#PanelUI-footer-fxa[fxaprofileimage="enabled"]:not([fxastatus="error"]) > #PanelUI-fxa-status > #PanelUI-fxa-label {
- padding-inline-start: 0px;
-}
-
-#PanelUI-update-status {
- width: calc(22.35em + 30px);
- padding-inline-start: 15px;
- border-inline-start-style: none;
-}
-
-#PanelUI-update-status {
- list-style-image: url(chrome://branding/content/icon16.png);
-}
-
-#PanelUI-fxa-label,
-#PanelUI-fxa-icon {
- list-style-image: url("chrome://browser/skin/syncFx-horizontalbar.png");
-}
-
-#PanelUI-remotetabs {
- --panel-ui-sync-illustration-height: 157.5px;
-}
-
-.PanelUI-remotetabs-instruction-title,
-.PanelUI-remotetabs-instruction-label,
-#PanelUI-remotetabs-mobile-promo {
- /* If you change the margin here, the min-height of the synced tabs panel
- (e.g. #PanelUI-remotetabs[mainview] #PanelUI-remotetabs-setupsync, etc) may
- need adjusting (see bug 1248506) */
- margin: 15px;
- text-align: center;
- text-shadow: none;
- max-width: 15em;
- color: #A09090;
-}
-
-.PanelUI-remotetabs-instruction-title {
- font-size: 1.3em;
-}
-
-/* The boxes with "instructions" get extra top and bottom padding for space
- around the illustration and buttons */
-.PanelUI-remotetabs-instruction-box {
- /* If you change the padding here, the min-height of the synced tabs panel
- (e.g. #PanelUI-remotetabs[mainview] #PanelUI-remotetabs-setupsync, etc) may
- need adjusting (see bug 1248506) */
- padding-bottom: 30px;
- padding-top: 15px;
-}
-
-.PanelUI-remotetabs-prefs-button {
-/*
- -moz-appearance: none;
- background-color: #0096dd;
- / !important for the color as an OSX specific rule when a lightweight theme
- is used for buttons in the toolbox overrides. See bug 1238531 for details /
- color: white !important;
- border-radius: 2px;
- / If you change the margin or padding below, the min-height of the synced tabs
- panel (e.g. #PanelUI-remotetabs[mainview] #PanelUI-remotetabs-setupsync,
- etc) may need adjusting (see bug 1248506) /
- margin-top: 10px;
- margin-bottom: 10px;
- padding: 8px;
- text-shadow: none;
-*/
- min-width: 200px;
-}
-
-.PanelUI-remotetabs-prefs-button:hover,
-.PanelUI-remotetabs-prefs-button:hover:active {
-/* background-color: #018acb; */
-}
-
-.remotetabs-promo-link {
- margin: 0;
-}
-
-.PanelUI-remotetabs-notabsforclient-label {
- color: #A09090;
- /* This margin is to line this label up with the labels in toolbarbuttons. */
- margin-left: 28px;
-}
-
-.fxaSyncIllustration {
- height: var(--panel-ui-sync-illustration-height);
- list-style-image: url(chrome://browser/skin/fxa/sync-illustration.svg);
-}
-
-.PanelUI-remotetabs-prefs-button > .toolbarbutton-text {
- /* !important to override ".cui-widget-panel toolbarbutton > .toolbarbutton-text" above. */
- text-align: center !important;
- text-shadow: none;
-}
-
-#PanelUI-remotetabs[mainview] { /* panel anchored to toolbar button might be too skinny */
- min-width: 19em;
-}
-
-/* Work around bug 1224412 - these boxes will cause scrollbars to appear when
- the panel is anchored to a toolbar button.
-*/
-#PanelUI-remotetabs[mainview] #PanelUI-remotetabs-setupsync,
-#PanelUI-remotetabs[mainview] #PanelUI-remotetabs-reauthsync,
-#PanelUI-remotetabs[mainview] #PanelUI-remotetabs-nodevicespane,
-#PanelUI-remotetabs[mainview] #PanelUI-remotetabs-tabsdisabledpane {
- min-height: calc(var(--panel-ui-sync-illustration-height) +
- 20px + /* margin of .PanelUI-remotetabs-prefs-button */
- 16px + /* padding of .PanelUI-remotetabs-prefs-button */
- 30px + /* margin of .PanelUI-remotetabs-instruction-label */
- 30px + 15px + /* padding of .PanelUI-remotetabs-instruction-box */
- 11em);
-}
-
-#PanelUI-remotetabs-tabslist > label[itemtype="client"] {
- color: #A09090;
-}
-
-/* Collapse the non-active vboxes in the remotetabs deck to use only the
- height the active box needs */
-#PanelUI-remotetabs-deck:not([selectedIndex="1"]) > #PanelUI-remotetabs-tabsdisabledpane,
-#PanelUI-remotetabs-deck:not([selectedIndex="2"]) > #PanelUI-remotetabs-fetching,
-#PanelUI-remotetabs-deck:not([selectedIndex="3"]) > #PanelUI-remotetabs-nodevicespane {
- visibility: collapse;
-}
-
-#PanelUI-remotetabs-main[devices-status="single"] > #PanelUI-remotetabs-buttons {
- display: none;
-}
-
-#PanelUI-fxa-icon[syncstatus="active"] {
- list-style-image: url("chrome://browser/skin/syncFxProgress-horizontalbar.png");
-}
-
-#PanelUI-footer-fxa[fxastatus="migrate-signup"] > #PanelUI-fxa-status > #PanelUI-fxa-label,
-#PanelUI-footer-fxa[fxastatus="migrate-verify"] > #PanelUI-fxa-status > #PanelUI-fxa-label {
- list-style-image: url(chrome://browser/skin/warning.svg);
-}
-
-#PanelUI-customize {
- list-style-image: url("chrome://browser/skin/menuPanel-customize.png");
-}
-
-#customization-panelHolder #PanelUI-customize {
- list-style-image: url("chrome://browser/skin/customizableui/menuPanel-customizeFinish.png");
-}
-
-#PanelUI-help {
- list-style-image: url("chrome://browser/skin/menuPanel-help.png");
-}
-
-#PanelUI-quit {
- border-inline-end-style: none;
- list-style-image: url("chrome://browser/skin/menuPanel-exit.png");
-}
-
-#PanelUI-fxa-label,
-#PanelUI-fxa-icon,
-#PanelUI-customize,
-#PanelUI-help,
-#PanelUI-quit {
- -moz-image-region: rect(0, 16px, 16px, 0);
-}
-
-#PanelUI-footer-fxa[fxastatus="signedin"] > #PanelUI-fxa-status > #PanelUI-fxa-label > .toolbarbutton-icon,
-#PanelUI-footer-fxa[fxastatus="error"][fxaprofileimage="set"] > #PanelUI-fxa-status > #PanelUI-fxa-label > .toolbarbutton-icon {
- display: none;
-}
-
-#PanelUI-footer-fxa[fxastatus="error"]:not([fxaprofileimage="set"]) > #PanelUI-fxa-status > #PanelUI-fxa-avatar {
- display: none;
-}
-
-#PanelUI-fxa-avatar[disabled],
-#PanelUI-fxa-icon[disabled] {
- display: none;
-}
-
-#PanelUI-fxa-status[disabled] {
- pointer-events: none;
-}
-
-#PanelUI-fxa-avatar {
- width: 32px;
- height: 32px;
- border-radius: 50%;
- background-repeat: no-repeat;
- background-position: 0 0;
- background-size: contain;
- align-self: center;
- margin: 0px 7px;
- padding: 0px;
- border: 0px none;
- margin-inline-end: 0;
-}
-
-#PanelUI-footer-fxa[fxaprofileimage="enabled"] > #PanelUI-fxa-status > #PanelUI-fxa-avatar {
- list-style-image: url(chrome://browser/skin/fxa/default-avatar.svg);
-}
-
-#PanelUI-customize:hover,
-#PanelUI-help:not([disabled]):hover,
-#PanelUI-quit:not([disabled]):hover,
-#PanelUI-customize:hover:active,
-#PanelUI-help:not([disabled]):hover:active,
-#PanelUI-quit:not([disabled]):hover:active {
- -moz-image-region: rect(0, 32px, 16px, 16px);
-}
-
-#PanelUI-help[disabled],
-#PanelUI-quit[disabled] {
- -moz-image-region: rect(0, 48px, 16px, 32px);
-}
-
-#PanelUI-fxa-icon:not([disabled]):hover,
-#PanelUI-help:not([disabled]):hover,
-#PanelUI-customize:hover,
-#PanelUI-quit:not([disabled]):hover {
-}
-
-#PanelUI-fxa-icon:not([disabled]):hover:active,
-#PanelUI-help:not([disabled]):hover:active,
-#PanelUI-customize:hover:active,
-#PanelUI-quit:not([disabled]):hover:active {
-}
-
-#PanelUI-fxa-status:not([disabled]):hover,
-#PanelUI-fxa-status:not([disabled]):hover:active,
-#PanelUI-fxa-icon:not([disabled]):hover,
-#PanelUI-fxa-icon:not([disabled]):hover:active {
-}
-
-#PanelUI-footer-fxa[fxastatus="error"] {
- background-color: #FF0000;
- color: #000000;
-}
-
-#PanelUI-footer-fxa[fxastatus="error"] > #PanelUI-fxa-status:hover {
- background-color: #FFCF00;
-}
-
-#PanelUI-footer-fxa[fxastatus="error"] > #PanelUI-fxa-status:hover:active {
- background-color: #FF9F00;
-}
-
-#PanelUI-update-status {
-/* color: black; */
-}
-
-#PanelUI-update-status[update-status="succeeded"] {
- background-color: #008484;
- color: #000000;
-}
-
-#PanelUI-update-status[update-status="succeeded"]:not([disabled]):hover {
- background-color: #FFCF00;
-}
-
-#PanelUI-update-status[update-status="succeeded"]:not([disabled]):hover:active {
- background-color: #FF9F00;
-}
-
-#PanelUI-update-status[update-status="failed"] {
- background-color: #FF0000;
- color: #000000;
-}
-
-#PanelUI-update-status[update-status="failed"]:not([disabled]):hover {
- background-color: #FFCF00;
-}
-
-#PanelUI-update-status[update-status="failed"]:not([disabled]):hover:active {
- background-color: #FF9F00;
-}
-
-#PanelUI-quit:not([disabled]):hover {
- background-color: #FF0000;
-}
-
-#PanelUI-quit:not([disabled]):hover:active {
- background-color: #FF9F00;
-}
-
-#customization-panelHolder #PanelUI-customize {
- color: #FFCF00;
- background-color: #008484;
- text-shadow: none;
- margin-top: -1px;
-}
-
-#customization-panelHolder #PanelUI-customize + toolbarseparator {
- display: none;
-}
-
-#customization-panelHolder #PanelUI-customize:hover,
-#customization-panelHolder #PanelUI-customize:hover:active {
- background-color: #FFCF00;
- color: #000000;
-}
-
-#customization-palette .toolbarbutton-multiline-text,
-#customization-palette .toolbarbutton-text {
- display: none;
-}
-
-panelview .toolbarbutton-1,
-.subviewbutton,
-.widget-overflow-list .toolbarbutton-1,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button,
-.share-provider-button,
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton {
-/* padding: 0 6px;
- background-color: hsla(210,4%,10%,0);
- border-radius: 2px;
- border-style: solid;
- border-color: hsla(210,4%,10%,0);*/
-}
-
-panelview .toolbarbutton-1,
-.subviewbutton,
-.widget-overflow-list .toolbarbutton-1,
-.share-provider-button,
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton {
- border-width: 0;
-}
-
-.subviewbutton.panel-subview-footer {
-/* border-radius: 0; */
- margin: 2px 0 0;
-}
-
-.subviewbutton.panel-subview-footer > .menu-text {
- margin-inline-start: 0px !important;
- padding-inline-start: 6px;
- padding-inline-end: 6px;
- -moz-box-flex: 0;
- text-align: center;
-}
-
-.subviewbutton.panel-subview-footer > .toolbarbutton-icon {
- margin: 0;
-}
-
-.subviewbutton.panel-subview-footer > .toolbarbutton-text {
- text-align: center;
- padding: 0;
-}
-
-.subviewbutton.panel-subview-footer > .menu-accel-container {
- padding-inline-start: 6px;
-}
-
-.subviewbutton:not(.panel-subview-footer) {
- margin: 0;
-}
-
-.subviewbutton:not(.panel-subview-footer) > .toolbarbutton-text,
-/* Bookmark items need a more specific selector. */
-.PanelUI-subView .subviewbutton:not(.panel-subview-footer) > .menu-text,
-.PanelUI-subView .subviewbutton:not(.panel-subview-footer) > .menu-iconic-text {
-/* font: menu;*/
-}
-
-.PanelUI-subView .subviewbutton[shortcut]::after {
- content: attr(shortcut);
- float: right;
- color: #A09090;
-}
-
-.PanelUI-subView.cui-widget-panelview .subviewbutton[shortcut]::after {
- margin-inline-start: 10px;
-}
-
-/* This is a <label> but it should fit in with the menu font- and colorwise. */
-#PanelUI-characterEncodingView-autodetect-label {
- font: menu;
- color: inherit;
-}
-
-.cui-widget-panelview .subviewbutton:not(.panel-subview-footer) {
-/* margin-left: 4px;
- margin-right: 4px;*/
-}
-
-panelview .toolbarbutton-1,
-.widget-overflow-list .toolbarbutton-1:not(:first-child),
-.widget-overflow-list .toolbaritem-combined-buttons:not(:first-child) {
- margin-top: 6px;
-}
-
-/*
-panelview .toolbarbutton-1:not(:-moz-any([disabled],[open],:active)):hover,
-toolbarbutton.subviewbutton:not(:-moz-any([disabled],[open],:active)):hover,
-menu.subviewbutton:not(:-moz-any([disabled],:active))[_moz-menuactive],
-menuitem.subviewbutton:not(:-moz-any([disabled],:active))[_moz-menuactive],
-.share-provider-button:not(:-moz-any([disabled],[open],:active)):hover,
-.widget-overflow-list .toolbarbutton-1:not(:-moz-any([disabled],[open],:active)):hover,
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])
- > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover {
- background-color: hsla(210,4%,10%,.08);
- border-color: hsla(210,4%,10%,.11);
-}
-
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]):not(:-moz-any([disabled],[open],:active)):hover {
- border-color: hsla(210,4%,10%,.11);
-}
-
-panelview .toolbarbutton-1:-moz-any(:not([disabled]):-moz-any([open],:hover:active),[checked=true]),
-toolbarbutton.subviewbutton:not([disabled]):-moz-any([open],:hover:active),
-menu.subviewbutton:not([disabled])[_moz-menuactive]:active,
-menuitem.subviewbutton:not([disabled])[_moz-menuactive]:active,
-.share-provider-button:not([disabled]):-moz-any([open],:hover:active),
-.widget-overflow-list .toolbarbutton-1:not([disabled]):-moz-any([open],:hover:active),
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])
- > toolbarbutton:not([disabled]):-moz-any([open],:hover:active) {
- background-color: hsla(210,4%,10%,.12);
- border-color: hsla(210,4%,10%,.14);
- box-shadow: 0 1px 0 hsla(210,4%,10%,.03) inset;
-}
-
-.subviewbutton.panel-subview-footer {
- margin: 4px -4px -4px;
- background-color: hsla(210,4%,10%,.07);
- border-top: 1px solid hsla(210,4%,10%,.12);
- border-radius: 0;
- color: hsl(0,0%,25%)
-}
-
-menuitem.panel-subview-footer:not(:-moz-any([disabled],[open],:active)):hover,
-.subviewbutton.panel-subview-footer:not(:-moz-any([disabled],[open],:active)):hover {
- background-color: hsla(210,4%,10%,.1);
- border-top: 1px solid hsla(210,4%,10%,.12);
-}
-
-menuitem.panel-subview-footer:not([disabled]):-moz-any([open],:hover:active),
-.subviewbutton.panel-subview-footer:not([disabled]):-moz-any([open],:hover:active) {
- background-color: hsla(210,4%,10%,.15);
- border-top: 1px solid hsla(210,4%,10%,.12);
- box-shadow: 0 1px 0 hsla(210,4%,10%,.05) inset;
-}
-
-#BMB_bookmarksPopup .subviewbutton {
- font: menu;
- font-weight: normal;
-}
-
-#BMB_bookmarksPopup .subviewbutton:not([disabled="true"]) {
- color: inherit;
-}
-
-#BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-up,
-#BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-down {
- -moz-appearance: none;
- margin-top: 0;
- margin-bottom: 0;
-}
-
-/ Remove padding on xul:arrowscrollbox to avoid extra padding on footer /
-#BMB_bookmarksPopup arrowscrollbox {
- padding-bottom: 0px;
-}
-
-#BMB_bookmarksPopup menupopup > .bookmarks-actions-menuseparator {
- / Hide bottom separator as the styled footer includes a top border serving the same purpose /
- display: none;
-}
-
-/ Popups with only one item don't have a footer /
-#BMB_bookmarksPopup menupopup[placespopup=true][singleitempopup=true] > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox,
-/ These popups never have a footer /
-#BMB_bookmarksToolbarPopup > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox,
-#BMB_unsortedBookmarksPopup > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox {
- / And so they need some bottom padding: /
- padding-bottom: 4px;
-}
-
-/ Disabled (empty) item is always alone and never has an icon, so fix its left padding /
-#BMB_bookmarksPopup menupopup[emptyplacesresult] .bookmark-item.subviewbutton {
- padding-left: 6px;
-}
-*/
-
-.PanelUI-subView menuseparator,
-.PanelUI-subView toolbarseparator,
-.cui-widget-panelview menuseparator {
- -moz-appearance: none;
- min-height: 0;
- border-top: 1px solid #9C9CFF;
- margin: 2px 0;
- padding: 0;
-}
-
-.PanelUI-subView menuseparator,
-.PanelUI-subView toolbarseparator {
-/* margin-inline-start: -5px;
- margin-inline-end: -4px;*/
-}
-
-.PanelUI-subView menuseparator.small-separator,
-.PanelUI-subView toolbarseparator.small-separator {
-/* margin-left: 5px;
- margin-right: 5px;*/
-}
-
-.cui-widget-panelview menuseparator.small-separator {
-/* margin-left: 10px;
- margin-right: 10px;*/
-}
-
-.subviewbutton > .menu-accel-container {
- -moz-box-pack: start;
- margin-inline-start: 10px;
- margin-inline-end: auto;
- color: #A09090;
-}
-
-#PanelUI-remotetabs-tabslist > toolbarbutton,
-#PanelUI-historyItems > toolbarbutton {
- list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
-}
-
-@media (min-resolution: 1.1dppx) {
- #PanelUI-remotetabs-tabslist > toolbarbutton,
- #PanelUI-historyItems > toolbarbutton {
- list-style-image: url("chrome://mozapps/skin/places/defaultFavicon@2x.png");
- }
-}
-
-#PanelUI-remotetabs-tabslist > toolbarbutton > .toolbarbutton-icon,
-#PanelUI-recentlyClosedWindows > toolbarbutton > .toolbarbutton-icon,
-#PanelUI-recentlyClosedTabs > toolbarbutton > .toolbarbutton-icon,
-#PanelUI-historyItems > toolbarbutton > .toolbarbutton-icon {
- width: 16px;
- height: 16px;
-}
-
-toolbarbutton[panel-multiview-anchor="true"],
-toolbarbutton[panel-multiview-anchor="true"] > .toolbarbutton-menubutton-button {
- color: #000000;
- background-color: #008484;
-}
-
-#PanelUI-help[panel-multiview-anchor="true"] + toolbarseparator {
- display: none;
-}
-
-#PanelUI-help[panel-multiview-anchor="true"] {
- background-image: none;
-}
-
-#PanelUI-help[panel-multiview-anchor="true"]::after {
- content: "";
- position: absolute;
- top: 0;
- height: 100%;
- width: var(--panel-ui-exit-subview-gutter-width);
- background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted.png");
- background-repeat: no-repeat;
- background-color: #008484;
- background-position: left 10px center, 0;
-}
-
-#PanelUI-help[panel-multiview-anchor="true"]:-moz-locale-dir(rtl)::after {
- background-image: url(chrome://browser/skin/customizableui/subView-arrow-back-inverted-rtl.png);
- background-position: right 10px center, 0;
-}
-
-toolbarbutton[panel-multiview-anchor="true"] {
- background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted.png");
- background-position: right calc((22.35em / 3 - 0.1px) / 2 - var(--panel-ui-exit-subview-gutter-width) + 2px) center;
- background-repeat: no-repeat;
-}
-
-toolbarbutton[panel-multiview-anchor="true"]:-moz-locale-dir(rtl) {
- background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted-rtl.png");
- background-position: left calc((22.35em / 3 - 0.1px) / 2 - var(--panel-ui-exit-subview-gutter-width) + 2px) center;
-}
-
-toolbarpaletteitem[place="palette"] > .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker,
-#bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-dropmarker {
- display: none;
-}
-
-#search-container[cui-areatype="menu-panel"],
-#wrapper-search-container[place="panel"] {
- width: 22.35em;
-}
-
-#search-container[cui-areatype="menu-panel"] {
- margin-top: 6px;
- margin-bottom: 6px;
-}
-
-toolbarpaletteitem[place="palette"] > #search-container {
- min-width: 7em;
- width: 7em;
-}
-
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) {
- padding: 0;
- transition-property: background-color, border-color;
- transition-duration: 150ms;
-}
-
-/* Make direct siblings overlap borders: */
-.toolbaritem-combined-buttons + .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) {
-/* border-top-color: transparent !important; */
-}
-
-.toolbaritem-combined-buttons + .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]),
-toolbarpaletteitem[haswideitem][place="panel"] + toolbarpaletteitem[haswideitem][place="panel"] {
-/* margin-top: -1px; */
-}
-
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton {
- border: 0;
- padding: .5em;
- margin: 0;
- -moz-box-flex: 1;
- min-width: calc(22.35em / 3 - 0.1px);
- max-width: calc(22.35em / 3 - 0.1px);
- /* We'd prefer to use height: auto here but it leads to layout bugs in the panel. Cope:
- 1.2em for line height + 2 * .5em padding + margin on the label (2 * 2px) */
- height: calc(2.2em + 4px);
- max-height: none;
- -moz-box-orient: horizontal;
-}
-
-#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button,
-#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-reset-button {
- /* reduce the width with 2px for this button to compensate for two separators
- of 1px. */
- min-width: calc(22.35em / 3 - 0.1px - 2px);
- max-width: calc(22.35em / 3 - 0.1px - 2px);
-}
-
-#main-window:not([customizing]) .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton[disabled] > .toolbarbutton-icon {
-/* opacity: .25; */
-}
-
-#zoom-controls[cui-areatype="toolbar"] > #zoom-reset-button > .toolbarbutton-text {
- min-width: 7ch;
-}
-
-#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button:-moz-locale-dir(ltr),
-#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button:-moz-locale-dir(rtl),
-#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button:-moz-locale-dir(ltr),
-#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button:-moz-locale-dir(rtl) {
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
-}
-
-#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button:-moz-locale-dir(rtl),
-#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button:-moz-locale-dir(ltr),
-#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button:-moz-locale-dir(rtl),
-#zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button:-moz-locale-dir(ltr) {
- border-top-left-radius: 0;
- border-bottom-left-radius: 0;
-}
-
-.toolbaritem-combined-buttons > separator {
- -moz-appearance: none;
- width: 3px;
- -moz-box-align: stretch;
-}
-
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > separator {
- margin: .5em 0;
- width: 1px;
- height: auto;
-/* background: hsla(210,4%,10%,.15);*/
- transition-property: margin;
- transition-duration: 10ms;
- transition-timing-function: ease;
-}
-
-.toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]):hover > separator {
- margin: 0;
-}
-
-#widget-overflow > .panel-arrowcontainer > .panel-arrowcontent {
- padding: 0;
-}
-
-.cui-widget-panelview,
-#widget-overflow-scroller {
- overflow-y: auto;
- overflow-x: hidden;
-}
-
-#widget-overflow-scroller {
- max-height: 30em;
- margin-top: 10px;
- margin-bottom: 10px;
-}
-
-#widget-overflow-list {
- width: 22.35em;
- padding-left: 10px;
- padding-right: 10px;
-}
-
-toolbaritem[overflowedItem=true],
-toolbarbutton[overflowedItem=true] {
- width: 100%;
- max-width: 22.35em;
- min-height: 36px;
- background-repeat: no-repeat;
- background-position: 0 center;
-}
-
-.widget-overflow-list .toolbarbutton-1,
-.widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button {
- -moz-box-align: center;
- -moz-box-orient: horizontal;
-}
-
-.widget-overflow-list .toolbarbutton-1:not(.toolbarbutton-combined) > .toolbarbutton-text,
-.widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-text {
- text-align: start;
- padding-inline-start: .5em;
-}
-
-#widget-overflow-list > .toolbaritem-combined-buttons {
- min-height: 28px;
-}
-
-.widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button::after {
- content: "";
- display: -moz-box;
- width: 1px;
- height: 18px;
- margin-inline-end: -1px;
-}
-
-.subviewbutton[checked="true"] {
- background-image: url("chrome://global/skin/menu/menu-check.gif");
- background-position: top 5px left 4px;
- background-repeat: no-repeat;
-}
-
-.subviewbutton[checked="true"]:-moz-locale-dir(rtl) {
- background-position: top 5px right 4px;
-}
-
-.subviewbutton[checked="true"]:hover {
- background-image: url("chrome://global/skin/menu/menu-check-hover.gif");
-}
-
-.subbiewbutton > .menu-iconic-left {
- margin-inline-end: 3px;
-}
-
-menuitem[checked="true"].subviewbutton > .menu-iconic-left {
- visibility: hidden;
-}
-
-.panel-mainview[panelid=customizationui-widget-panel],
-#customizationui-widget-multiview > .panel-viewcontainer,
-#customizationui-widget-multiview > .panel-viewcontainer > .panel-viewstack,
-#PanelUI-panicView > .panel-subview-body,
-#PanelUI-panicView {
- overflow: visible;
- color: #FF9F00;
-}
-
-#PanelUI-panicView.cui-widget-panelview {
- min-width: 280px;
-}
-
-#PanelUI-panic-timeframe {
- padding: 15px;
- border-bottom: 1px solid #A09090;
-}
-
-#panic-button-success-icon,
-#PanelUI-panic-timeframe-icon,
-#PanelUI-panic-timeframe-icon-small {
- background-color: transparent;
- margin-inline-end: 10px;
-}
-
-#panic-button-success-icon,
-#PanelUI-panic-timeframe-icon {
- list-style-image: url(chrome://browser/skin/panic-panel/header.png);
- max-height: 48px;
- width: 48px;
-}
-
-#PanelUI-panic-timeframe-icon-small {
- list-style-image: url(chrome://browser/skin/panic-panel/header-small.png);
- max-height: 32px;
- width: 32px;
-}
-
-/* current attribute is only set when in use as a subview instead of a main view */
-#PanelUI-panicView[current] #PanelUI-panic-timeframe-icon {
- display: none;
-}
-
-#PanelUI-panicView.cui-widget-panelview #PanelUI-panic-timeframe-icon-small {
- display: none;
-}
-
-#panic-button-success-header,
-#PanelUI-panic-header {
- -moz-box-align: center;
- margin-bottom: 5px;
-}
-
-#PanelUI-panicView.cui-widget-panelview #PanelUI-panic-header {
- margin-bottom: 0;
-}
-
-#PanelUI-panic-timeframe-icon-small:-moz-locale-dir(rtl),
-#PanelUI-panic-timeframe-icon:-moz-locale-dir(rtl) {
- transform: scaleX(-1);
-}
-
-/*
-.subviewradio {
-}
-
-.subviewradio@buttonStateHover@ {
-}
-
-.subviewradio[selected],
-.subviewradio[selected]:hover,
-.subviewradio@buttonStateActive@ {
-}
-
-.subviewradio > .radio-check {
-}
-
-.subviewradio > .radio-check[selected] {
-}
-*/
-
-#PanelUI-panic-explanations {
- padding: 10px 10px 0;
-}
-
-#PanelUI-panic-actionlist-main-label {
- color: #A09090;
- font-size: 0.9em;
-}
-
-.PanelUI-panic-actionlist {
- padding-inline-start: 20px;
- padding-top: 2px;
- padding-bottom: 2px;
- background-size: 16px 16px;
- background-repeat: no-repeat;
- background-color: transparent;
- background-position: center left;
-}
-
-.PanelUI-panic-actionlist:-moz-locale-dir(rtl) {
- background-position: center right;
-}
-
-#PanelUI-panic-actionlist-cookies {
- background-image: -moz-image-rect(url(chrome://browser/skin/panic-panel/icons.png), 0, 16, 16, 0);
-}
-
-#PanelUI-panic-actionlist-history {
- background-image: -moz-image-rect(url(chrome://browser/skin/panic-panel/icons.png), 0, 32, 16, 16);
-}
-
-#PanelUI-panic-actionlist-windows {
- background-image: -moz-image-rect(url(chrome://browser/skin/panic-panel/icons.png), 0, 48, 16, 32);
-}
-
-#PanelUI-panic-actionlist-newwindow {
- background-image: -moz-image-rect(url(chrome://browser/skin/panic-panel/icons.png), 0, 64, 16, 48);
-}
-
-#PanelUI-panic-warning {
- color: #FF0000;
- text-align: center;
- width: 100%;
- margin-top: 20px;
-}
-
-#PanelUI-panic-view-button {
- background-color: #FF0000;
- color: #000000;
-}
-
-#PanelUI-panic-view-button:hover {
- background-color: #FFCF00;
-}
-
-#PanelUI-panic-view-button:hover:active {
- background-color: #FF9F00;
-}
-
-#PanelUI-panic-view-button > .toolbarbutton-text {
- text-align: center;
- text-shadow: none;
-}
-
-#panic-button-success-closebutton {
-}
-
-#panic-button-success-closebutton:hover {
-}
-
-#panic-button-success-closebutton:hover:active {
-}
-
-/* === END panelUIOverlay.inc.css === */
-
-.panel-subviews {
- background-color: #000000;
-}
-
-#PanelUI-contents #zoom-out-btn {
- padding-left: 12px;
- padding-right: 12px;
-}
-
-#PanelUI-contents #zoom-in-btn {
- padding-left: 12px;
- padding-right: 12px;
-}
-
-/* bookmark panel submenus */
-
-#BMB_bookmarksPopup menupopup[placespopup=true] {
-/* background: transparent;
- border: none;
- padding: 6px;*/
-}
-
-#BMB_bookmarksPopup menupopup[placespopup=true] > hbox {
- /* emulating chrome://browser/content/places/menu.xml#places-popup-arrow but without the arrow */
-/* background: var(--panel-arrowcontent-background);
- border: var(--panel-arrowcontent-border);
- border-radius: 3.5px;
- margin-top: -4px;*/
-}
-
-#BMB_bookmarksPopup menupopup {
-/* padding-top: 2px;*/
-}
-
-/* Add some space at the top because there are no headers: */
-#BMB_bookmarksPopup menupopup[placespopup=true] > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox {
-/* padding-top: 4px;*/
-}
-
-/* bookmark panel separator */
-#BMB_bookmarksPopup menuseparator {
- padding-top: 0;
- padding-bottom: 0;
-}
-
-.subviewbutton > .menu-right,
-.subviewbutton > .menu-iconic-left {
-/* padding-top: 1px;
- margin-top: 1px;
- margin-bottom: 2px;*/
-}
-
-.subviewbutton:-moz-any([image], .bookmark-item) > .toolbarbutton-icon {
- /* This catches bookmarks, history items, and sync tabs items */
- width: 16px;
- height: 16px;
-}
-
-/* Disabled empty item looks too small otherwise, because it has no icon. */
-menuitem.subviewbutton[disabled]:not(.menuitem-iconic),
-/* Same for checkbox menu items, whose icons lose size due to -moz-appearance: none: */
-menuitem[type="checkbox"].subviewbutton {
- /* This is 16px for an icon + 3px for its margins + 1px for its padding +
- * 2px for its border, see above */
-/* min-height: 22px;*/
-}
-
-.subviewbutton > .toolbarbutton-text {
-/* padding-top: 3px;
- padding-bottom: 3px;*/
-}
-
-.widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button {
- -moz-appearance: none;
- border: 0;
- margin-inline-start: 3px;
-}
-
-.widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
- padding: 0 2px;
- padding-inline-start: 0;
- height: 18px;
-}
-
-menu.subviewbutton > .menu-right:-moz-locale-dir(rtl) {
-/* transform: scaleX(-1); */
-}
-
-.widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
- padding: 0 6px;
-}
-
-.subviewbutton > .toolbarbutton-text {
- padding-inline-start: 18px; /* 16px for icons plus the 2px spacing from the rule below */
-}
-
-.subviewbutton:-moz-any([image],[targetURI],.cui-withicon, .restoreallitem, .bookmark-item) > .toolbarbutton-text {
- padding-inline-start: 2px;
-}
-
-/* subviewbutton entries for social sidebars have images that come from external
-/* sources, and are not guaranteed to be the size we want, so force the size on
-/* those icons. */
-toolbarbutton.social-provider-menuitem > .toolbarbutton-icon {
- width: 16px;
- height: 16px;
-}
-
-.subviewbutton:-moz-any([image],[targetURI],.cui-withicon, .restoreallitem, .bookmark-item)[checked="true"] > .toolbarbutton-icon {
- visibility: hidden;
-}
-
-menu.subviewbutton > .menu-right {
- list-style-image: url("chrome://global/skin/menu/menu-arrow.svg#arrow");
- /* Reset the rect we inherit from the button: */
- -moz-image-region: auto;
-}
-menu.subviewbutton:not([disabled="true"]):hover > .menu-right,
-menu.subviewbutton:not([disabled="true"])[_moz-menuactive="true"] > .menu-right {
- list-style-image: url("chrome://global/skin/menu/menu-arrow.svg#arrow-hover");
-}
-menu[disabled="true"].subviewbutton > .menu-right {
- list-style-image: url("chrome://global/skin/menu/menu-arrow.svg#arrow-disabled");
-}
/*** View and outer controls ***/
-
#downloadsRichListBox {
/** The default listbox appearance comes with an unwanted margin. **/
-moz-appearance: none;
}
.downloadTypeIcon {
- margin-inline-end: 8px;
- margin-inline-start: 8px;
- /* explicitly size the icon, so size doesn't vary on hidpi systems */
- height: 32px;
+ margin-top: 8px;
+ margin-inline-end: 12px;
+ margin-bottom: 8px;
+ margin-inline-start: 0;
width: 32px;
+ height: 32px;
+}
+
+.downloadBlockedBadge {
+ margin: 0 4px;
+ background: url("chrome://browser/skin/downloads/download-blocked.svg") top right / 16px no-repeat;
+}
+
+.downloadBlockedBadge:-moz-locale-dir(rtl) {
+ background-position-x: left;
+}
+
+richlistitem.download[verdict="PotentiallyUnwanted"] .downloadBlockedBadge {
+ background-image: url("chrome://browser/skin/warning.svg");
}
-.blockedIcon {
- list-style-image: url("chrome://global/skin/icons/alert-error.gif");
+richlistitem.download[verdict="Uncommon"] .downloadBlockedBadge {
+ background-image: url("chrome://browser/skin/info.svg");
}
.downloadTarget {
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<!-- 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="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16">
+ <style>
+ circle {
+ fill: #FF0000;
+ }
+ rect {
+ fill: #FFCF00;
+ }
+ </style>
+
+ <circle cx="8" cy="8" r="8" />
+ <rect x="3" y="6" width="10" height="4" rx=".5" ry=".5" />
+</svg>
/*** Panel and outer controls ***/
#downloadsPanel > .panel-arrowcontainer > .panel-arrowcontent {
+ overflow: hidden;
+ display: block;
+}
+
+#downloadsPanel > .panel-arrowcontainer > .panel-arrowcontent,
+#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
padding: 0;
}
color: inherit;
}
-#downloadsPanel:not([hasdownloads]) > #downloadsListBox {
- display: none;
+#emptyDownloads {
+ padding: 10px 20px;
+ /* The panel can be wider than this description after the blocked subview is
+ shown, so center the text. */
+ text-align: center;
}
-#downloadsPanel[hasdownloads] > #emptyDownloads {
- display: none;
+.downloadsPanelFooter {
+ background-color: #000000;
+ border-top: 1px solid #A09090;
}
-#emptyDownloads {
- padding: 10px 20px;
- max-width: 40ch;
+.downloadsPanelFooter > toolbarseparator {
+ margin: 0;
+ border: 0;
+ min-width: 0;
+/* border-left: 1px solid hsla(210,4%,10%,.14);
+ -moz-appearance: none !important;*/
+}
+
+.downloadsPanelFooterButton {
+ margin: 0;
+ padding: 0;
+/* min-height: 40px;*/
+}
+
+.downloadsPanelFooterButton:hover {
+}
+
+.downloadsPanelFooterButton:hover:active {
+}
+
+.downloadsPanelFooterButton[default] {
+}
+
+.downloadsPanelFooterButton[default]:hover {
+}
+
+.downloadsPanelFooterButton[default]:hover:active {
}
#downloadsSummary {
- padding: 8px 38px 8px 12px;
+ padding: 0 12px;
cursor: pointer;
-moz-user-focus: normal;
}
color: #3333FF;
}
-#downloadsHistory {
- cursor: pointer;
- margin: 4px !important;
- color: #3333FF;
-}
-
-#downloadsHistory > .button-box {
-}
-
/*** List items and similar elements in the summary ***/
#downloadsSummary,
}
.downloadTypeIcon {
- margin-inline-end: 8px;
- /* Prevent flickering when changing states. */
- height: 32px;
+ margin-top: 8px;
+ margin-inline-end: 12px;
+ margin-bottom: 8px;
+ margin-inline-start: 0;
width: 32px;
+ height: 32px;
+}
+
+.downloadBlockedBadge {
+ margin: 0 4px;
+ background: url("chrome://browser/skin/downloads/download-blocked.svg") top right / 16px no-repeat;
+}
+
+downloadBlockedBadge:-moz-locale-dir(rtl) {
+ background-position-x: left;
}
-.blockedIcon {
- list-style-image: url("chrome://global/skin/icons/alert-error.gif");
+richlistitem[type="download"][verdict="PotentiallyUnwanted"] .downloadBlockedBadge {
+ background-image: url("chrome://browser/skin/warning.svg");
+}
+
+richlistitem[type="download"][verdict="Uncommon"] .downloadBlockedBadge {
+ background-image: url("chrome://browser/skin/info.svg");
}
/* We hold .downloadTarget, .downloadProgress and .downloadDetails inside of
padding: 0;
}
+/*** Blocked subview ***/
+
+#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype=main] > .panel-subviews {
+ /* When the main view is showing, the shadow on the left edge of the subview is
+ barely visible on the right edge of the main view, so set it to none. */
+ box-shadow: none;
+}
+
+/* When the subview is showing, turn the download button into an arrow pointing
+ back to the main view. */
+#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] .download-state[showingsubview] .downloadButton {
+ list-style-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted.png");
+}
+
+#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] .download-state[showingsubview] .downloadButton:-moz-locale-dir(rtl) {
+ list-style-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted-rtl.png");
+}
+
+#downloadsPanel-blockedSubview {
+ background-image: url("chrome://browser/skin/warning.svg");
+ background-size: 32px 32px;
+ background-position: 16px 16px;
+ background-repeat: no-repeat;
+}
+
+#downloadsPanel-blockedSubview:-moz-locale-dir(rtl) {
+ background-position: calc(100% - 16px) 16px;
+}
+
+#downloadsPanel-blockedSubview[verdict=Malware] {
+ background-image: url("chrome://browser/skin/downloads/download-blocked.svg");
+}
+
+#downloadsPanel-blockedSubview-title {
+ margin-top: 16px;
+ margin-bottom: 16px;
+ font-size: calc(100% / var(--downloads-item-font-size-factor));
+}
+
+#downloadsPanel-blockedSubview-details1,
+#downloadsPanel-blockedSubview-details2 {
+ font-size: calc(100% * var(--downloads-item-font-size-factor));
+ margin-bottom: 16px;
+ opacity: var(--downloads-item-details-opacity);
+}
+
+#downloadsPanel-blockedSubview-title,
+#downloadsPanel-blockedSubview-details1,
+#downloadsPanel-blockedSubview-details2 {
+ -moz-margin-start: 64px;
+ -moz-margin-end: 16px;
+}
/* === END downloads.inc.css === */
/*** Panel and outer controls ***/
-#downloadsFooter {
+#downloadsSummary {
}
-#downloadsFooter:hover {
+#downloadsSummary:hover {
}
-#downloadsFooter:hover:active {
+#downloadsSummary:hover:active {
}
#downloadsPanel[keyfocus] #downloadsSummary:focus,
-#downloadsPanel[keyfocus] #downloadsHistory:focus {
+#downloadsPanel[keyfocus] .downloadsPanelFooterButton:focus {
outline: 1px #008484 dotted;
outline-offset: -1px;
}
outline-offset: -5px;
}
-#downloadsHistory > .button-box {
+.downloadsPanelFooterButton > .button-box {
/* Hide the border so we don't display an inner focus ring. */
border: none;
}
+richlistitem[type="download"][showingsubview] {
+ background-color: Highlight;
+ color: HighlightText;
+ transition: background-color var(--panelui-subview-transition-duration),
+ color var(--panelui-subview-transition-duration);
+}
+
+#downloadsPanel:not([keyfocus]) richlistitem[type="download"][state="1"][exists][verdict="Malware"]:hover,
+#downloadsPanel:not([keyfocus]) richlistitem[type="download"][state="1"][exists][verdict="Malware"]:hover:active,
+richlistitem[type="download"][showingsubview][verdict="Malware"] {
+ background-color: hsl(4, 82%, 47%);
+ color: white;
+}
+
+
/*** List items and similar elements in the summary ***/
:root {
richlistitem[type="download"]:hover > stack > .downloadButton.downloadIconRetry:active {
-moz-image-region: rect(32px, 32px, 48px, 16px);
}
+
+.downloadButton.downloadShowBlockedInfo {
+ -moz-image-region: rect(48px, 16px, 64px, 0px);
+}
+richlistitem[type="download"]:hover .downloadButton.downloadShowBlockedInfo,
+richlistitem[type="download"]:hover .downloadButton.downloadShowBlockedInfo:hover,
+richlistitem[type="download"]:hover .downloadButton.downloadShowBlockedInfo:active {
+/* -moz-image-region: rect(48px, 32px, 64px, 16px);*/
+}
+
+.downloadButton.downloadShowBlockedInfo:-moz-locale-dir(rtl) {
+ -moz-image-region: rect(64px, 16px, 80px, 0px);
+}
+richlistitem[type="download"]:hover .downloadButton.downloadShowBlockedInfo:-moz-locale-dir(rtl),
+richlistitem[type="download"]:hover .downloadButton.downloadShowBlockedInfo:hover:-moz-locale-dir(rtl),
+richlistitem[type="download"]:hover .downloadButton.downloadShowBlockedInfo:active:-moz-locale-dir(rtl) {
+/* -moz-image-region: rect(64px, 32px, 80px, 16px);*/
+}
/* Top padding for when the window height is small.
Bottom padding to keep everything centered. */
padding: 75px 0;
+ /* info-pages.css sets a minimum width of 13em to the content
+ * container. If we don't set a min-width here, the content
+ * gets clipped in iframes with small width. We don't accomodate
+ * any padding to prioritize real estate in the small viewport. */
+ min-width: 13em;
}
.button-container {
--- /dev/null
+<?xml version="1.0"?>
+<!-- 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="http://www.w3.org/2000/svg">
+ <filter id="fill">
+ <feComposite in="FillPaint" in2="SourceGraphic" operator="in"/>
+ </filter>
+</svg>
--- /dev/null
+<?xml version="1.0" encoding="utf-8"?>
+<!-- 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="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">
+ <ellipse cx="32" cy="34" rx="29.5" ry="30" fill="#000" fill-opacity=".1"/>
+ <circle cx="32" cy="32" r="30" fill="#008484"/>
+ <circle cx="32" cy="32" r="29.5" stroke="#008484" stroke-width="1" fill="none"/>
+ <path d="M50,47.131L47.131,50,36.776,39.647a16.038,16.038,0,1,1,2.871-2.871ZM27,15A12,12,0,1,0,39,27,12,12,0,0,0,27,15Z" stroke="#008484" stroke-width="2" fill="none"/>
+ <path d="M50,47.131L47.131,50,36.776,39.647a16.038,16.038,0,1,1,2.871-2.871ZM27,15A12,12,0,1,0,39,27,12,12,0,0,0,27,15Z" fill="#000000"/>
+ <circle cx="27" cy="27" r="13" fill="#000000" fill-opacity=".2"/>
+</svg>
- License, v. 2.0. If a copy of the MPL was not distributed with this\r
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->\r
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"\r
- width="48" height="16" viewBox="0 0 32 16">\r
+ width="48" height="16" viewBox="0 0 64 16">\r
<defs>\r
- <circle id="shape-circle-base" cx="8" cy="8" r="7" />\r
- <g id="shape-i">\r
- <circle cx="8" cy="5" r="1" />\r
- <rect x="7" y="7" width="2" height="5" rx="1" ry="1" />\r
- </g>\r
- <mask id="mask-ring-cutout">\r
- <rect width="16" height="16" fill="#000" />\r
- <use xlink:href="#shape-circle-base" fill="#fff" />\r
- <circle cx="8" cy="8" r="6" fill="#000" />\r
- </mask>\r
+ <style>\r
+ path {\r
+ fill-rule: evenodd;\r
+ fill: #A09090;\r
+ }\r
+ </style>\r
</defs>\r
\r
<view id="normal" viewBox="0 0 16 16"/>\r
<g>\r
- <use xlink:href="#shape-circle-base" mask="url(#mask-ring-cutout)" fill="#A09090" />\r
- <use xlink:href="#shape-i" fill="#A09090" />\r
+ <path d="M128,193a7,7,0,1,1,7-7A7,7,0,0,1,128,193Zm0-13a6,6,0,1,0,6,6A6,6,0,0,0,128,180Zm0,10a1,1,0,0,1-1-1v-3a1,1,0,0,1,2,0v3A1,1,0,0,1,128,190Zm0-6a1,1,0,1,1,1-1A1,1,0,0,1,128,184Z" transform="translate(-120 -178)"/>\r
</g>\r
\r
<view id="hover" viewBox="16 0 16 16"/>\r
<g transform="translate(16)">\r
- <use xlink:href="#shape-circle-base" fill="#9C9CFF" />\r
- <use xlink:href="#shape-i" fill="#000000" />\r
+ <path d="M102,179a7,7,0,1,1-7,7A7,7,0,0,1,102,179Zm0,3a1,1,0,1,1-1,1A1,1,0,0,1,102,182Zm0,3a1,1,0,0,1,1,1v3a1,1,0,0,1-2,0v-3A1,1,0,0,1,102,185Z" transform="translate(-94 -178)"/>\r
+ </g>\r
+\r
+ <view id="notice" viewBox="32 0 16 16"/>\r
+ <g transform="translate(32)">\r
+ <path d="M133.5,202a2.5,2.5,0,1,1,2.5-2.5A2.5,2.5,0,0,1,133.5,202Zm-5.5,1a1,1,0,1,1,1-1A1,1,0,0,1,128,203Zm1,5a1,1,0,0,1-2,0v-3a1,1,0,0,1,2,0v3Zm-1-9a6.08,6.08,0,1,0,5.629,3.987,3.452,3.452,0,0,0,.984-0.185A6.9,6.9,0,0,1,135,205a7,7,0,1,1-7-7,6.9,6.9,0,0,1,2.2.387,3.452,3.452,0,0,0-.185.984A5.951,5.951,0,0,0,128,199Z" transform="translate(-120 -197)"/>\r
+ </g>\r
+\r
+ <view id="notice-hover" viewBox="48 0 16 16"/>\r
+ <g transform="translate(48)">\r
+ <path d="M107.5,202a2.5,2.5,0,1,1,2.5-2.5A2.5,2.5,0,0,1,107.5,202Zm0,1.039a3.5,3.5,0,0,0,1.125-.2,7.124,7.124,0,1,1-4.464-4.464,3.5,3.5,0,0,0-.2,1.125A3.54,3.54,0,0,0,107.5,203.039ZM102,201a1,1,0,1,0,1,1A1,1,0,0,0,102,201Zm1,4a1,1,0,0,0-2,0v3a1,1,0,0,0,2,0v-3Z" transform="translate(-94 -197)"/>\r
</g>\r
</svg>\r
+++ /dev/null
-<?xml version="1.0" encoding="utf-8"?>
-<!-- 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="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
- width="16" height="16" viewBox="0 0 16 16">
- <style>
- .icon-default {
- fill: #008484;
- }
- </style>
-
- <defs>
- <rect id="shape-lock-clasp-outer" x="2" y="1" width="8" height="10" rx="4" ry="4" />
- <rect id="shape-lock-clasp-inner" x="4" y="3" width="4" height="6" rx="2" ry="2" />
- <rect id="shape-lock-base" x="1" y="6" width="10" height="7" rx="1" ry="1" />
-
- <mask id="mask-clasp-cutout">
- <rect width="16" height="16" fill="#000" />
- <use xlink:href="#shape-lock-clasp-outer" fill="#fff" />
- <use xlink:href="#shape-lock-clasp-inner" fill="#000" />
- </mask>
- </defs>
-
- <use xlink:href="#shape-lock-clasp-outer" mask="url(#mask-clasp-cutout)" class="icon-default" />
- <use xlink:href="#shape-lock-base" class="icon-default" />
- <path fill="#fff" d="M10.5,5C9.8,5,9.1,5.4,8.8,6.2l-3.5,6.8c-0.4,0.7-0.4,1.4,0,2c0.4,0.6,1,1,1.8,1H14c0.8,0,1.4-0.4,1.8-1 c0.3-0.6,0.3-1.4,0-2l-3.5-6.8C11.9,5.4,11.2,5,10.5,5L10.5,5z"/>
- <path fill="#A09090" d="M14.8,13.4l-3.5-6.8C11.2,6.2,10.9,6,10.5,6c-0.3,0-0.7,0.2-0.9,0.6l-3.5,6.8c-0.2,0.4-0.2,0.8,0,1.1C6.3,14.8,6.6,15,7,15 H14c0.4,0,0.7-0.2,0.9-0.5C15.1,14.2,15,13.8,14.8,13.4z"/>
- <path fill="#fff" d="M10,8.5C10,8.2,10.2,8,10.5,8S11,8.2,11,8.5L10.8,11h-0.6L10,8.5z" />
- <circle fill="#fff" cx="10.5" cy="12.5" r=".75" />
-</svg>
--- /dev/null
+<?xml version="1.0"?>
+<!-- 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="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ width="32" height="32" viewBox="0 0 32 32">
+ <style>
+ use:not(:target) {
+ display: none;
+ }
+ #strikeout {
+ display: none;
+ }
+ .blocked:target ~ #strikeout {
+ display: block;
+ }
+ .blocked {
+ clip-path: url(#clip);
+ }
+ </style>
+
+ <defs>
+ <path id="camera-icon" d="m 2,23 a 3,3 0 0 0 3,3 l 14,0 a 3,3 0 0 0 3,-3 l 0,-4 6,5.5 c 0.5,0.5 1,0.7 2,0.5 l 0,-18 c -1,-0.2 -1.5,0 -2,0.5 l -6,5.5 0,-4 a 3,3 0 0 0 -3,-3 l -14,0 a 3,3 0 0 0 -3,3 z" />
+ <path id="desktop-notification-icon" d="m 2,20 a 4,4 0 0 0 4,4 l 13,0 7,7 0,-7 a 4,4 0 0 0 4,-4 l 0,-12 a 4,4 0 0 0 -4,-4 l -20,0 a 4,4 0 0 0 -4,4 z m 5,-2 a 1,1 0 1 1 0,-2 l 10,0 a 1,1 0 1 1 0,2 z m 0,-4 a 1,1 0 1 1 0,-2 l 14,0 a 1,1 0 1 1 0,2 z m 0,-4 a 1,1 0 1 1 0,-2 l 18,0 a 1,1 0 1 1 0,2 z" />
+ <path id="geo-linux-icon" d="m 2,15.9 a 14,14 0 1 1 0,0.2 z m 4,2.1 a 10,10 0 0 0 8,8 l 0,-4 4,0 0,4 a 10,10 0 0 0 8,-8 l -4,0 0,-4 4,0 a 10,10 0 0 0 -8,-8 l 0,4 -4,0 0,-4 a 10,10 0 0 0 -8,8 l 4,0 0,4 z" />
+ <path id="geo-linux-detailed-icon" d="m 2,15.9 a 14,14 0 1 1 0,0.2 z m 3,2.1 a 11,11 0 0 0 9,9 l 1,-5 2,0 1,5 a 11,11 0 0 0 9,-9 l -5,-1 0,-2 5,-1 a 11,11 0 0 0 -9,-9 l -1,5 -2,0 -1,-5 a 11,11 0 0 0 -9,9 l 5,1 0,2 z" />
+ <path id="geo-osx-icon" d="m 0,16 16,0 0,16 12,-28 z" />
+ <path id="geo-windows-icon" d="m 2,14 0,4 2,0 a 12,12 0 0 0 10,10 l 0,2 4,0 0,-2 a 12,12 0 0 0 10,-10 l 2,0 0,-4 -2,0 a 12,12 0 0 0 -10,-10 l 0,-2 -4,0 0,2 a 12,12 0 0 0 -10,10 z m 4,1.9 a 10,10 0 1 1 0,0.2 z m 4,0 a 6,6 0 1 1 0,0.2 z" />
+ <path id="geo-windows-detailed-icon" d="m 2,14.5 0,3 2,0.5 a 12,12 0 0 0 10,10 l 0.5,2 3,0 0.5,-2 a 12,12 0 0 0 10,-10 l 2,-0.5 0,-3 -2,-0.5 a 12,12 0 0 0 -10,-10 l -0.5,-2 -3,0 -0.5,2 a 12,12 0 0 0 -10,10 z m 4,1.4 a 10,10 0 1 1 0,0.2 z m 3,0 a 7,7 0 1 1 0,0.2 z" />
+ <path id="indexedDB-icon" d="m 2,24 a 4,4 0 0 0 4,4 l 2,0 0,-4 -2,0 0,-16 20,0 0,16 -2,0 0,4 2,0 a 4,4 0 0 0 4,-4 l 0,-16 a 4,4 0 0 0 -4,-4 l -20,0 a 4,4 0 0 0 -4,4 z m 8,-2 6,7 6,-7 -4,0 0,-8 -4,0 0,8 z" />
+ <path id="login-icon" d="m 2,26 0,4 6,0 0,-2 2,0 0,-2 1,0 0,-1 2,0 0,-3 2,0 2.5,-2.5 1.5,1.5 3,-3 a 8,8 0 1 0 -8,-8 l -3,3 2,2 z m 20,-18.1 a 2,2 0 1 1 0,0.2 z" />
+ <path id="login-detailed-icon" d="m 1,27 0,3.5 a 0.5,0.5 0 0 0 0.5,0.5 l 5,0 a 0.5,0.5 0 0 0 0.5,-0.5 l 0,-1.5 1.5,0 a 0.5,0.5 0 0 0 0.5,-0.5 l 0,-1.5 1,0 a 0.5,0.5 0 0 0 0.5,-0.5 l 0,-1 1,0 a 0.5,0.5 0 0 0 0.5,-0.5 l 0,-2 2,0 2.5,-2.5 q 0.5,-0.5 1,0 l 1,1 c 0.5,0.5 1,0.5 1.5,-0.5 l 1,-2 a 9,9 0 1 0 -8,-8 l -2,1 c -1,0.5 -1,1 -0.5,1.5 l 1.5,1.5 q 0.5,0.5 0,1 z m 21,-19.1 a 2,2 0 1 1 0,0.2 z" />
+ <path id="microphone-icon" d="m 8,14 0,4 a 8,8 0 0 0 6,7.7 l 0,2.3 -2,0 a 2,2 0 0 0 -2,2 l 12,0 a 2,2 0 0 0 -2,-2 l -2,0 0,-2.3 a 8,8 0 0 0 6,-7.7 l 0,-4 -2,0 0,4 a 6,6 0 0 1 -12,0 l 0,-4 z m 4,4 a 4,4 0 0 0 8,0 l 0,-12 a 4,4 0 0 0 -8,0 z" />
+ <path id="microphone-detailed-icon" d="m 8,18 a 8,8 0 0 0 6,7.7 l 0,2.3 -1,0 a 3,2 0 0 0 -3,2 l 12,0 a 3,2 0 0 0 -3,-2 l -1,0 0,-2.3 a 8,8 0 0 0 6,-7.7 l 0,-4 a 1,1 0 0 0 -2,0 l 0,4 a 6,6 0 0 1 -12,0 l 0,-4 a 1,1 0 0 0 -2,0 z m 4,0 a 4,4 0 0 0 8,0 l 0,-12 a 4,4 0 0 0 -8,0 z" />
+ <path id="plugin-icon" d="m 2,26 a 2,2 0 0 0 2,2 l 24,0 a 2,2 0 0 0 2,-2 l 0,-16 a 2,2 0 0 0 -2,-2 l -24,0 a 2,2 0 0 0 -2,2 z m 2,-20 10,0 0,-2 a 2,2 0 0 0 -2,-2 l -6,0 a 2,2 0 0 0 -2,2 z m 14,0 10,0 0,-2 a 2,2 0 0 0 -2,-2 l -6,0 a 2,2 0 0 0 -2,2 z" />
+ <path id="pointerLock-icon" d="m 8,24 6,-5 5,10 4,-2 -5,-10 7,-1 -17,-14 z" />
+ <path id="popup-icon" d="m 2,24 a 4,4 0 0 0 4,4 l 8,0 a 10,10 0 0 1 -2,-4 l -4,0 a 2,2 0 0 1 -2,-2 l 0,-12 18,0 0,2 a 10,10 0 0 1 4,2 l 0,-8 a 4,4 0 0 0 -4,-4 l -18,0 a 4,4 0 0 0 -4,4 z m 12,-2.1 a 8,8 0 1 1 0,0.2 m 10.7,-4.3 a 5,5 0 0 0 -6.9,6.9 z m -5.4,8.4 a 5,5 0 0 0 6.9,-6.9 z" />
+ <path id="screen-icon" d="m 2,18 a 2,2 0 0 0 2,2 l 2,0 0,-6 a 4,4 0 0 1 4,-4 l 14,0 0,-6 a 2,2 0 0 0 -2,-2 l -18,0 a 2,2 0 0 0 -2,2 z m 6,10 a 2,2 0 0 0 2,2 l 18,0 a 2,2 0 0 0 2,-2 l 0,-14 a 2,2 0 0 0 -2,-2 l -18,0 a 2,2 0 0 0 -2,2 z" />
+
+ <clipPath id="clip">
+ <path d="m 0,0 0,31 31,-31 z m 6,32 26,0 0,-26 z"/>
+ </clipPath>
+ </defs>
+
+ <use id="camera" xlink:href="#camera-icon" />
+ <use id="camera-blocked" class="blocked" xlink:href="#camera-icon" />
+ <use id="desktop-notification" xlink:href="#desktop-notification-icon" />
+ <use id="desktop-notification-blocked" class="blocked" xlink:href="#desktop-notification-icon" />
+ <use id="geo-osx" xlink:href="#geo-osx-icon" />
+ <use id="geo-osx-blocked" class="blocked" xlink:href="#geo-osx-icon" />
+ <use id="geo-linux" xlink:href="#geo-linux-icon" />
+ <use id="geo-linux-blocked" class="blocked" xlink:href="#geo-linux-icon" />
+ <use id="geo-linux-detailed" xlink:href="#geo-linux-detailed-icon" />
+ <use id="geo-windows" xlink:href="#geo-windows-icon" />
+ <use id="geo-windows-blocked" class="blocked" xlink:href="#geo-windows-icon" />
+ <use id="geo-windows-detailed" xlink:href="#geo-windows-detailed-icon" />
+ <use id="indexedDB" xlink:href="#indexedDB-icon" />
+ <use id="indexedDB-blocked" class="blocked" xlink:href="#indexedDB-icon" />
+ <use id="login" xlink:href="#login-icon" />
+ <use id="login-detailed" xlink:href="#login-detailed-icon" />
+ <use id="microphone" xlink:href="#microphone-icon" />
+ <use id="microphone-blocked" class="blocked" xlink:href="#microphone-icon" />
+ <use id="microphone-detailed" xlink:href="#microphone-detailed-icon" />
+ <use id="plugin" xlink:href="#plugin-icon" />
+ <use id="plugin-blocked" class="blocked" xlink:href="#plugin-icon" />
+ <use id="pointerLock" xlink:href="#pointerLock-icon" />
+ <use id="pointerLock-blocked" class="blocked" xlink:href="#pointerLock-icon" />
+ <use id="popup" xlink:href="#popup-icon" />
+ <use id="screen" xlink:href="#screen-icon" />
+ <use id="screen-blocked" class="blocked" xlink:href="#screen-icon" />
+
+ <path id="strikeout" d="m 2,28 2,2 26,-26 -2,-2 z"/>
+</svg>
--- /dev/null
+<?xml version="1.0"?>
+<!-- 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="http://www.w3.org/2000/svg"
+ width="32" height="32" viewBox="0 0 32 32">
+ <path id="cancel" d="m 6,9.5 6.5,6.5 -6.5,6.5 3.5,3.5 6.5,-6.5 6.5,6.5 3.5,-3.5 -6.5,-6.5 6.5,-6.5 -3.5,-3.5 -6.5,6.5 -6.5,-6.5 z" />
+</svg>
margin-right: 0;
margin-left: 0;
}
+
+/* Create a separate rule to unset these styles on .tree-input instead of
+ using :not(.tree-input) so the selector specifity doesn't change. */
+textbox.tree-input {
+ font-size: unset;
+}
/* Privacy pane */
-.doNotTrackLearnMore,
#trackingProtectionPBMLearnMore,
-#trackingProtectionLearnMore {
+#trackingProtectionLearnMore,
+#browserContainersLearnMore {
margin-inline-start: 1.5em !important;
margin-top: 0;
font-weight: normal;
}
+.doNotTrackLearnMore {
+ margin-inline-start: calc(1em + 30px);
+ margin-bottom: 1em;
+ font-weight: normal;
+}
+
+.doNotTrackLearnMore > label {
+ font-size: 1em !important;
+ margin-left: 0;
+}
+
/* Collapse the non-active vboxes in decks to use only the height the
active vbox needs */
#historyPane:not([selectedIndex="1"]) > #historyDontRememberPane,
-moz-box-align: start;
}
-#syncStatusMessage {
- visibility: collapse;
- opacity: 0;
- transition: opacity 1s linear;
- padding: 14px 8px 14px 14px;
- border-radius: 2px;
-}
-
-#syncStatusMessage[message-type] {
- visibility: visible;
- opacity: 1;
-}
-
-#syncStatusMessage[message-type="verify-success"] {
- background-color: #008484;
-}
-
-#syncStatusMessage[message-type="verify-error"] {
- background-color: #FF0000;
-}
-
-#syncStatusMessage[message-type="migration"] {
- background-color: #FF9F00;
-}
-
-#syncStatusMessageWrapper {
- -moz-box-flex: 1;
- padding-right: 5px;
-}
-
-#syncStatusMessageTitle, #syncStatusMessageDescription {
- color: #9C9CFF;
-}
-
-#syncStatusMessage[message-type="migration"] #syncStatusMessageTitle {
- display: none;
-}
-
-#syncStatusMessageTitle {
- font-weight: bold !important;
- font-size: 16px;
- line-height: 157%;
- margin: 0 0 20px;
-}
-
-#syncStatusMessageDescription {
- font-size: 14px;
- line-height: 158%;
- margin: 0 !important;
-}
-
-#syncStatusMessageClose {
- margin: 0px;
-}
-
-#syncStatusMessage {
- visibility: collapse;
- opacity: 0;
- transition: opacity 1s linear;
- padding: 14px 8px 14px 14px;
- border-radius: 2px;
-}
-
-#syncStatusMessage[message-type] {
- visibility: visible;
- opacity: 1;
-}
-
-#syncStatusMessage[message-type="verify-success"] {
- background-color: #008484;
-}
-
-#syncStatusMessage[message-type="verify-error"] {
- background-color: #FF0000;
-}
-
-#syncStatusMessage[message-type="migration"] {
- background-color: #FFCF00;
-}
-
-#syncStatusMessageWrapper {
- -moz-box-flex: 1;
- padding-right: 5px;
-}
-
-#syncStatusMessageTitle, #syncStatusMessageDescription {
- color: #A09090;
-}
-
-#syncStatusMessage[message-type="migration"] #syncStatusMessageTitle {
- display: none;
-}
-
-#syncStatusMessageTitle {
- font-weight: bold !important;
- font-size: 16px;
- line-height: 157%;
- margin: 0 0 20px;
-}
-
-#syncStatusMessageDescription {
- font-size: 14px;
- line-height: 158%;
- margin: 0 !important;
-}
-
-#syncStatusMessageClose {
- margin: 0px;
-}
-
#fxaSyncEngines > vbox:first-child {
margin-right: 80px;
}
/*
-# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*-
+# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil -*-
# 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/.
*/
-/* Global Styles */
-#BrowserPreferences radio[pane] {
- list-style-image: url("chrome://browser/skin/preferences/Options.png");
- padding: 5px 3px 1px;
-}
-
-radio[pane=paneMain] {
- -moz-image-region: rect(0, 32px, 32px, 0);
-}
-
-radio[pane=paneMain]:not([selected="true"]):hover {
- -moz-image-region: rect(32px, 32px, 64px, 0);
-}
-
-radio[pane=paneTabs] {
- -moz-image-region: rect(0, 64px, 32px, 32px);
-}
-
-radio[pane=paneTabs]:not([selected="true"]):hover {
- -moz-image-region: rect(32px, 64px, 64px, 32px);
-}
-
-#BrowserPreferences radio[pane=paneSearch] {
- list-style-image: url("chrome://browser/skin/search-pref.png");
-}
-
-#BrowserPreferences radio[pane=paneSearch]:not([selected="true"]):hover {
- list-style-image: url("chrome://browser/skin/search-pref-hover.png");
-}
-
-radio[pane=paneContent] {
- -moz-image-region: rect(0, 96px, 32px, 64px);
-}
-
-radio[pane=paneContent]:not([selected="true"]):hover {
- -moz-image-region: rect(32px, 96px, 64px, 64px);
-}
-
-radio[pane=paneApplications] {
- -moz-image-region: rect(0, 128px, 32px, 96px);
-}
-
-radio[pane=paneApplications]:not([selected="true"]):hover {
- -moz-image-region: rect(32px, 128px, 64px, 96px);
-}
-
-radio[pane=panePrivacy] {
- -moz-image-region: rect(0, 160px, 32px, 128px);
-}
-
-radio[pane=panePrivacy]:not([selected="true"]):hover {
- -moz-image-region: rect(32px, 160px, 64px, 128px);
-}
-
-radio[pane=paneSecurity] {
- -moz-image-region: rect(0, 192px, 32px, 160px);
-}
-
-radio[pane=paneSecurity]:not([selected="true"]):hover {
- -moz-image-region: rect(32px, 192px, 64px, 160px);
-}
-
-radio[pane=paneAdvanced] {
- -moz-image-region: rect(0, 224px, 32px, 192px);
-}
-
-radio[pane=paneAdvanced]:not([selected="true"]):hover {
- -moz-image-region: rect(32px, 224px, 64px, 192px);
-}
-
-radio[pane=paneSync] {
- list-style-image: url("chrome://browser/skin/preferences/Options-sync.png") !important;
-}
-
-/* These lines should be removed as part of fixing bug 1140495 */
-label.small {
- font-size: smaller;
-}
-
-#tabPrefsBox {
- margin: 6px;
-}
-
/* General Pane */
#useFirefoxSync,
cursor: pointer;
}
-/* Applications Pane */
-#BrowserPreferences[animated="true"] #handlersView {
- height: 25em;
-}
-
-#BrowserPreferences[animated="false"] #handlersView {
- -moz-box-flex: 1;
-}
-
-/* Privacy Pane */
-
-/* styles for the link elements copied from .text-link in global.css */
-.inline-link {
- color: #3333FF;
- text-decoration: none;
- cursor: pointer;
-}
-
-.inline-link:hover {
- text-decoration: underline;
-}
-
-.inline-link:-moz-focusring {
- /* Don't specify the outline-color, we should always use initial value. */
- outline: 1px dotted;
-}
-
/* Modeless Window Dialogs */
.windowDialog,
.windowDialog prefpane {
<path id="search-arrow-go-glyph" d="M1,7v2.2C1,9.8,1.4,10,2,10h7.5l-3,3.1c-0.4,0.3-0.4,1,0,1.4l0.8,0.8 c0.4,0.4,1,0.4,1.4,0l6.6-6.6c0.4-0.4,0.4-1,0-1.4L8.7,0.7c-0.4-0.4-1-0.4-1.4,0L6.5,1.6C6.1,2,6.1,2.6,6.5,3l3,3H2C1.4,6,1,6.4,1,7z"/>
</defs>
<use id="search-arrow-go" xlink:href="#search-arrow-go-glyph"/>
+ <use id="search-arrow-go-rtl" transform="rotate(180 8 8)" xlink:href="#search-arrow-go-glyph"/>
<use id="search-arrow-go-inverted" xlink:href="#search-arrow-go-glyph"/>
+ <use id="search-arrow-go-rtl-inverted" transform="rotate(180 8 8)" xlink:href="#search-arrow-go-glyph"/>
</svg>
--- /dev/null
+/* 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/. */
+
+body {
+ align-items: center;
+}
+
+.title {
+ background-image: url("chrome://browser/skin/icon-search-64.svg");
+}
+
+#defaultEngine {
+ padding-inline-start: 26px;
+ background-repeat: no-repeat;
+ background-position: 5px center;
+ background-size: 16px, 16px;
+}
+
+#defaultEngine:-moz-dir(rtl) {
+ background-position: calc(100% - 5px) center;
+}
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
#PopupSearchAutoComplete {
+ /* JS code forces the panel to have the width of the searchbar rather than
+ * the width of the textfield. Alignment of the panel with the searchbar is
+ * obtained with negative margins here: margin-inline-start when the text
+ * field is in the same direction as the rest of the UI, margin-inline-end
+ * when the textfield's direction has been reversed.
+ * (eg. using ctrl+shift+X) */
margin-inline-start: -25px;
+ margin-inline-end: -18px;
}
.autocomplete-textbox-container {
.searchbar-engine-image {
height: 16px;
width: 16px;
- list-style-image: url("chrome://global/skin/filepicker/file.gif");
+ list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
margin-inline-start: -1px;
}
width: 14px;
}
-.search-go-button:-moz-locale-dir(rtl),
-.search-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
+.search-go-button:-moz-locale-dir(rtl) {
transform: scaleX(-1);
}
background-position: right center;
}
+.searchbar-engine-one-off-item:-moz-locale-dir(rtl) {
+ background-position: left center;
+}
+
.searchbar-engine-one-off-item:not(.last-row) {
box-sizing: content-box;
border-bottom: 1px solid #9C9CFF;
padding-inline-start: 20px;
}
-.item.client.device-image-desktop.selected > .item-title-container > .item-icon-container {
- background-image: url("chrome://browser/skin/sync-desktopIcon.svg#icon-inverted");
-}
-
-.item.client.device-image-desktop:not(.selected) > .item-title-container > .item-icon-container,
-.item.client.device-image-desktop.selected > .item-title-container > .item-icon-container:-moz-window-inactive {
+.item.client.device-image-desktop > .item-title-container > .item-icon-container {
background-image: url("chrome://browser/skin/sync-desktopIcon.svg#icon");
}
-.item.client.device-image-mobile.selected > .item-title-container > .item-icon-container {
- background-image: url("chrome://browser/skin/sync-mobileIcon.svg#icon-inverted");
+.item.client.device-image-desktop.selected:focus > .item-title-container > .item-icon-container {
+ background-image: url("chrome://browser/skin/sync-desktopIcon.svg#icon-inverted");
}
-.item.client.device-image-mobile:not(.selected) > .item-title-container > .item-icon-container,
-.item.client.device-image-mobile.selected > .item-title-container > .item-icon-container:-moz-window-inactive {
+.item.client.device-image-mobile > .item-title-container > .item-icon-container {
background-image: url("chrome://browser/skin/sync-mobileIcon.svg#icon");
}
+.item.client.device-image-mobile.selected:focus > .item-title-container > .item-icon-container {
+ background-image: url("chrome://browser/skin/sync-mobileIcon.svg#icon-inverted");
+}
+
.item.tab > .item-title-container > .item-icon-container {
background-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
}
}
#screenShareButton {
- background-image: url("webRTC-screen-white-16.png");
+ background-image: url("webRTC-screen-16.png");
background-position: center center;
background-repeat: no-repeat;
background-size: 16px;
/*
-# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*-
+# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil -*-
# 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/.
-/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*-
+/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil -*-
* 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/. */
-/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*-
+/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil -*-
* 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/. */
/*
-# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*-
+# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil -*-
# 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/.
/*
-# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*-
+# -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil -*-
# 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/.