michael@0: /* This Source Code Form is subject to the terms of the Mozilla Public
michael@0:  * License, v. 2.0. If a copy of the MPL was not distributed with this
michael@0:  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
michael@0: 
michael@0: %include shared.inc
michael@0: @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
michael@0: 
michael@0: notification {
michael@0:   padding: 3px 3px 4px;
michael@0:   text-shadow: none;
michael@0: }
michael@0: 
michael@0: notification[type="info"] {
michael@0:   color: rgba(255,255,255,0.95);
michael@0:   background: url("chrome://global/skin/notification/info-bar-background.png") #404040 repeat-x top left;
michael@0:   border-top: 1px solid #707070;
michael@0:   border-bottom: 1px solid #2a2a2a;
michael@0: }
michael@0: 
michael@0: notification[type="warning"] {
michael@0:   color: rgba(0,0,0,0.95);
michael@0:   background: url("chrome://global/skin/notification/warning-bar-background.png") #ffc703 repeat-x top left;
michael@0:   border-top: 1px solid #ffe970;
michael@0:   border-bottom: 1px solid #bf8a01;
michael@0: }
michael@0: 
michael@0: notification[type="critical"] {
michael@0:   color: rgba(255,255,255,0.95);
michael@0:   background: url("chrome://global/skin/notification/critical-bar-background.png") #980000 repeat-x top left;
michael@0:   border-top: 1px solid #e35959;
michael@0:   border-bottom: 1px solid #5d0000;
michael@0: }
michael@0: 
michael@0: .messageImage {
michael@0:   width: 16px;
michael@0:   height: 16px;
michael@0:   margin: 0 4px;
michael@0: }
michael@0: 
michael@0: /* Default icons for notifications */
michael@0: 
michael@0: .messageImage[type="info"] {
michael@0:   list-style-image: url("chrome://global/skin/notification/info-icon.png");
michael@0: }
michael@0: 
michael@0: .messageImage[type="warning"] {
michael@0:   list-style-image: url("chrome://global/skin/notification/warning-icon.png");
michael@0: }
michael@0: 
michael@0: .messageImage[type="critical"] {
michael@0:   list-style-image: url("chrome://global/skin/notification/error-icon.png");
michael@0: }
michael@0: 
michael@0: .notification-inner {
michael@0:   border: 0 !important;
michael@0: }
michael@0: 
michael@0: .messageText {
michael@0:   margin: 0 3px !important;
michael@0:   padding: 0;
michael@0:   font-weight: bold;
michael@0: }
michael@0: 
michael@0: .messageCloseButton {
michael@0:   -moz-appearance: none;
michael@0:   padding: 0;
michael@0:   margin: 0 2px;
michael@0:   border: none;
michael@0: }
michael@0: 
michael@0: .messageCloseButton > .toolbarbutton-text {
michael@0:   display: none;
michael@0: }
michael@0: 
michael@0: .messageCloseButton:-moz-focusring > .toolbarbutton-icon {
michael@0:   border-radius: 10000px;
michael@0:   box-shadow: 0 0 2px 1px -moz-mac-focusring,
michael@0:               0 0 0 2px -moz-mac-focusring inset;
michael@0: }
michael@0: 
michael@0: @media (min-resolution: 2dppx) {
michael@0:   .messageCloseButton > .toolbarbutton-icon {
michael@0:     width: 16px;
michael@0:   }
michael@0: }
michael@0: 
michael@0: /* Popup notification */
michael@0: 
michael@0: .popup-notification-description {
michael@0:   max-width: 24em;
michael@0: }
michael@0: 
michael@0: .popup-notification-learnmore-link {
michael@0:   margin-top: 1em !important;
michael@0:   -moz-margin-start: 0 !important; /* override default label margin to match description margin */
michael@0: }
michael@0: 
michael@0: .popup-notification-learnmore-link:not([href]) {
michael@0:   display: none;
michael@0: }
michael@0: 
michael@0: .popup-notification-button-container {
michael@0:   margin-top: 17px;
michael@0: }
michael@0: 
michael@0: .popup-notification-menubutton {
michael@0:   -moz-appearance: none;
michael@0: }
michael@0: 
michael@0: .popup-notification-menubutton:not([type="menu-button"]):-moz-focusring,
michael@0: .popup-notification-menubutton:-moz-focusring > .button-menubutton-dropmarker,
michael@0: .popup-notification-menubutton > .button-menubutton-button:-moz-focusring {
michael@0:   box-shadow: @focusRingShadow@;
michael@0:   position: relative;
michael@0: }
michael@0: 
michael@0: .popup-notification-menubutton:not([type="menu-button"]),
michael@0: .popup-notification-menubutton > .button-menubutton-button,
michael@0: .popup-notification-menubutton > .button-menubutton-dropmarker {
michael@0:   -moz-appearance: none;
michael@0:   color: #434343;
michael@0:   border-radius: 4px;
michael@0:   border: 1px solid #b5b5b5;
michael@0:   background: linear-gradient(#fff, #f2f2f2);
michael@0:   box-shadow: inset 0 1px rgba(255,255,255,.8),
michael@0:               inset 0 0 1px rgba(255,255,255,.25),
michael@0:               0 1px rgba(255,255,255,.3);
michael@0:   background-clip: padding-box;
michael@0:   background-origin: padding-box;
michael@0:   padding: 2px 6px;
michael@0: }
michael@0: 
michael@0: .popup-notification-menubutton > .button-menubutton-button {
michael@0:   -moz-appearance: none;
michael@0:   margin: 0;
michael@0:   padding-top: 2px;
michael@0:   padding-bottom: 2px;
michael@0:   -moz-padding-start: 8px;
michael@0:   -moz-padding-end: 5px;
michael@0: }
michael@0: 
michael@0: .popup-notification-menubutton > .button-menubutton-dropmarker {
michael@0:   padding: 7px 8px;
michael@0:   margin-top: 0;
michael@0:   margin-bottom: 0;
michael@0:   -moz-margin-start: -1px;
michael@0:   list-style-image: url("chrome://global/skin/icons/panel-dropmarker.png");
michael@0: }
michael@0: 
michael@0: .popup-notification-menubutton > .button-menubutton-button:-moz-locale-dir(ltr),
michael@0: .popup-notification-menubutton > .button-menubutton-dropmarker:-moz-locale-dir(rtl) {
michael@0:   border-top-right-radius: 0;
michael@0:   border-bottom-right-radius: 0;
michael@0: }
michael@0: 
michael@0: .popup-notification-menubutton > .button-menubutton-button:-moz-locale-dir(rtl),
michael@0: .popup-notification-menubutton > .button-menubutton-dropmarker:-moz-locale-dir(ltr) {
michael@0:   border-top-left-radius: 0;
michael@0:   border-bottom-left-radius: 0;
michael@0: }
michael@0: 
michael@0: .popup-notification-menubutton:not([type="menu-button"]):hover:active,
michael@0: .popup-notification-menubutton > .button-menubutton-button:hover:active,
michael@0: .popup-notification-menubutton[open="true"] > .button-menubutton-dropmarker {
michael@0:   box-shadow: inset 0 1px 4px -3px #000, 0 1px rgba(255, 255, 255, 0.3);
michael@0: }
michael@0: 
michael@0: .popup-notification-closebutton {
michael@0:   -moz-margin-end: -12px;
michael@0:   margin-top: -13px;
michael@0: }
michael@0: 
michael@0: .popup-notification-closeitem > .menu-iconic-left {
michael@0:   display: none;
michael@0: }