/* Page action button */
#urlbar-page-action-button {
list-style-image: url("chrome://browser/skin/page-action.svg");
+ -moz-context-properties: fill;
/* margin: 0;
padding: 0 6px;*/
- -moz-context-properties: fill;
fill: currentColor;
}
#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-icon,
#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menu-dropmarker,
#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-dropmarker,
-#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
-#main-window:not([customizing]) .toolbarbutton-1 > .toolbarbutton-menubutton-button[disabled=true] > .toolbarbutton-icon {
+#main-window:not([customizing]) .toolbarbutton-1 > .toolbarbutton-menubutton-button[disabled=true] > .toolbarbutton-icon,
+#main-window:not([customizing]) .toolbarbutton-1[disabled=true] > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon {
}
.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
min-height: 3em;
}
+/* Limit the size of the hidden description, since a deck takes the size of the biggest child */
+
+#PopupAutoCompleteRichResult > deck[anonid="search-suggestions-notification"][selectedIndex="0"] #search-suggestions-hint,
+#PopupAutoCompleteRichResult > deck[anonid="search-suggestions-notification"][selectedIndex="1"] #search-suggestions-question {
+ max-height: 5em;
+}
+
/* Opt-in notification */
#PopupAutoCompleteRichResult > deck[anonid="search-suggestions-notification"] > hbox[anonid="search-suggestions-opt-in"] {
/* Opt-out hint */
#PopupAutoCompleteRichResult > deck[anonid="search-suggestions-notification"] > hbox[anonid="search-suggestions-opt-out"] {
- font: message-box;
+/* font: message-box;*/
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ flex-wrap: nowrap;
+}
+
+#PopupAutoCompleteRichResult > deck[anonid="search-suggestions-notification"] hbox[anonid="search-suggestions-hint-box"] {
+ flex-basis: 100%;
}
#PopupAutoCompleteRichResult > deck[anonid="search-suggestions-notification"] hbox[anonid="search-suggestions-hint-box"] > description {
animation-iteration-count: 1;
animation-timing-function: ease-in-out;
animation-fill-mode: forwards;
+ min-width: 16px;
}
@keyframes search-suggestions-hint-grow {
#PopupAutoCompleteRichResult > deck[anonid="search-suggestions-notification"][animate] hbox[anonid="search-suggestions-hint-typing"] {
overflow: hidden;
- max-width: 8ch;
+ max-width: 12ch;
width: 0;
animation-name: search-suggestions-hint-typing;
animation-duration: 500ms;
animation-fill-mode: forwards;
}
+@media all and (max-width: 800px) {
+ /* Hide the typing animation block */
+ #PopupAutoCompleteRichResult > deck[anonid="search-suggestions-notification"] hbox[anonid="search-suggestions-hint-typing"] {
+ display: none;
+ }
+}
+
@keyframes search-suggestions-hint-typing {
from { width: 0; }
- to { width: 8ch; }
+ to { width: 12ch; }
}
#PopupAutoCompleteRichResult > deck[anonid="search-suggestions-notification"][animate] hbox[anonid="search-suggestions-hint-box"] {
#identity-icon,
#tracking-protection-icon,
#connection-icon,
+.notification-anchor-icon,
+#blocked-permissions-container > .blocked-permission-icon,
#extension-icon {
width: 16px;
height: 16px;
+ margin-inline-start: 2px;
-moz-context-properties: fill;
fill: #A09090;
}
#identity-icon:-moz-lwtheme,
#tracking-protection-icon:-moz-lwtheme,
#connection-icon:-moz-lwtheme,
+.notification-anchor-icon:-moz-lwtheme,
+#blocked-permissions-container > .blocked-permission-icon:-moz-lwtheme,
#extension-icon:-moz-lwtheme {
/* fill: rgba(0,0,0,.6);*/
}
/* MAIN IDENTITY ICON */
#identity-icon {
+ margin-inline-start: 0;
width: 16px;
height: 16px;
list-style-image: url(chrome://browser/skin/identity-icon.svg#normal);
height: 16px;
margin-inline-start: -16px;
position: relative;
+ -moz-context-properties: fill;
+ fill: #FF0000;
display: none;
}
#tracking-protection-icon {
list-style-image: url(chrome://browser/skin/tracking-protection-16.svg#enabled);
- margin-inline-start: 2px;
margin-inline-end: 0;
}
#extension-icon {
width: 16px;
height: 16px;
- margin-inline-start: 2px;
visibility: collapse;
}
/* REMOTE CONTROL ICON */
#main-window[remotecontrol] #remote-control-icon {
- list-style-image: url(chrome://browser/content/robot.ico);
+ list-style-image: url(chrome://browser/content/static-robot.png);
visibility: visible;
width: 16px;
height: 16px;
#PopupAutoComplete > richlistbox > richlistitem[originaltype="login"] > .ac-site-icon {
display: initial;
list-style-image: url(chrome://browser/skin/notification-icons.svg#login);
+ -moz-context-properties: fill;
+ fill: #A09090;
}
#PopupAutoComplete > richlistbox > richlistitem[originaltype="login"] > .ac-site-icon[selected] {
- list-style-image: url(chrome://browser/skin/notification-icons.svg#login-highlighted);
+ fill: #FFCF00;
}
/* Insecure field warning */
#sidebar-switcher-tabs > .toolbarbutton-icon,
#sidebar-box[sidebarcommand="viewTabsSidebar"] > #sidebar-header > #sidebar-switcher-target > #sidebar-icon {
-/* list-style-image: url(chrome://browser/skin/synced-tabs.svg);
+ list-style-image: url(chrome://browser/skin/synced-tabs.svg);
-moz-context-properties: fill;
fill: currentColor;
- opacity: 0.8;*/
- list-style-image: url(chrome://browser/skin/urlbar-tab.svg#tab);
+/* opacity: 0.8;*/
}
/* === END sidebar.inc.css === */
/* 16px of the icon + 6px of margin-inline-end of .tab-icon-image */
margin-inline-start: -22px;
position: relative;
+ -moz-context-properties: fill;
+ fill: #FF0000;
}
.tab-sharing-icon-overlay[sharing="camera"] {
.tab-icon-sound[soundplaying],
.tab-icon-sound[muted],
.tab-icon-sound[blocked] {
- list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio);
- filter: url(chrome://global/skin/filters.svg#fill);
+ list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio-playing.svg);
+ -moz-context-properties: fill;
fill: currentColor;
}
.tab-icon-sound[muted] {
- list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted);
+ list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio-muted.svg);
}
.tab-icon-sound[blocked] {
- list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-blocked);
+ list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio-blocked.svg);
}
.tab-close-button {
width: 28px;
/* width: calc(36px + var(--tab-curve-width)); */
}
+
+.tabs-newtab-button > .toolbarbutton-menu-dropmarker {
+ display: none;
+}
+
+.tabs-newtab-button > .toolbarbutton-icon {
+ /* override drop marker image padding */
+ margin-inline-end: 0;
+}
+
@media (min-resolution: 1.1dppx) {
/* image preloading hack from like lowdpi styles */
#tabbrowser-tabs::before {
.alltabs-endimage[soundplaying],
.alltabs-endimage[muted],
.alltabs-endimage[blocked] {
- list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio);
- filter: url(chrome://global/skin/filters.svg#fill);
+ list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio-playing.svg);
+ -moz-context-properties: fill;
fill: currentColor;
}
.alltabs-endimage[muted] {
- list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted);
+ list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio-muted.svg);
}
.alltabs-endimage[blocked] {
- list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-blocked);
+ list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio-blocked.svg);
}
/* === END tabs.inc.css === */
/* === BEGIN notification-icons.inc.css === */
+.popup-notification-icon,
+.identity-popup-permission-icon {
+ -moz-context-properties: fill;
+ fill: #A09090;
+}
+
#notification-popup-box {
border-radius: 3px 0 0 3px;
padding: 5px 0px;
padding-inline-end: 5px;
}
-.notification-anchor-icon,
-#blocked-permissions-container > .blocked-permission-icon {
- width: 16px;
- height: 16px;
- margin-inline-start: 2px;
-}
-
/* 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:not(.plugin-blocked),
-#blocked-permissions-container > .blocked-permission-icon {
- filter: url(chrome://global/skin/filters.svg#fill);
- fill: currentColor;
-}
-
/* INDIVIDUAL NOTIFICATIONS */
.focus-tab-by-prompt-icon {
list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin);
}
+#plugin-icon-badge {
+ list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin-badge);
+ opacity: 0;
+ transition: opacity 1.5s;
+}
+
+#plugins-notification-icon[extraAttr="inactive"] > .plugin-icon {
+ fill: #8050B0;
+}
+
+#plugins-notification-icon[extraAttr="inactive"] > #plugin-icon-badge {
+ opacity: 1;
+}
+
+#plugins-notification-icon[extraAttr="inactive"] > #plugin-icon-badge[animate] {
+ animation: blink-badge 1000ms ease 0s 5 alternate both;
+}
+
+@keyframes blink-badge {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+}
+
.plugin-icon.plugin-blocked {
list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin-blocked);
+ fill: #FF0000 !important;
}
#notification-popup-box[hidden] {
margin-inline-start: 0;
}
-.popup-notification-description[popupid="addon-webext-permissions"] {
- margin: 0;
- padding: 0;
+.popup-notification-description[popupid="addon-webext-permissions"],
+.popup-notification-description[popupid="addon-installed"] {
+ display: none;
+}
+
+.addon-webext-perm-notification-content,
+.addon-installed-notification-content {
+ margin-top: 0;
+}
+
+#addon-webext-perm-header {
+ /* Align the text more closely with the icon by clearing some top line height. */
+ margin-top: -1px;
+ margin-inline-start: 0;
+}
+
+#addon-installed-notification-header {
+ /* Align the text more closely with the icon by clearing some top line height. */
+ margin-top: -1px;
}
.addon-webext-name {
margin: 0;
}
-.addon-addon-icon {
+.addon-addon-icon,
+.addon-toolbar-icon {
width: 14px;
height: 14px;
+ vertical-align: bottom;
+ margin-bottom: 1px;
+}
+
+.addon-addon-icon {
list-style-image: url("chrome://browser/skin/menuPanel.svg");
-moz-image-region: rect(0px, 288px, 32px, 256px);
}
.addon-toolbar-icon {
- width: 14px;
- height: 14px;
list-style-image: url("chrome://browser/skin/ToolbarFx.png");
-moz-image-region: rect(0, 486px, 18px, 468px);
}
margin: 5px;
}
-.customizationmode-button:hover {
+.customizationmode-checkbox {
+}
+
+#customization-reset-button,
+#customization-undo-reset-button,
+#customization-done-button {
+}
+
+#customization-done-button {
}
.customizationmode-button > .box-inherit {
}
-.customizationmode-button > .button-icon {
+/* We use a smaller padding to ensure images don't have padding.
+ * We can't detect whether a button has an image. This button doesn't
+ * so it needs more padding, so we unfortunately hardcode the extra
+ * padding in here:
+ */
+#customization-toolbar-visibility-button {
}
-.customizationmode-button:not([type=menu]) > .button-text {
+.customizationmode-button[type=menu] > .box-inherit > .box-inherit > .button-text {
}
-.customizationmode-button > .button-menu-dropmarker {
+.customizationmode-button > .button-icon {
}
+.customizationmode-button:not([type=menu]) > .button-text {
+}
+.customizationmode-button > .box-inherit > .button-menu-dropmarker {
+}
.customizationmode-button[checked] {
background-color: #008484;
.customizationmode-button > .box-inherit > .box-inherit > .button-icon,
.customizationmode-button > .button-box > .button-icon {
-/* height: 24px;*/
+/* height: 16px;*/
}
#customization-titlebar-visibility-button {
}
#customization-lwtheme-button > .box-inherit > .box-inherit > .button-icon {
- width: 20px;
- height: 20px;
+ width: 16px;
+ height: 16px;
border-radius: 2px;
background-image: url("chrome://browser/content/default-theme-icon.svg");
background-size: contain;
color: #000000;
}
-/* Notification overrides for Heartbeat UI */
-
-notification.heartbeat {
- background-color: #A09090;
-/* height: 40px;*/
-}
-
-@keyframes pulse-onshow {
- 0% {
- opacity: 0;
- transform: scale(1.0);
- }
- 25% {
- opacity: 1;
- transform: scale(1.1);
- }
- 50% {
- transform: scale(1.0);
- }
- 75% {
- transform: scale(1.1);
- }
- 100% {
- transform: scale(1.0);
- }
-}
-
-@keyframes pulse-twice {
- 0% {
- transform: scale(1.1);
- }
- 50% {
- transform: scale(0.8);
- }
- 100% {
- transform: scale(1);
- }
-}
-
-.messageText.heartbeat {
- color: #000000;
-/* text-shadow: none; */
- margin-inline-start: 0px;
-}
-
-.messageImage.heartbeat {
- width: 24px;
- height: 24px;
- margin-inline-start: 8px;
- margin-inline-end: 8px;
-}
-
-.messageImage.heartbeat.pulse-onshow {
- animation-name: pulse-onshow;
- animation-duration: 1.5s;
- animation-iteration-count: 1;
- animation-timing-function: cubic-bezier(.7,1.8,.9,1.1);
-}
-
-.messageImage.heartbeat.pulse-twice {
- animation-name: pulse-twice;
- animation-duration: 1s;
- animation-iteration-count: 2;
- animation-timing-function: linear;
-}
-
-/* Learn More link styles */
-.heartbeat > .text-link {
- color: #3333FF;
- margin-inline-start: 0px;
-}
-
-.heartbeat > .text-link:hover {
- color: #9C9CFF;
- text-decoration: none;
-}
-
-.heartbeat > .text-link:hover:active {
- color: #FF9F00;
-}
-
-/* Heartbeat UI Rating Star Classes */
-.heartbeat > #star-rating-container {
- display: -moz-box;
-/* margin-bottom: 4px;*/
-}
-
-.heartbeat > #star-rating-container > #star5 {
- -moz-box-ordinal-group: 5;
-}
-
-.heartbeat > #star-rating-container > #star4 {
- -moz-box-ordinal-group: 4;
-}
-
-.heartbeat > #star-rating-container > #star3 {
- -moz-box-ordinal-group: 3;
-}
-
-.heartbeat > #star-rating-container > #star2 {
- -moz-box-ordinal-group: 2;
-}
-
-.heartbeat > #star-rating-container > .star-x {
- background: url("chrome://browser/skin/heartbeat-star-off.svg");
- cursor: pointer;
- /* Overrides the margin-inline-end for all platforms defined in the .plain class */
- margin-inline-end: 4px !important;
- width: 16px;
- height: 16px;
-}
-
-.heartbeat > #star-rating-container > .star-x:hover,
-.heartbeat > #star-rating-container > .star-x:hover ~ .star-x {
- background: url("chrome://browser/skin/heartbeat-star-lit.svg");
-}
-
/* === END UITour.inc.css === */
#UITourTooltipButtons {
projects / themes.git / blobdiff