comm-central/suite/themes/modern/navigator/navigator.css

Revision control

Copy as Markdown

Other Tools

/* 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/. */
@import url("chrome://communicator/skin/");
/* ::::: primary toolbar buttons ::::: */
.toolbarbutton-1 {
min-width: 0px;
}
toolbox {
border-bottom: none;
}
#appcontent {
border-top: 1px solid #494F5D;
}
#back-button {
-moz-image-region: rect(78px 42px 117px 0);
}
#back-button:hover {
-moz-image-region: rect(78px 84px 117px 42px);
}
#back-button:hover:active {
-moz-image-region: rect(78px 126px 117px 84px);
}
#back-button[disabled="true"] {
-moz-image-region: rect(78px 168px 117px 126px) !important;
}
#forward-button {
-moz-image-region: rect(117px 42px 156px 0);
}
#forward-button:hover {
-moz-image-region: rect(117px 84px 156px 42px);
}
#forward-button:hover:active {
-moz-image-region: rect(117px 126px 156px 84px);
}
#forward-button[disabled="true"] {
-moz-image-region: rect(117px 168px 156px 126px) !important;
}
#reload-button {
list-style-image: url("chrome://navigator/skin/icons/browser.png");
-moz-image-region: rect(0px 42px 39px 0);
}
#reload-button:hover {
-moz-image-region: rect(0px 84px 39px 42px);
}
#reload-button:hover:active {
-moz-image-region: rect(0px 126px 39px 84px);
}
#reload-button[disabled="true"] {
-moz-image-region: rect(0px 168px 39px 126px) !important;
}
#stop-button {
-moz-image-region: rect(39px 42px 78px 0);
}
#stop-button:hover {
-moz-image-region: rect(39px 84px 78px 42px);
}
#stop-button:hover:active {
-moz-image-region: rect(39px 126px 78px 84px);
}
#stop-button[disabled="true"] {
-moz-image-region: rect(39px 168px 78px 126px) !important;
}
#home-button {
-moz-image-region: rect(156px 42px 195px 0);
}
#home-button:hover {
-moz-image-region: rect(156px 84px 195px 42px);
}
#home-button:hover:active {
-moz-image-region: rect(156px 126px 195px 84px);
}
#home-button[disabled="true"] {
-moz-image-region: rect(156px 168px 195px 126px) !important;
}
#sync-button {
}
#sync-button > .toolbarbutton-icon {
margin-top: 5px;
margin-bottom: 4px;
margin-inline-start: 5px;
margin-inline-end: 7px;
}
#sync-button[status=active] {
}
/* ::::: small primary toolbar buttons ::::: */
toolbar[iconsize="small"] > toolbarpaletteitem > #back-button,
toolbar[iconsize="small"] > #back-button {
-moz-image-region: rect(38px 19px 57px 0);
}
toolbar[iconsize="small"] > #back-button:hover {
-moz-image-region: rect(38px 38px 57px 19px);
}
toolbar[iconsize="small"] > #back-button:hover:active {
-moz-image-region: rect(38px 57px 57px 38px);
}
toolbar[iconsize="small"] > #back-button[disabled="true"] {
-moz-image-region: rect(38px 76px 57px 57px) !important;
}
toolbar[iconsize="small"] > toolbarpaletteitem > #forward-button,
toolbar[iconsize="small"] > #forward-button {
-moz-image-region: rect(57px 19px 76px 0);
}
toolbar[iconsize="small"] > #forward-button:hover {
-moz-image-region: rect(57px 38px 76px 19px);
}
toolbar[iconsize="small"] > #forward-button:hover:active {
-moz-image-region: rect(57px 57px 76px 38px);
}
toolbar[iconsize="small"] > #forward-button[disabled="true"] {
-moz-image-region: rect(57px 76px 76px 57px) !important;
}
toolbar[iconsize="small"] > toolbarpaletteitem > #reload-button,
toolbar[iconsize="small"] > #reload-button {
-moz-image-region: rect(0 19px 19px 0);
}
toolbar[iconsize="small"] > #reload-button:hover {
-moz-image-region: rect(0 38px 19px 19px);
}
toolbar[iconsize="small"] > #reload-button:hover:active {
-moz-image-region: rect(0 57px 19px 38px);
}
toolbar[iconsize="small"] > #reload-button[disabled="true"] {
-moz-image-region: rect(0 76px 19px 57px) !important;
}
toolbar[iconsize="small"] > toolbarpaletteitem > #stop-button,
toolbar[iconsize="small"] > #stop-button {
-moz-image-region: rect(19px 19px 38px 0);
}
toolbar[iconsize="small"] > #stop-button:hover {
-moz-image-region: rect(19px 38px 38px 19px);
}
toolbar[iconsize="small"] > #stop-button:hover:active {
-moz-image-region: rect(19px 57px 38px 38px);
}
toolbar[iconsize="small"] > #stop-button[disabled="true"] {
-moz-image-region: rect(19px 76px 38px 57px) !important;
}
toolbar[iconsize="small"] > toolbarpaletteitem > #home-button,
toolbar[iconsize="small"] > #home-button {
-moz-image-region: rect(76px 19px 95px 0);
}
toolbar[iconsize="small"] > #home-button:hover {
-moz-image-region: rect(76px 38px 95px 19px);
}
toolbar[iconsize="small"] > #home-button:hover:active {
-moz-image-region: rect(76px 57px 95px 38px);
}
toolbar[iconsize="small"] > #home-button[disabled="true"] {
-moz-image-region: rect(76px 76px 95px 57px) !important;
}
toolbar[iconsize="small"] > toolbarpaletteitem > #sync-button,
toolbar[iconsize="small"] > #sync-button {
}
toolbar[iconsize="small"] > toolbarpaletteitem > #sync-button > .toolbarbutton-icon,
toolbar[iconsize="small"] > #sync-button > .toolbarbutton-icon {
margin-top: 2px;
margin-bottom: 3px;
margin-inline-start: 3px;
margin-inline-end: 5px;
}
toolbar[iconsize="small"] > toolbarpaletteitem > #sync-button[status=active],
toolbar[iconsize="small"] > #sync-button[status=active] {
}
#nav-bar[iconsize="small"] {
min-height: 0;
}
/* ::::: fullscreen window controls ::::: */
#window-controls {
-moz-box-align: center;
padding-top: 0px;
padding-bottom: 0px;
padding-inline-start: 4px;
padding-inline-end: 2px;
background-color: #A9B2BD;
border-left: 1px solid #B6BEC5;
}
#window-controls > toolbarbutton {
min-width: 0;
border: none;
}
toolbar[mode="text"] > #window-controls > toolbarbutton > .toolbarbutton-icon {
display: -moz-box;
}
#minimize-button {
-moz-image-region: rect(16px 15px 32px 0);
}
#minimize-button:hover {
-moz-image-region: rect(16px 30px 32px 15px);
}
#minimize-button:hover:active {
-moz-image-region: rect(16px 45px 32px 30px);
}
#minimize-button[disabled="true"] {
-moz-image-region: rect(16px 60px 32px 45px) !important;
}
#restore-button {
-moz-image-region: rect(0 15px 16px 0);
}
#restore-button:hover {
-moz-image-region: rect(0 30px 16px 15px);
}
#restore-button:hover:active {
-moz-image-region: rect(0 45px 16px 30px);
}
#restore-button[disabled="true"] {
-moz-image-region: rect(0 60px 16px 45px) !important;
}
#close-button {
-moz-image-region: rect(32px 15px 48px 0);
}
#close-button:hover {
-moz-image-region: rect(32px 30px 48px 15px);
}
#close-button:hover:active {
-moz-image-region: rect(32px 45px 48px 30px);
}
#close-button[disabled="true"] {
-moz-image-region: rect(32px 60px 48px 45px) !important;
}
/* ::::: special menubutton dropmarkers ::::: */
/* ..... dropmarker box ..... */
#back-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker,
#forward-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker
{
margin-top: 20px;
margin-bottom: 0px;
margin-inline-start: 34px;
margin-inline-end: 0px;
}
#print-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker
{
margin-top: 20px;
margin-bottom: 0px;
margin-inline-start: 40px;
margin-inline-end: 0px;
}
toolbar[mode="icons"] #back-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker,
toolbar[mode="icons"] #forward-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker
{
margin-top: 30px;
margin-bottom: 0px;
margin-inline-start: 34px;
margin-inline-end: 0px;
}
toolbar[iconsize=small] #back-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker,
toolbar[iconsize=small] #forward-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker,
toolbar[iconsize=small] #print-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker
{
margin-top: 8px;
margin-bottom: 8px;
margin-inline-start: 14px;
margin-inline-end: 0px;
}
toolbar[iconsize=small][mode="icons"] #back-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker,
toolbar[iconsize=small][mode="icons"] #forward-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker,
toolbar[iconsize=small][mode="icons"] #print-button > .toolbarbutton-menubutton-stack
> .toolbarbutton-menubutton-dropmarker
{
margin-top: 8px;
margin-bottom: 0px;
margin-inline-start: 14px;
margin-inline-end: 0px;
}
/* ::::: nav-bar - the navigator primary toolbar ::::: */
.toolbar-primary-icon {
display: none;
}
.toolbar-primary-holder {
-moz-box-align: start;
}
/* ::::: the grooved area around the urlbar and associated buttons ::::: */
.nav-bar-class {
-moz-box-align: center;
margin-top: 7px;
margin-bottom: 3px;
border-top: 1px solid;
border-bottom: 1px solid;
border-top-color: #A2AFBD;
border-right-color: #A2AFBD;
border-bottom-color: #939EAA;
border-left-color: #9FABB9;
padding: 0px;
min-width: 0px;
}
.nav-bar-first,
toolbarpaletteitem > .nav-bar-class {
margin-inline-start: 5px;
border-inline-start: 2px solid #D2DAE1;
padding-inline-start: 3px;
}
.nav-bar-last,
toolbarpaletteitem > .nav-bar-class {
margin-inline-end: 0px;
border-inline-end: 2px solid #A2AFBD;
padding-inline-end: 3px;
}
.nav-bar-last:-moz-locale-dir(rtl),
.nav-bar-first:-moz-locale-dir(ltr),
toolbarpaletteitem > .nav-bar-class:-moz-locale-dir(rtl),
toolbarpaletteitem > .nav-bar-class:-moz-locale-dir(ltr) {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
.nav-bar-last:-moz-locale-dir(ltr),
.nav-bar-first:-moz-locale-dir(rtl),
toolbarpaletteitem > .nav-bar-class:-moz-locale-dir(ltr),
toolbarpaletteitem > .nav-bar-class:-moz-locale-dir(rtl) {
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
}
toolbar[mode="text"] > .nav-bar-class,
toolbar[iconsize="small"] > .nav-bar-class,
toolbar[mode="text"] > toolbarpaletteitem > .nav-bar-class,
toolbar[iconsize="small"] > toolbarpaletteitem > .nav-bar-class {
margin: 0 !important;
padding: 0 !important;
border: none !important;
}
toolbar[mode="text"] #search-button {
margin-inline-end: 0px;
}
#search-button > .button-box > .button-icon {
display: -moz-box;
}
toolbar[mode="text"] #search-button > .button-box > .button-icon,
toolbar[mode="icons"] #search-button > .button-box > .button-text {
display: none;
}
#wrapper-nav-bar-inner[place="palette"] > #nav-bar-inner
> .button-toolbar,
#wrapper-nav-bar-inner[place="palette"] > #nav-bar-inner
> #urlbar > .urlbar-icons {
display: none;
}
/* ::::: urlbar - the url textbox ::::: */
.searchbar-textbox,
#urlbar {
margin-top: 2px;
margin-bottom: 2px;
margin-inline-start: 3px;
margin-inline-end: 6px;
padding: 3px;
border: 1px solid #000000;
background-color: #EDF5F7;
box-shadow: inset 0px -2px #E9F3F6;
}
#urlbar[level="high"] {
background-color: #E8DB99;
box-shadow: none;
}
#urlbar-search-splitter {
min-width: 6px;
margin: 0 -3px;
border: none;
background-color: transparent;
}
/* ::::: notification popups ::::: */
.popup-notification-icon {
width: 64px;
height: 64px;
margin-inline-end: 10px;
}
.popup-notification-icon[popupid="geolocation"] {
}
.popup-notification-icon[popupid="persistent-storage"] {
}
.popup-notification-icon[popupid="web-notifications"] {
}
.popup-notification-icon[popupid="addon-install-disabled"],
.popup-notification-icon[popupid="addon-install-blocked"],
.popup-notification-icon[popupid="addon-install-started"],
.popup-notification-icon[popupid="addon-install-cancelled"],
.popup-notification-icon[popupid="addon-install-failed"],
.popup-notification-icon[popupid="addon-install-complete"],
.popup-notification-icon[popupid="lwtheme-install-request"],
.popup-notification-icon[popupid="lwtheme-install-notification"] {
width: 32px;
height: 32px;
}
.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
.popup-notification-icon[popupid="indexedDB-quota-prompt"] {
list-style-image: url("chrome://global/skin/icons/question-64.png");
}
.popup-notification-icon[popupid="password"] {
}
.addon-progress-description {
width: 350px;
max-width: 350px;
}
/* Notification icon box */
#notification-popup-box {
margin-inline-end: 3px;
}
.notification-anchor-icon:-moz-focusring {
outline: 1px dotted;
}
#default-notification-icon {
width: 16px;
height: 16px;
}
#geo-notification-icon {
width: 16px;
height: 16px;
}
#web-notifications-notification-icon {
width: 16px;
height: 16px;
}
#addons-notification-icon {
width: 16px;
height: 16px;
}
#indexedDB-notification-icon {
list-style-image: url("chrome://global/skin/icons/question-16.png");
width: 16px;
height: 16px;
}
#password-notification-icon {
width: 16px;
height: 16px;
}
#persistent-storage-notification-icon {
width: 16px;
height: 16px;
}
.center-item-box {
padding: 8px 16px 0px 16px;
}
.center-item-box[padbottom="true"] {
padding-bottom: 8px;
}
.center-item-icon {
background-repeat: no-repeat;
height: 16px;
width: 16px;
margin-bottom: 4px;
}
.center-item-box[warn="true"] {
background-repeat: repeat-x;
padding: 8px 16px 6px 16px;
}
.center-item-box[padbottom="true"][warn="true"] {
padding-bottom: 4px;
}
.center-item-box[showseparator="true"] {
border-top: 1px solid #B1BBC5;
}
.center-item-box[warn="false"] > .center-item-warning {
display: none;
}
.center-item-warning > .text-link[href=""] {
display: none;
}
.center-item-warning-icon {
background-repeat: no-repeat;
width: 16px;
height: 15px;
margin-bottom: 4px;
}
.center-item-warning-description {
color: #828282;
}
.center-item-button {
min-width: 0px;
}
/* ::::: page proxy icon ::::: */
#page-proxy-deck,
#page-proxy-button,
#page-proxy-favicon {
width: 16px;
height: 16px;
}
#page-proxy-deck {
cursor: grab;
margin-inline-end: 4px;
}
#page-proxy-button {
}
#page-proxy-favicon {
list-style-image: none;
}
#page-proxy-button[pageproxystate="invalid"] {
cursor: default;
}
/* ::::: autocomplete ::::: */
#PopupAutoComplete > richlistbox > richlistitem {
height: 20px;
min-height: 20px;
border: 0;
border-radius: 0;
padding: 0px 1px 0px 1px;
}
#PopupAutoComplete > richlistbox > richlistitem > .ac-title {
font: icon;
margin-inline-start: 6px;
}
#PopupAutoComplete > richlistbox {
padding: 0;
}
.autocomplete-treebody::-moz-tree-cell-text(value) {
padding-inline-start: 15px;
}
.autocomplete-treebody::-moz-tree-cell-text(comment) {
color: #555566;
}
.autocomplete-search-box {
border-top: 2px groove #DDE3EB;
background-color: #DDE3EB;
}
panel[nomatch="true"] > .autocomplete-search-box {
border-top: 1px solid #E4EAEF;
}
.autocomplete-search-engine {
padding: 2px;
}
.autocomplete-search-engine[menuactive="true"] {
background-color: #9499AC;
color: #FFFFFF;
}
.autocomplete-search-engine-img {
margin-inline-end: 4px;
width: 16px;
height: 16px;
}
.autocomplete-history-dropmarker {
margin-top: 0px;
margin-bottom: 0px;
margin-inline-start: 0px;
margin-inline-end: 3px;
}
.autocomplete-history-dropmarker[open="true"] {
}
.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
color: #999999;
}
/* ::::: go and searchbuttons ::::: */
#go-button,
#search-button {
margin-top: 0px;
margin-bottom: 0px;
margin-inline-start: 0px;
margin-inline-end: 4px;
min-width: 0px;
font: message-box;
font-weight: bold;
}
#search-button {
list-style-image: url("chrome://global/skin/icons/search.png");
}
/* ::::: navigator throbber ::::: */
.toolbar-primary #throbber-box {
margin: 0px 0px 2px;
}
/* ::::: personal toolbar ::::: */
#PersonalToolbar {
background: url("chrome://global/skin/toolbar/tb-mid.png") #C7D0D9 repeat-x top;
}
#PersonalToolbar > .toolbar-box > toolbargrippy,
#PersonalToolbar > .toolbar-box > .toolbar-holder {
border-top: 1px solid #CED6DD;
border-right: 1px solid #95A0AD;
border-bottom: 1px solid #95A0AD;
border-left: 1px solid #DAE3ED;
}
#PersonalToolbar > .toolbar-box > toolbargrippy:hover:active {
border-color: #67737E;
}
toolbarbutton.chevron {
list-style-image: url("chrome://global/skin/toolbar/chevron.png") !important;
}
toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
display: none;
}
toolbarbutton.chevron > .toolbarbutton-text {
display: none; /* hide chevron label which has a width even if blank */
}
toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
display: -moz-box; /* display chevron icon in text mode */
}
/* Prevent [mode="icons"|"text"] from hiding the label and icon */
#PlacesToolbarItems .bookmark-item > .toolbarbutton-text,
#PlacesToolbarItems .bookmark-item > .toolbarbutton-icon {
display: -moz-box !important;
}
#PersonalToolbar[iconsize="small"] > toolbarpaletteitem > #home-button > .toolbarbutton-icon,
#PersonalToolbar[iconsize="small"] > #home-button > .toolbarbutton-icon {
width: 16px;
height: 16px;
}
#PersonalToolbar > #home-button {
cursor: pointer;
}
#PersonalToolbar > #home-button:hover {
text-decoration: underline;
}
#PersonalToolbar > #home-button[disabled="true"] {
cursor: default !important;
text-decoration: none !important;
}
/*
In customize mode we hide the normal bookmark items and show a placeholder
for the drag/drop UI.
*/
.bookmarks-toolbar-customize {
display: none;
max-width: 15em !important;
}
#wrapper-personal-bookmarks[place="palette"] > .toolbarpaletteitem-box {
width: 16px;
height: 16px;
}
/* ::::: content area ::::: */
#content {
border-bottom: 1px solid #494F5D;
}
#status-bar {
border-top: none;
min-width: 1px;
}
#security-button[level="high"] > .statusbarpanel-contentbox {
background-color: #B4CD32;
}
#security-button[level="broken"] > .statusbarpanel-contentbox {
background-color: #E83404;
}
#security-button[label] > .statusbarpanel-contentbox {
background-color: #62C441;
}
#security-button > .statusbarpanel-contentbox > .statusbarpanel-text {
margin: 0px;
color: #FFFFFF;
}
#ev-button {
}
#popupIcon {
}
#invalid-form-popup {
border: 1px solid #000000;
padding: 2px 3px 0px 3px;
max-width: 40em;
background-color: #FFFFE7;
color: #000000;
font: message-box;
font-weight: bold;
}
/* ::::: star button ::::: */
#star-button {
-moz-image-region: rect(16px 16px 32px 0px);
}
#star-button:hover {
-moz-image-region: rect(16px 32px 32px 16px);
}
#star-button:hover:active {
-moz-image-region: rect(16px 48px 32px 32px);
}
#star-button[starred="true"] {
-moz-image-region: rect(0px 16px 16px 0px);
}
#star-button[starred="true"]:hover {
-moz-image-region: rect(0px 32px 16px 16px);
}
#star-button[starred="true"]:hover:active {
-moz-image-region: rect(0px 48px 16px 32px);
}
#editBookmarkPanelStarIcon {
-moz-image-region: rect(0px 16px 16px 0px);
}
/* ::::: feeds ::::: */
.feedsMenu {
list-style-image: url("chrome://navigator/skin/btn1/feeds.png");
-moz-image-region: rect(0px 16px 16px 0px);
}
.feedsMenu[_moz-menuactive="true"] {
-moz-image-region: rect(16px 16px 32px 0px);
}
.feedsMenu[disabled="true"] {
-moz-image-region: rect(32px 16px 48px 0px);
}
.feedsMenu[open="true"] {
-moz-image-region: rect(48px 16px 64px 0px);
}
#feedsButton {
list-style-image: url("chrome://navigator/skin/btn1/feeds.png");
-moz-image-region: rect(0px 32px 16px 16px);
}
#feedsButton:hover {
-moz-image-region: rect(16px 32px 32px 16px);
}
/* Need to set fixed width to stop the zoom display from changing size and moving around the zoom buttons */
#zoomLevel-display {
width: 60px;
max-width: 60px;
margin-left: 0px;
margin-right: 0px;
}
.zoom-button-align{
padding-bottom: 3px;
}