notification.css (3799B)
1 /* This Source Code Form is subject to the terms of the Mozilla Public 2 * License, v. 2.0. If a copy of the MPL was not distributed with this 3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ 4 5 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); 6 7 notification { 8 background-color: #181411; 9 color: #bfbbb6; 10 text-shadow: none; 11 } 12 13 notification[type="info"] { 14 background-color: #181411; 15 color: #bfbbb6; 16 } 17 18 notification[type="critical"] { 19 background-color: rgb(107,40,40); 20 color: white; 21 } 22 23 .messageText > .text-link { 24 color: inherit !important; 25 text-decoration: underline; 26 } 27 28 .messageImage { 29 width: 16px; 30 height: 16px; 31 margin-inline-start: 6px; 32 margin-inline-end: 1px; 33 } 34 35 /* Default icons for notifications */ 36 37 .messageImage[type="info"] { 38 list-style-image: url("chrome://global/skin/icons/information-16.svg"); 39 } 40 41 .messageImage[type="warning"] { 42 list-style-image: url("chrome://global/skin/icons/warning-16.svg"); 43 } 44 45 .messageImage[type="critical"] { 46 list-style-image: url("chrome://global/skin/icons/error-16.svg"); 47 } 48 49 .messageCloseButton { 50 -moz-appearance: none; 51 padding: 4px 2px; 52 border: none !important; 53 } 54 55 .messageCloseButton > .toolbarbutton-icon { 56 margin-inline-end: 5px; 57 } 58 59 /* Popup notification */ 60 61 .popup-notification-description { 62 max-width: 24em; 63 } 64 65 .popup-notification-learnmore-link { 66 margin-top: 1em !important; 67 } 68 69 .popup-notification-learnmore-link:not([href]) { 70 display: none; 71 } 72 73 .popup-notification-button-container { 74 margin-top: 17px; 75 } 76 77 .popup-notification-menubutton { 78 -moz-appearance: none; 79 border-radius: 3px; 80 padding: 0; 81 } 82 83 .popup-notification-menubutton:hover:active { 84 border-color: rgba(0,0,0,.5); 85 } 86 87 .popup-notification-menubutton:not([type="menu-button"]), 88 .popup-notification-menubutton > .button-menubutton-button, 89 .popup-notification-menubutton > .button-menubutton-dropmarker { 90 -moz-appearance: none; 91 margin: 0; 92 border: 1px solid rgb(64,64,64); 93 background: #181411; 94 } 95 96 .popup-notification-menubutton > .button-menubutton-button { 97 background-color: transparent; 98 padding: 1px; 99 border-inline-end: none; 100 } 101 102 .popup-notification-menubutton:not([type="menu-button"]), 103 .popup-notification-menubutton > .button-menubutton-button > .button-box { 104 padding-inline-start: 8px; 105 padding-inline-end: 5px; 106 } 107 108 .popup-notification-menubutton > .button-menubutton-dropmarker { 109 padding: 9px 5px 8px; 110 width: auto; 111 height: auto; 112 list-style-image: url("chrome://global/skin/arrow/arrow-v.svg#dn"); 113 } 114 115 .popup-notification-menubutton > .button-menubutton-dropmarker > image { 116 width: 9px; 117 } 118 119 .popup-notification-menubutton:-moz-focusring > .button-menubutton-dropmarker { 120 outline: 1px dotted ThreeDDarkShadow; 121 outline-offset: -3px; 122 } 123 124 .popup-notification-menubutton > .button-menubutton-button:-moz-locale-dir(ltr), 125 .popup-notification-menubutton > .button-menubutton-dropmarker:-moz-locale-dir(rtl) { 126 border-radius: 2px 0 0 2px; 127 } 128 129 .popup-notification-menubutton > .button-menubutton-button:-moz-locale-dir(rtl), 130 .popup-notification-menubutton > .button-menubutton-dropmarker:-moz-locale-dir(ltr) { 131 border-radius: 0 2px 2px 0; 132 } 133 134 .popup-notification-menubutton:not([type="menu-button"]):hover, 135 .popup-notification-menubutton > .button-menubutton-button:hover, 136 .popup-notification-menubutton > .button-menubutton-dropmarker:hover { 137 background: #181411; 138 } 139 140 .popup-notification-menubutton:not([type="menu-button"]):hover:active, 141 .popup-notification-menubutton > .button-menubutton-button:hover:active, 142 .popup-notification-menubutton > .button-menubutton-dropmarker:hover:active, 143 .popup-notification-menubutton[open="true"] > .button-menubutton-dropmarker { 144 background: #181411; 145 } 146 147 .popup-notification-closebutton { 148 margin-inline-end: -14px; 149 margin-top: -10px; 150 }