:root {
/*--backbutton-urlbar-overlap: 5px;*/
+ /* icon width + border + horizontal padding (includes the overlap from backbutton-urlbar-overlap) */
+ --forwardbutton-width: 27px;
+ /* icon width + border + horizontal padding (without the overlap from backbutton-urlbar-overlap) /
+ --forwardbutton-width: 25px;*/
+
--identity-box-verified-background-color: #000000;
--panel-separator-color: #A09090;
/* margin-top: var(--space-above-tabbar);*/
}
-@media (-moz-mac-graphite-theme: 0) and (-moz-mac-lion-theme: 0) {
- /* This is a hackish workaround to exclude most of Mac OS until bug 1060941 gets fixed. */
- #toolbar-menubar:not([autohide="true"]) {
- -moz-binding: url("chrome://global/skin/globalBindings.xml#toolbar-drag-browsercustom");
- }
-}
-
@media (-moz-mac-graphite-theme), (-moz-mac-lion-theme) {
/* This is a hackish workaround to cover most of Mac OS until bug 1060941 gets fixed. */
#main-window[tabsintitlebar]:not([inFullscreen="true"]) #TabsToolbar {
#preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button,
#history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button,
#email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button,
- #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, #loop-button),
+ #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button),
#bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
list-style-image: url("chrome://browser/skin/ToolbarFx.png");
}
}
#sync-button[cui-areatype="toolbar"] {
- -moz-image-region: rect(0, 270px, 18px, 252px);
+ -moz-image-region: rect(0, 792px, 18px, 774px);
}
#sync-button[cui-areatype="toolbar"]:hover {
- -moz-image-region: rect(18px, 270px, 36px, 252px);
+ -moz-image-region: rect(18px, 792px, 36px, 774px);
}
-#sync-button[cui-areatype="toolbar"][status="active"],
-#sync-button[cui-areatype="toolbar"][status="active"]:hover:active:not([disabled="true"]) {
- list-style-image: url("chrome://browser/skin/syncProgress-toolbar.png");
- -moz-image-region: rect(0, 18px, 18px, 0px);
-}
-
-/*
-#sync-button[cui-areatype="toolbar"][status="active"]:-moz-lwtheme-brighttext,
-#sync-button[cui-areatype="toolbar"][status="active"]:-moz-lwtheme-brighttext:hover:active:not([disabled="true"]) {
- list-style-image: url("chrome://browser/skin/syncProgress-toolbar-inverted.png");
-}
-*/
-
#feed-button[cui-areatype="toolbar"] {
-moz-image-region: rect(0, 288px, 18px, 270px);
}
transform: scaleX(-1);
}
-#loop-button,
-#loop-button > .toolbarbutton-badge-stack {
- list-style-image: url("chrome://browser/skin/loop/toolbarfx.png");
- -moz-image-region: rect(0, 18px, 18px, 0);
-}
-
-#loop-button:not([disabled="true"]):-moz-any(:hover,:hover:active,[open]),
-#loop-button:not([disabled="true"]):-moz-any(:hover,:hover:active,[open]) > .toolbarbutton-badge-stack {
- -moz-image-region: rect(0, 90px, 18px, 72px);
-}
-
-#loop-button[state="disabled"],
-#loop-button[disabled="true"],
-#loop-button[state="disabled"] > .toolbarbutton-badge-stack,
-#loop-button[disabled="true"] > .toolbarbutton-badge-stack {
- -moz-image-region: rect(0, 36px, 18px, 18px);
-}
-
-#loop-button[disabled="true"]:-moz-any(:hover,:hover:active,[open]),
-#loop-button[disabled="true"]:-moz-any(:hover,:hover:active,[open]) > .toolbarbutton-badge-stack {
- -moz-image-region: rect(0, 126px, 18px, 108px);
-}
-
-#loop-button:not([disabled="true"])[state="error"],
-#loop-button:not([disabled="true"])[state="error"] > .toolbarbutton-badge-stack {
- -moz-image-region: rect(0, 54px, 18px, 36px);
-}
-
-#loop-button:not([disabled="true"])[state="action"],
-#loop-button:not([disabled="true"])[state="action"] > .toolbarbutton-badge-stack {
- -moz-image-region: rect(0, 72px, 18px, 54px);
-}
-
-#loop-button:not([disabled="true"])[state="active"],
-#loop-button:not([disabled="true"])[state="active"] > .toolbarbutton-badge-stack {
- -moz-image-region: rect(0, 108px, 18px, 90px);
-}
-
#webide-button[cui-areatype="toolbar"] {
-moz-image-region: rect(0, 738px, 18px, 720px);
}
#preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button,
#history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button,
#email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button,
- #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, #loop-button)[cui-areatype="menu-panel"],
+ #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)[cui-areatype="menu-panel"],
toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button,
#new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #tabview-button,
#social-share-button, #open-file-button, #find-button, #developer-button,
#preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button,
#history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button,
#email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button,
- #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, #loop-button) {
+ #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) {
list-style-image: var(--menupanel-list-style-image);
}
#sync-button[cui-areatype="menu-panel"],
toolbarpaletteitem[place="palette"] > #sync-button {
- -moz-image-region: rect(0px, 384px, 32px, 352px);
+ -moz-image-region: rect(0px, 1024px, 32px, 992px);
}
#sync-button[cui-areatype="menu-panel"]:hover,
toolbarpaletteitem[place="palette"] > #sync-button:hover {
- -moz-image-region: rect(32px, 384px, 64px, 352px);
-}
-
-#sync-button[cui-areatype="menu-panel"][status="active"] {
- list-style-image: url("chrome://browser/skin/syncProgress-menuPanel.png");
- -moz-image-region: rect(0px, 32px, 32px, 0px);
+ -moz-image-region: rect(32px, 1024px, 64px, 992px);
}
#feed-button[cui-areatype="menu-panel"],
-moz-image-region: rect(0, 832px, 32px, 800px);
}
-#loop-button[cui-areatype="menu-panel"],
-toolbarpaletteitem[place="palette"] > #loop-button {
- list-style-image: url("chrome://browser/skin/loop/menuPanel.png");
- -moz-image-region: rect(0, 32px, 32px, 0);
-}
-
-/* Make sure that the state icons are not shown in the customization palette. */
-toolbarpaletteitem[place="palette"] > #loop-button {
- -moz-image-region: rect(0, 32px, 32px, 0) !important;
-}
-
-#loop-button[cui-areatype="menu-panel"]:not([disabled="true"]):-moz-any(:hover,:hover:active,[open]) {
- -moz-image-region: rect(0, 160px, 32px, 128px);
-}
-
-#loop-button[cui-areatype="menu-panel"][state="disabled"],
-#loop-button[cui-areatype="menu-panel"][disabled="true"] {
- -moz-image-region: rect(0, 64px, 32px, 32px);
-}
-
-#loop-button[cui-areatype="menu-panel"][disabled="true"]:-moz-any(:hover,:hover:active,[open]) {
- -moz-image-region: rect(0, 224px, 32px, 192px);
-}
-
-#loop-button[cui-areatype="menu-panel"]:not([disabled="true"])[state="error"] {
- -moz-image-region: rect(0, 96px, 32px, 64px);
-}
-
-#loop-button[cui-areatype="menu-panel"]:not([disabled="true"])[state="action"] {
- -moz-image-region: rect(0, 128px, 32px, 96px);
-}
-
-#loop-button[cui-areatype="menu-panel"]:not([disabled="true"])[state="active"] {
- -moz-image-region: rect(0, 192px, 32px, 160px);
-}
-
/* Wide panel control icons */
#edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton,
margin-top: 3px;
margin-bottom: 3px;
border-radius: 0 10000px 10000px 0;
+/* max-width: calc(var(--forwardbutton-width) + var(--backbutton-urlbar-overlap)) !important; */
}
#forward-button:-moz-locale-dir(rtl) {
}
window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] {
- margin-left: -27px !important;
+ margin-left: calc(0px - var(--forwardbutton-width)/* - var(--backbutton-urlbar-overlap)*/);
}
window:not([chromehidden~="toolbar"]) #urlbar-wrapper:hover:not([switchingtabs]) > #forward-button[disabled] {
window:not([chromehidden~="toolbar"]) #urlbar-wrapper:not(:hover) > #forward-button[disabled] {
/* when not hovered anymore, trigger a new transition to hide the forward button immediately */
- margin-left: -27.01px !important;
+ margin-left: calc(-0.01px - var(--forwardbutton-width)/* - var(--backbutton-urlbar-overlap)*/);
}
#back-button {
/* identity box */
#identity-box.verifiedIdentity:not(:-moz-lwtheme):not(:hover):not([open=true]) {
- var(--identity-box-verified-background-color);
+ background-color: var(--identity-box-verified-background-color);
}
#identity-box:-moz-focusring {
transition: opacity 0.15s ease;
}
-#navigator-toolbox:not(:hover) .urlbar-history-dropmarker {
+#urlbar-wrapper[switchingtabs] > #urlbar > .urlbar-textbox-container > .urlbar-history-dropmarker {
+ transition: none;
+}
+
+#navigator-toolbox:not(:hover) #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 --urlbar-separator-color);
+ border-inline-end: 1px solid var(--urlbar-separator-color);
font-size: .9em;
border-radius: 2px;
padding: 3px 5px;
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 {
color: #9C9CFF;
}
-richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
+richlistitem[type~="action"][actiontype="tab"] > .ac-url-box > .ac-action-icon {
list-style-image: url("chrome://browser/skin/actionicon-tab.png");
-moz-image-region: rect(0, 16px, 16px, 0);
padding: 0 3px;
}
@media (min-resolution: 1.1dppx) {
- richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
+ richlistitem[type~="action"][actiontype="tab"] > .ac-url-box > .ac-action-icon {
list-style-image: url("chrome://browser/skin/actionicon-tab@2x.png");
-moz-image-region: rect(0, 32px, 32px, 0);
}
}
-richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
+richlistitem[type~="action"][actiontype="tab"][selected="true"] > .ac-url-box > .ac-action-icon {
-moz-image-region: rect(16px, 16px, 32px, 0);
}
}
.tabs-newtab-button,
-#TabsToolbar > #new-tab-button {
+#TabsToolbar > #new-tab-button,
+#TabsToolbar > toolbarpaletteitem > #new-tab-button,
+#TabsToolbar > toolbarpaletteitem > #new-tab-button[cui-areatype="toolbar"] {
border-radius: 8px 8px 0px 0px;
-moz-margin-start: 0;
}
.tabs-newtab-button:not(:hover),
-#TabsToolbar > #new-tab-button:not(:hover) {
+#TabsToolbar > #new-tab-button:not(:hover),
+#TabsToolbar > toolbarpaletteitem > #new-tab-button,
+#TabsToolbar > toolbarpaletteitem > #new-tab-button[cui-areatype="toolbar"] {
background-color: #C09070;
}
height: 16px;
margin-top: -8px;
-moz-margin-start: -15px;
+ margin-inline-end: -1px;
position: relative;
}
#TabsToolbar > #new-tab-button,
#TabsToolbar > toolbarpaletteitem > #new-tab-button,
#TabsToolbar > toolbarpaletteitem > #new-tab-button[cui-areatype="toolbar"] {
- list-style-image: url("chrome://browser/skin/tabbrowser/newtabFx.png");
- -moz-image-region: rect(0, 16px, 18px, 0);
+ list-style-image: url("chrome://browser/skin/tabbrowser/newtab.svg");
+ -moz-image-region: auto;
}
.tabs-newtab-button,
.tabs-newtab-button:hover,
#TabsToolbar > #new-tab-button,
#TabsToolbar > #new-tab-button:hover {
- -moz-image-region: rect(0, 32px, 18px, 16px);
}
#main-window[tabsintitlebar]:not([inFullscreen]) .tabs-newtab-button:-moz-system-metric(windows-classic):not(:-moz-lwtheme),
list-style-image: url("chrome://mozapps/skin/passwordmgr/key-64.png");
}
-.popup-notification-icon[popupid="webapps-install-progress"],
-.popup-notification-icon[popupid="webapps-install"] {
- list-style-image: url("chrome://global/skin/icons/webapps-64.png");
-}
-
.popup-notification-icon[popupid="webRTC-sharingDevices"],
.popup-notification-icon[popupid="webRTC-shareDevices"] {
list-style-image: url("chrome://browser/skin/webRTC-shareDevice-64.png");
outline: 1px dotted #008484;
}
-.identity-notification-icon,
-#identity-notification-icon {
- list-style-image: url("chrome://mozapps/skin/profile/profileicon.png");
-}
-
.geo-notification-icon,
#geo-notification-icon {
list-style-image: url("chrome://browser/skin/Geolocation-16.png");
transform: scaleX(-1);
}
-#webapps-notification-icon {
- list-style-image: url("chrome://gobal/skin/icons/webapps-16.png");
-}
-
#plugins-notification-icon {
list-style-image: url("chrome://browser/skin/notification-pluginNormal.png");
}
-moz-appearance: none;
}
-/* Loop/ Hello browser styles */
-
-notification[value="loop-sharing-notification"] .button-menubutton-button {
- min-width: 0;
- border: 0;
- margin: 0;
-}
-
-notification[value="loop-sharing-notification"] .messageImage {
- list-style-image: url(chrome://browser/skin/webRTC-shareScreen-16.png);
-}
-
/* Bookmarks roots menu-items */
#subscribeToPageMenuitem:not([disabled]),
-#subscribeToPageMenupopup,
-#BMB_subscribeToPageMenuitem:not([disabled]),
-#BMB_subscribeToPageMenupopup {
+#subscribeToPageMenupopup {
list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
}
html|*#fullscreen-exit-button {
padding: 5px 30px;
- font: "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
+ font-family: "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
font-size: 14px;
font-weight: lighter;
margin: 0;
transform: none;
}
-chatbox[src^="about:loopconversation#"] .chat-minimize-button {
- list-style-image: url("chrome://browser/skin/social/chat-icons.svg#minimize-white");
-}
-
-chatbox[src^="about:loopconversation#"] .chat-swap-button {
- list-style-image: url("chrome://browser/skin/social/chat-icons.svg#expand-white");
-}
-
-.chat-loop-hangup {
- list-style-image: url("chrome://browser/skin/social/chat-icons.svg#exit-white");
- background-color: #FF0000;
- border: 1px solid #FFC000;
- border-top-right-radius: 4px;
- width: 32px;
- height: 26px;
- margin-top: -6px;
- margin-bottom: -5px;
- -moz-margin-start: 6px;
- -moz-margin-end: -5px;
-}
-
-.chat-toolbarbutton.chat-loop-hangup:-moz-any(:hover,:hover:active) {
- background-color: #FFCF00;
- border-color: #FF0000;
-}
-
.chat-title {
color: #000000;
text-shadow: none;
cursor: inherit;
}
-chatbox[src^="about:loopconversation#"] .chat-title {
-/* color: white;*/
-}
-
.chat-titlebar {
background-color: #9C9CFF;
color: #000000;
background-color: #008484;
}
-chatbox[src^="about:loopconversation#"] > .chat-titlebar {
- background-color: #008484;
- border-color: #008484;
-}
-
.chat-titlebar > .notification-anchor-icon {
margin-left: 2px;
margin-right: 2px;