1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/browser/themes/osx/browser.css Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,4434 @@
1.4 +/* This Source Code Form is subject to the terms of the Mozilla Public
1.5 + * License, v. 2.0. If a copy of the MPL was not distributed with this
1.6 + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
1.7 +
1.8 +@import url("chrome://global/skin/");
1.9 +
1.10 +%include shared.inc
1.11 +%filter substitution
1.12 +%define forwardTransitionLength 150ms
1.13 +%define conditionalForwardWithUrlbar window:not([chromehidden~="toolbar"]) #urlbar-wrapper
1.14 +%define conditionalForwardWithUrlbarWidth 32
1.15 +%define spaceAboveTabbar 9px
1.16 +%define toolbarButtonPressed :hover:active:not([disabled="true"]):not([cui-areatype="menu-panel"])
1.17 +%define windowButtonMarginTop 11px
1.18 +
1.19 +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
1.20 +@namespace html url("http://www.w3.org/1999/xhtml");
1.21 +@namespace svg url("http://www.w3.org/2000/svg");
1.22 +
1.23 +#urlbar:-moz-lwtheme:not([focused="true"]),
1.24 +.searchbar-textbox:-moz-lwtheme:not([focused="true"]) {
1.25 + opacity: .9;
1.26 +}
1.27 +
1.28 +#navigator-toolbox::after {
1.29 + -moz-box-ordinal-group: 101; /* tabs toolbar is 100 */
1.30 + background-image: linear-gradient(to top, hsla(0,0%,0%,.15), hsla(0,0%,0%,.15) 1px, hsla(0,0%,100%,.15) 1px, hsla(0,0%,100%,.15) 2px, transparent 3px);
1.31 + content: "";
1.32 + display: -moz-box;
1.33 + height: 2px;
1.34 + margin-top: -2px;
1.35 + position: relative;
1.36 + z-index: 2; /* navbar is at 1 */
1.37 +}
1.38 +
1.39 +#navigator-toolbox toolbarbutton:-moz-lwtheme {
1.40 + color: inherit;
1.41 + text-shadow: inherit;
1.42 +}
1.43 +
1.44 +#main-window {
1.45 + -moz-appearance: none;
1.46 + background-color: #eeeeee;
1.47 +}
1.48 +
1.49 +/** Begin titlebar **/
1.50 +
1.51 +#titlebar-buttonbox > .titlebar-button {
1.52 + display: none;
1.53 +}
1.54 +
1.55 +/* NB: these would be -moz-margin-start/end if it wasn't for the fact that OS X
1.56 + * doesn't reverse the order of the items in the titlebar in RTL mode. */
1.57 +.titlebar-placeholder[type="caption-buttons"],
1.58 +#titlebar-buttonbox {
1.59 + margin-left: 7px;
1.60 +}
1.61 +
1.62 +@media (-moz-mac-lion-theme) {
1.63 + .titlebar-placeholder[type="fullscreen-button"],
1.64 + #titlebar-secondary-buttonbox {
1.65 + margin-right: 7px;
1.66 + margin-left: 7px;
1.67 + }
1.68 +}
1.69 +
1.70 +#main-window:not(:-moz-lwtheme) > #titlebar {
1.71 + -moz-appearance: -moz-window-titlebar;
1.72 +}
1.73 +
1.74 +#main-window:not([tabsintitlebar]) > #titlebar {
1.75 + height: 22px; /* The native titlebar on OS X is 22px tall. */
1.76 +}
1.77 +
1.78 +/**
1.79 + * For tabs in titlebar on OS X, we stretch the titlebar down so that the
1.80 + * tabstrip can overlap it.
1.81 + */
1.82 +#main-window[tabsintitlebar] > #titlebar {
1.83 + min-height: calc(@tabMinHeight@ + @spaceAboveTabbar@ - @tabToolbarNavbarOverlap@);
1.84 +}
1.85 +
1.86 +/**
1.87 + * We also vertically center the window buttons.
1.88 + */
1.89 +#main-window[tabsintitlebar] > #titlebar > #titlebar-content > #titlebar-buttonbox-container,
1.90 +#main-window[tabsintitlebar] > #titlebar > #titlebar-content > #titlebar-secondary-buttonbox > #titlebar-fullscreen-button {
1.91 + margin-top: @windowButtonMarginTop@;
1.92 +}
1.93 +
1.94 +#main-window[customize-entered] > #titlebar {
1.95 + -moz-appearance: none;
1.96 +}
1.97 +
1.98 +/** End titlebar **/
1.99 +
1.100 +#main-window[chromehidden~="toolbar"][chromehidden~="location"][chromehidden~="directories"] {
1.101 + border-top: 1px solid rgba(0,0,0,0.65);
1.102 +}
1.103 +
1.104 +/* Because of -moz-box-align: center above, separators will be invisible unless
1.105 + we set their min-height. See bug 583510 for more information. */
1.106 +toolbarseparator {
1.107 + min-height: 22px;
1.108 +}
1.109 +
1.110 +#navigator-toolbox > toolbar:not(#TabsToolbar):not(#nav-bar):not(:-moz-lwtheme) {
1.111 + -moz-appearance: none;
1.112 + background: url(chrome://browser/skin/Toolbar-background-noise.png) hsl(0,0%,83%);
1.113 +}
1.114 +
1.115 +#TabsToolbar:not([collapsed="true"]) + #nav-bar {
1.116 + margin-top: -@tabToolbarNavbarOverlap@; /* Move up into the TabsToolbar */
1.117 + /* Position the toolbar above the bottom of background tabs */
1.118 + position: relative;
1.119 + z-index: 1;
1.120 +}
1.121 +
1.122 +#nav-bar {
1.123 + -moz-appearance: none;
1.124 + background: url(chrome://browser/skin/Toolbar-background-noise.png),
1.125 + linear-gradient(hsl(0,0%,93%), hsl(0,0%,83%));
1.126 + background-clip: border-box;
1.127 + background-origin: border-box !important;
1.128 +
1.129 + /* Move the noise texture out of the top 1px strip because that overlaps
1.130 + with the tabbar and we don't want to repaint it when animating tabs.
1.131 + The noise image is at least 100px high, so repeating it only horizontally
1.132 + is enough. */
1.133 + background-repeat: repeat-x, no-repeat;
1.134 + background-position: 0 1px, 0 0;
1.135 +
1.136 + box-shadow: inset 0 1px 0 hsla(0,0%,100%,.4);
1.137 +}
1.138 +
1.139 +@media (min-resolution: 2dppx) {
1.140 + #nav-bar {
1.141 + background-size: 100px 100px, auto;
1.142 + }
1.143 +}
1.144 +
1.145 +#nav-bar-customization-target {
1.146 + padding: 4px;
1.147 +}
1.148 +
1.149 +#PersonalToolbar {
1.150 + padding: 0 4px 4px;
1.151 + /* 4px padding ^ plus 19px personal-bookmarks (see below) */
1.152 + min-height: 23px;
1.153 +}
1.154 +
1.155 +#navigator-toolbox > toolbar:not(#TabsToolbar):-moz-lwtheme {
1.156 + background-color: @toolbarColorLWT@;
1.157 + background-image: url(chrome://browser/skin/Toolbar-background-noise.png);
1.158 +}
1.159 +
1.160 +#PersonalToolbar:not(:-moz-lwtheme):-moz-window-inactive,
1.161 +#nav-bar:not(:-moz-lwtheme):-moz-window-inactive {
1.162 + background-color: -moz-mac-chrome-inactive;
1.163 +}
1.164 +
1.165 +/* ----- BOOKMARK TOOLBAR ----- */
1.166 +
1.167 +#personal-bookmarks {
1.168 + min-height: 19px; /* 16px button height + 2px padding + 1px margin-bottom */
1.169 +}
1.170 +
1.171 +toolbarbutton.chevron {
1.172 + list-style-image: url("chrome://global/skin/icons/chevron.png");
1.173 + margin: 1px 0 0;
1.174 + padding: 0;
1.175 +}
1.176 +
1.177 +toolbarbutton.chevron > .toolbarbutton-text {
1.178 + display: none;
1.179 +}
1.180 +
1.181 +toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon {
1.182 + transform: scaleX(-1);
1.183 +}
1.184 +
1.185 +@media (min-resolution: 2dppx) {
1.186 + toolbarbutton.chevron {
1.187 + list-style-image: url("chrome://global/skin/icons/chevron@2x.png");
1.188 + }
1.189 +
1.190 + toolbarbutton.chevron > .toolbarbutton-icon {
1.191 + width: 13px;
1.192 + }
1.193 +}
1.194 +
1.195 +/* ----- BOOKMARK BUTTONS ----- */
1.196 +
1.197 +toolbarbutton.bookmark-item:not(.subviewbutton):not(#bookmarks-menu-button),
1.198 +#personal-bookmarks[cui-areatype="toolbar"]:not([overflowedItem=true]) > #bookmarks-toolbar-placeholder {
1.199 + border: 0;
1.200 + border-radius: 10000px;
1.201 + padding: 1px 8px;
1.202 + margin: 0 0 1px;
1.203 +}
1.204 +
1.205 +#personal-bookmarks[cui-areatype="toolbar"]:not([overflowedItem=true]) > #bookmarks-toolbar-placeholder {
1.206 + -moz-box-orient: horizontal;
1.207 +}
1.208 +
1.209 +.bookmark-item > .toolbarbutton-menu-dropmarker {
1.210 + list-style-image: url("chrome://browser/skin/places/folderDropArrow.png");
1.211 + -moz-image-region: rect(0, 7px, 5px, 0);
1.212 + margin-top: 1px;
1.213 + -moz-margin-start: 3px;
1.214 + -moz-margin-end: -2px;
1.215 +}
1.216 +
1.217 +@media (min-resolution: 2dppx) {
1.218 + .bookmark-item > .toolbarbutton-menu-dropmarker {
1.219 + list-style-image: url("chrome://browser/skin/places/folderDropArrow@2x.png");
1.220 + -moz-image-region: rect(0, 14px, 10px, 0);
1.221 + }
1.222 +
1.223 + .bookmark-item > .toolbarbutton-menu-dropmarker > .dropmarker-icon {
1.224 + width: 7px;
1.225 + }
1.226 +}
1.227 +
1.228 +.bookmark-item > .toolbarbutton-text,
1.229 +#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-text {
1.230 + display: -moz-box !important; /* Force the display of the label for bookmarks */
1.231 + margin: 0 !important;
1.232 +}
1.233 +
1.234 +toolbarbutton.bookmark-item:not(.subviewbutton):not(#bookmarks-menu-button):hover {
1.235 + background-color: rgba(0, 0, 0, .205);
1.236 +}
1.237 +
1.238 +toolbarbutton.bookmark-item:hover:not(.subviewbutton),
1.239 +toolbarbutton.bookmark-item[open="true"]:not(.subviewbutton) {
1.240 + color: #FFF !important;
1.241 + text-shadow: 0 1px rgba(0, 0, 0, .4) !important;
1.242 +}
1.243 +
1.244 +.bookmark-item:hover > .toolbarbutton-menu-dropmarker,
1.245 +.bookmark-item[open="true"] > .toolbarbutton-menu-dropmarker {
1.246 + -moz-image-region: rect(5px, 7px, 10px, 0);
1.247 +}
1.248 +
1.249 +@media (min-resolution: 2dppx) {
1.250 + .bookmark-item:hover > .toolbarbutton-menu-dropmarker,
1.251 + .bookmark-item[open="true"] > .toolbarbutton-menu-dropmarker {
1.252 + -moz-image-region: rect(10px, 14px, 20px, 0);
1.253 + }
1.254 +}
1.255 +
1.256 +toolbarbutton.bookmark-item:not(.subviewbutton):not(#bookmarks-menu-button):active:hover,
1.257 +toolbarbutton.bookmark-item:not(.subviewbutton):not(#bookmarks-menu-button)[open="true"] {
1.258 + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.4);
1.259 + background-color: rgba(0, 0, 0, .5);
1.260 +}
1.261 +
1.262 +toolbarbutton.bookmark-item > menupopup {
1.263 + margin-top: 2px;
1.264 + -moz-margin-start: 3px;
1.265 +}
1.266 +
1.267 +.bookmark-item:not(#home-button) > .toolbarbutton-icon,
1.268 +#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
1.269 + width: 16px;
1.270 + min-height: 16px;
1.271 + max-height: 16px;
1.272 +}
1.273 +
1.274 +.bookmark-item > .toolbarbutton-icon[label]:not([label=""]),
1.275 +.bookmark-item > .toolbarbutton-icon[type="menu"],
1.276 +#personal-bookmarks[cui-areatype="toolbar"]:not([overflowedItem=true]) > #bookmarks-toolbar-placeholder > .toolbarbutton-icon[label]:not([label=""]) {
1.277 + -moz-margin-end: 5px;
1.278 +}
1.279 +
1.280 +.bookmark-item[container] {
1.281 + list-style-image: url("chrome://global/skin/tree/folder.png");
1.282 +}
1.283 +
1.284 +.bookmark-item[container][livemark] {
1.285 + list-style-image: url("chrome://browser/skin/page-livemarks.png");
1.286 +}
1.287 +
1.288 +.bookmark-item[container][livemark] .bookmark-item {
1.289 + list-style-image: url("chrome://browser/skin/places/livemark-item.png");
1.290 + -moz-image-region: rect(0px, 16px, 16px, 0px);
1.291 +}
1.292 +
1.293 +.bookmark-item[container][livemark] .bookmark-item[visited] {
1.294 + -moz-image-region: rect(0px, 32px, 16px, 16px);
1.295 +}
1.296 +
1.297 +.bookmark-item[container][query] {
1.298 + list-style-image: url("chrome://browser/skin/places/query.png");
1.299 +}
1.300 +
1.301 +.bookmark-item[query][tagContainer] {
1.302 + list-style-image: url("chrome://browser/skin/places/tag.png");
1.303 +}
1.304 +
1.305 +.bookmark-item[query][dayContainer] {
1.306 + list-style-image: url("chrome://browser/skin/places/history.png");
1.307 +}
1.308 +
1.309 +.bookmark-item[query][hostContainer] {
1.310 + list-style-image: url("chrome://global/skin/tree/folder.png");
1.311 +}
1.312 +
1.313 +.bookmark-item[query][hostContainer][open] {
1.314 + list-style-image: url("chrome://global/skin/tree/folder.png");
1.315 +}
1.316 +
1.317 +@media (min-resolution: 2dppx) {
1.318 + .bookmark-item[container] {
1.319 + list-style-image: url("chrome://global/skin/tree/folder@2x.png");
1.320 + }
1.321 +
1.322 + .bookmark-item[container][livemark] {
1.323 + list-style-image: url("chrome://browser/skin/page-livemarks@2x.png");
1.324 + }
1.325 +
1.326 + .bookmark-item[container][livemark] .bookmark-item {
1.327 + list-style-image: url("chrome://browser/skin/places/livemark-item.png");
1.328 + }
1.329 +
1.330 + .bookmark-item[container][query] {
1.331 + list-style-image: url("chrome://browser/skin/places/query@2x.png");
1.332 + }
1.333 +
1.334 + .bookmark-item[query][tagContainer] {
1.335 + list-style-image: url("chrome://browser/skin/places/tag@2x.png");
1.336 + }
1.337 +
1.338 + .bookmark-item[query][dayContainer] {
1.339 + list-style-image: url("chrome://browser/skin/places/history@2x.png");
1.340 + }
1.341 +
1.342 + .bookmark-item[query][hostContainer] {
1.343 + list-style-image: url("chrome://global/skin/tree/folder@2x.png");
1.344 + }
1.345 +
1.346 + .bookmark-item[query][hostContainer][open] {
1.347 + list-style-image: url("chrome://global/skin/tree/folder@2x.png");
1.348 + }
1.349 +}
1.350 +
1.351 +/* Workaround for native menubar inheritance */
1.352 +.openintabs-menuitem,
1.353 +.openlivemarksite-menuitem,
1.354 +.livemarkstatus-menuitem {
1.355 + list-style-image: none;
1.356 +}
1.357 +
1.358 +.bookmark-item[cutting] > .toolbarbutton-icon,
1.359 +.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-icon {
1.360 + opacity: 0.5;
1.361 +}
1.362 +
1.363 +.bookmark-item[cutting] > .toolbarbutton-text,
1.364 +.bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-text {
1.365 + opacity: 0.7;
1.366 +}
1.367 +
1.368 +@media (min-resolution: 2dppx) {
1.369 + .bookmark-item > .toolbarbutton-icon,
1.370 + .bookmark-item > .menu-iconic-left > .menu-iconic-icon,
1.371 + #personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
1.372 + image-rendering: -moz-crisp-edges;
1.373 + }
1.374 +}
1.375 +
1.376 +#bookmarks-toolbar-placeholder {
1.377 + list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png") !important;
1.378 +}
1.379 +
1.380 +toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-placeholder,
1.381 +#personal-bookmarks[cui-areatype="menu-panel"] > #bookmarks-toolbar-placeholder {
1.382 + list-style-image: url("chrome://browser/skin/places/bookmarksToolbar-menuPanel.png") !important;
1.383 +}
1.384 +
1.385 +@media (min-resolution: 2dppx) {
1.386 + #bookmarks-toolbar-placeholder {
1.387 + list-style-image: url("chrome://browser/skin/places/bookmarksToolbar@2x.png") !important;
1.388 + }
1.389 +
1.390 + toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-placeholder,
1.391 + #personal-bookmarks[cui-areatype="menu-panel"] > #bookmarks-toolbar-placeholder {
1.392 + list-style-image: url("chrome://browser/skin/places/bookmarksToolbar-menuPanel@2x.png") !important;
1.393 + }
1.394 +
1.395 + #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
1.396 + width: 16px;
1.397 + }
1.398 +}
1.399 +
1.400 +/* ----- BOOKMARK STAR ANIMATION ----- */
1.401 +
1.402 +@keyframes animation-bookmarkAdded {
1.403 + from { transform: rotate(0deg) translateX(-14px) rotate(0deg) scale(1); opacity: 0; }
1.404 + 60% { transform: rotate(180deg) translateX(-14px) rotate(-180deg) scale(2.2); opacity: 1; }
1.405 + 80% { opacity: 1; }
1.406 + to { transform: rotate(180deg) translateX(-14px) rotate(-180deg) scale(1); opacity: 0; }
1.407 +}
1.408 +
1.409 +@keyframes animation-bookmarkPulse {
1.410 + from { transform: scale(1); }
1.411 + 50% { transform: scale(1.3); }
1.412 + to { transform: scale(1); }
1.413 +}
1.414 +
1.415 +#bookmarked-notification-container {
1.416 + min-height: 1px;
1.417 + min-width: 1px;
1.418 + height: 1px;
1.419 + margin-bottom: -1px;
1.420 + z-index: 5;
1.421 + position: relative;
1.422 +}
1.423 +
1.424 +#bookmarked-notification {
1.425 + background-size: 16px;
1.426 + background-position: center;
1.427 + background-repeat: no-repeat;
1.428 + width: 16px;
1.429 + height: 16px;
1.430 + opacity: 0;
1.431 +}
1.432 +
1.433 +#bookmarked-notification-dropmarker-anchor {
1.434 + z-index: -1;
1.435 + position: relative;
1.436 +}
1.437 +
1.438 +#bookmarked-notification-dropmarker-icon {
1.439 + width: 18px;
1.440 + height: 18px;
1.441 + visibility: hidden;
1.442 +}
1.443 +
1.444 +#bookmarked-notification-anchor[notification="finish"] > #bookmarked-notification {
1.445 + background-image: url("chrome://browser/skin/places/bookmarks-notification-finish.png");
1.446 + animation: animation-bookmarkAdded 800ms;
1.447 + animation-timing-function: ease, ease, ease;
1.448 +}
1.449 +
1.450 +@media (min-resolution: 2dppx) {
1.451 + #bookmarked-notification-anchor[notification="finish"] > #bookmarked-notification {
1.452 + background-image: url("chrome://browser/skin/places/bookmarks-notification-finish@2x.png");
1.453 + }
1.454 +}
1.455 +
1.456 +#bookmarks-menu-button[notification="finish"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1.457 + list-style-image: none !important;
1.458 +}
1.459 +
1.460 +#bookmarked-notification-dropmarker-anchor[notification="finish"] > #bookmarked-notification-dropmarker-icon {
1.461 + visibility: visible;
1.462 + animation: animation-bookmarkPulse 300ms;
1.463 + animation-delay: 600ms;
1.464 + animation-timing-function: ease-out;
1.465 +}
1.466 +
1.467 +/* ----- BOOKMARK MENUS ----- */
1.468 +
1.469 +.bookmark-item > .menu-iconic-left > .menu-iconic-icon {
1.470 + width: 16px;
1.471 + height: 16px;
1.472 +}
1.473 +
1.474 +#bookmarksToolbarFolderMenu,
1.475 +#BMB_bookmarksToolbar,
1.476 +#panelMenu_bookmarksToolbar {
1.477 + list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png");
1.478 +}
1.479 +
1.480 +#BMB_unsortedBookmarks,
1.481 +#panelMenu_unsortedBookmarks {
1.482 + list-style-image: url("chrome://browser/skin/places/unfiledBookmarks.png");
1.483 +}
1.484 +
1.485 +@media (min-resolution: 2dppx) {
1.486 + #bookmarksToolbarFolderMenu,
1.487 + #BMB_bookmarksToolbar {
1.488 + list-style-image: url("chrome://browser/skin/places/bookmarksToolbar@2x.png");
1.489 + }
1.490 +
1.491 + #BMB_unsortedBookmarks {
1.492 + list-style-image: url("chrome://browser/skin/places/unfiledBookmarks@2x.png");
1.493 + }
1.494 +}
1.495 +
1.496 +/* ----- PRIMARY TOOLBAR BUTTONS ----- */
1.497 +
1.498 +toolbar .toolbarbutton-1:not([type="menu-button"]),
1.499 +.toolbarbutton-1 > .toolbarbutton-menubutton-button,
1.500 +.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1.501 + -moz-box-orient: vertical;
1.502 + height: 24px;
1.503 + padding: 0;
1.504 + border: 0;
1.505 +}
1.506 +
1.507 +toolbar .toolbarbutton-1:not(:-moz-any([type="menu-button"],#back-button,#forward-button)),
1.508 +toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
1.509 +toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1.510 + border: 1px solid transparent;
1.511 + border-radius: @toolbarbuttonCornerRadius@;
1.512 + transition-property: background, border-color;
1.513 + transition-duration: 250ms;
1.514 +}
1.515 +
1.516 +toolbar .toolbarbutton-1:not(:-moz-any([type="menu-button"],#back-button,#forward-button)) {
1.517 + padding: 0 4px;
1.518 +}
1.519 +
1.520 +toolbar .toolbarbutton-1:not(:-moz-any([type="menu-button"],[disabled],[open],#back-button,#forward-button)):hover,
1.521 +toolbar .toolbarbutton-1[type="menu-button"]:not([disabled]) > .toolbarbutton-menubutton-button[open] + .toolbarbutton-menubutton-dropmarker,
1.522 +toolbar .toolbarbutton-1[type="menu-button"]:not([disabled]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-button,
1.523 +toolbar .toolbarbutton-1[type="menu-button"]:not([disabled]):-moz-any(:hover,[open]) > .toolbarbutton-menubutton-dropmarker,
1.524 +toolbar .toolbaritem-combined-buttons:hover > .toolbarbutton-combined {
1.525 + border-color: hsla(0,0%,0%,.2);
1.526 + box-shadow: 0 1px 0 hsla(0,0%,100%,.5),
1.527 + 0 1px 0 hsla(0,0%,100%,.5) inset;
1.528 +}
1.529 +
1.530 +toolbar .toolbarbutton-1:not(:-moz-any([type="menu-button"],[disabled],[open],#back-button,#forward-button)):hover,
1.531 +toolbar .toolbarbutton-1[type="menu-button"]:not(:-moz-any([disabled],[open]))[buttonover] > .toolbarbutton-menubutton-button,
1.532 +toolbar .toolbarbutton-1[type="menu-button"]:not(:-moz-any([disabled],[open],[buttonover])):hover > .toolbarbutton-menubutton-dropmarker {
1.533 + background: hsla(0,0%,100%,.1) linear-gradient(hsla(0,0%,100%,.3), hsla(0,0%,100%,.1)) padding-box;
1.534 +}
1.535 +
1.536 +toolbar .toolbarbutton-1:not(:-moz-any([type="menu-button"],[disabled],#back-button,#forward-button)):-moz-any(:hover:active,[open],[checked]),
1.537 +toolbar .toolbarbutton-1[type="menu-button"]:not([disabled]) > .toolbarbutton-menubutton-button[open],
1.538 +toolbar .toolbarbutton-1[type="menu-button"]:not(:-moz-any([disabled],[open]))[buttonover]:active > .toolbarbutton-menubutton-button,
1.539 +toolbar .toolbarbutton-1[type="menu-button"]:not(:-moz-any([disabled],[open],[buttonover])):hover:active > .toolbarbutton-menubutton-dropmarker,
1.540 +toolbar .toolbarbutton-1[type="menu-button"][open]:not([disabled]) > .toolbarbutton-menubutton-dropmarker {
1.541 + background: hsla(0,0%,0%,.02) linear-gradient(hsla(0,0%,0%,.12), hsla(0,0%,0%,0)) border-box;
1.542 + border-color: hsla(0,0%,0%,.3);
1.543 + box-shadow: 0 1px 0 hsla(0,0%,100%,.5),
1.544 + 0 1px 0 hsla(0,0%,0%,.05) inset,
1.545 + 0 1px 1px hsla(0,0%,0%,.2) inset;
1.546 + transition-duration: 10ms;
1.547 +}
1.548 +
1.549 +toolbar .toolbarbutton-1[checked]:not(:active):hover {
1.550 + background-color: hsla(0,0%,0%,.09);
1.551 + transition: background-color 250ms;
1.552 +}
1.553 +
1.554 +.toolbarbutton-1[type="menu-button"]:not([overflowedItem=true]) {
1.555 + padding: 0;
1.556 +}
1.557 +
1.558 +toolbar .toolbarbutton-1[type="menu-button"] {
1.559 + margin: 0;
1.560 +}
1.561 +
1.562 +.toolbarbutton-1 > .toolbarbutton-menubutton-button,
1.563 +.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1.564 + margin: 0;
1.565 +}
1.566 +
1.567 +.toolbarbutton-1 {
1.568 + margin: 0 4px;
1.569 +}
1.570 +
1.571 +toolbar .toolbarbutton-1:not([type="menu-button"]) {
1.572 + margin: 0 2px;
1.573 +}
1.574 +
1.575 +/**
1.576 + * Draw seperators before toolbar button dropmarkers, as well as between
1.577 + * consecutive toolbarbutton-1's within a toolbaritem.
1.578 + */
1.579 +toolbar .toolbaritem-combined-buttons > separator,
1.580 +toolbar .toolbarbutton-1:not(:-moz-any([open],:hover)) > .toolbarbutton-menubutton-dropmarker::before {
1.581 + content: "";
1.582 + display: -moz-box;
1.583 + position: relative;
1.584 + top: calc(50% - 9px);
1.585 + width: 1px;
1.586 + height: 18px;
1.587 + -moz-margin-start: -1px;
1.588 + background-image: linear-gradient(hsla(0,0%,0%,.15) 0, hsla(0,0%,0%,.15) 18px);
1.589 + background-clip: padding-box;
1.590 + background-position: center;
1.591 + background-repeat: no-repeat;
1.592 + background-size: 1px 18px;
1.593 + box-shadow: 0 0 0 1px hsla(0,0%,100%,.15);
1.594 +}
1.595 +
1.596 +toolbar .toolbaritem-combined-buttons:hover > separator {
1.597 + display: none;
1.598 +}
1.599 +
1.600 +toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1.601 + -moz-box-orient: horizontal;
1.602 +}
1.603 +
1.604 +toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
1.605 +toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1.606 + margin: 0 4px;
1.607 +}
1.608 +
1.609 +#nav-bar .toolbarbutton-1:not(#back-button):not(#forward-button) {
1.610 + margin-top: 4px;
1.611 + margin-bottom: 4px;
1.612 +}
1.613 +
1.614 +#nav-bar #PanelUI-button {
1.615 + -moz-box-align: center;
1.616 +}
1.617 +
1.618 +#nav-bar #PanelUI-menu-button {
1.619 + margin-top: 0;
1.620 + margin-bottom: 0;
1.621 + padding-top: 1px;
1.622 + padding-bottom: 1px;
1.623 + -moz-margin-start: 9px;
1.624 + -moz-margin-end: 7px;
1.625 +}
1.626 +
1.627 +@media not all and (min-resolution: 2dppx) {
1.628 +%include ../shared/toolbarbuttons.inc.css
1.629 +%include ../shared/menupanel.inc.css
1.630 +
1.631 + #back-button:hover:active:not([disabled="true"]) {
1.632 + -moz-image-region: rect(18px, 36px, 36px, 18px);
1.633 + }
1.634 +
1.635 + #forward-button:hover:active:not([disabled="true"]) {
1.636 + -moz-image-region: rect(18px, 72px, 36px, 54px);
1.637 + }
1.638 +
1.639 + #home-button@toolbarButtonPressed@ {
1.640 + -moz-image-region: rect(18px, 126px, 36px, 108px);
1.641 + }
1.642 +
1.643 + #bookmarks-menu-button[buttonover]@toolbarButtonPressed@ {
1.644 + -moz-image-region: rect(18px, 144px, 36px, 126px);
1.645 + }
1.646 +
1.647 + #bookmarks-menu-button[starred][buttonover]@toolbarButtonPressed@ {
1.648 + -moz-image-region: rect(18px, 162px, 36px, 144px);
1.649 + }
1.650 +
1.651 + #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1.652 + -moz-image-region: rect(0px, 630px, 18px, 612px);
1.653 + }
1.654 +
1.655 + #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker:hover:active:not([disabled="true"]) > .dropmarker-icon {
1.656 + -moz-image-region: rect(18px, 630px, 36px, 612px);
1.657 + }
1.658 +
1.659 + #history-panelmenu@toolbarButtonPressed@ {
1.660 + -moz-image-region: rect(18px, 180px, 36px, 162px);
1.661 + }
1.662 +
1.663 + #downloads-button@toolbarButtonPressed@ {
1.664 + -moz-image-region: rect(18px, 198px, 36px, 180px);
1.665 + }
1.666 +
1.667 + #add-ons-button@toolbarButtonPressed@ {
1.668 + -moz-image-region: rect(18px, 216px, 36px, 198px);
1.669 + }
1.670 +
1.671 + #open-file-button@toolbarButtonPressed@ {
1.672 + -moz-image-region: rect(18px, 234px, 36px, 216px);
1.673 + }
1.674 +
1.675 + #save-page-button@toolbarButtonPressed@ {
1.676 + -moz-image-region: rect(18px, 252px, 36px, 234px);
1.677 + }
1.678 +
1.679 + #sync-button@toolbarButtonPressed@ {
1.680 + -moz-image-region: rect(18px, 270px, 36px, 252px);
1.681 + }
1.682 +
1.683 + #feed-button@toolbarButtonPressed@ {
1.684 + -moz-image-region: rect(18px, 288px, 36px, 270px);
1.685 + }
1.686 +
1.687 + #social-share-button@toolbarButtonPressed@ {
1.688 + -moz-image-region: rect(18px, 306px, 36px, 288px);
1.689 + }
1.690 +
1.691 + #characterencoding-button@toolbarButtonPressed@ {
1.692 + -moz-image-region: rect(18px, 324px, 36px, 306px);
1.693 + }
1.694 +
1.695 + #new-window-button@toolbarButtonPressed@ {
1.696 + -moz-image-region: rect(18px, 342px, 36px, 324px);
1.697 + }
1.698 +
1.699 + #e10s-button@toolbarButtonPressed@ {
1.700 + -moz-image-region: rect(18px, 342px, 36px, 324px);
1.701 + }
1.702 +
1.703 + #new-tab-button@toolbarButtonPressed@ {
1.704 + -moz-image-region: rect(18px, 360px, 36px, 342px);
1.705 + }
1.706 +
1.707 + #privatebrowsing-button@toolbarButtonPressed@ {
1.708 + -moz-image-region: rect(18px, 378px, 36px, 360px);
1.709 + }
1.710 +
1.711 + #find-button@toolbarButtonPressed@ {
1.712 + -moz-image-region: rect(18px, 396px, 36px, 378px);
1.713 + }
1.714 +
1.715 + #print-button@toolbarButtonPressed@ {
1.716 + -moz-image-region: rect(18px, 414px, 36px, 396px);
1.717 + }
1.718 +
1.719 + #restore-button@toolbarButtonPressed@,
1.720 + #fullscreen-button@toolbarButtonPressed@ {
1.721 + -moz-image-region: rect(18px, 432px, 36px, 414px);
1.722 + }
1.723 +
1.724 + #developer-button@toolbarButtonPressed@ {
1.725 + -moz-image-region: rect(18px, 450px, 36px, 432px);
1.726 + }
1.727 +
1.728 + #preferences-button@toolbarButtonPressed@ {
1.729 + -moz-image-region: rect(18px, 468px, 36px, 450px);
1.730 + }
1.731 +
1.732 + #PanelUI-menu-button@toolbarButtonPressed@ {
1.733 + -moz-image-region: rect(18px, 486px, 36px, 468px);
1.734 + }
1.735 +
1.736 + #cut-button@toolbarButtonPressed@ {
1.737 + -moz-image-region: rect(18px, 504px, 36px, 486px);
1.738 + }
1.739 +
1.740 + #copy-button@toolbarButtonPressed@ {
1.741 + -moz-image-region: rect(18px, 522px, 36px, 504px);
1.742 + }
1.743 +
1.744 + #paste-button@toolbarButtonPressed@ {
1.745 + -moz-image-region: rect(18px, 540px, 36px, 522px);
1.746 + }
1.747 +
1.748 + #zoom-out-button@toolbarButtonPressed@ {
1.749 + -moz-image-region: rect(18px, 558px, 36px, 540px);
1.750 + }
1.751 +
1.752 + #zoom-in-button@toolbarButtonPressed@ {
1.753 + -moz-image-region: rect(18px, 576px, 36px, 558px);
1.754 + }
1.755 +
1.756 + #webrtc-status-button@toolbarButtonPressed@ {
1.757 + -moz-image-region: rect(18px, 594px, 36px, 576px);
1.758 + }
1.759 +
1.760 + #nav-bar-overflow-button@toolbarButtonPressed@ {
1.761 + -moz-image-region: rect(18px, 612px, 36px, 594px);
1.762 + }
1.763 +
1.764 + #tabview-button@toolbarButtonPressed@ {
1.765 + -moz-image-region: rect(18px, 648px, 36px, 630px);
1.766 + }
1.767 +
1.768 + #email-link-button@toolbarButtonPressed@ {
1.769 + -moz-image-region: rect(18px, 666px, 36px, 648px);
1.770 + }
1.771 +
1.772 + #sidebar-button@toolbarButtonPressed@ {
1.773 + -moz-image-region: rect(18px, 684px, 36px, 666px);
1.774 + }
1.775 +
1.776 + /**
1.777 + * OSX has a unique set of icons when fullscreen is in the checked state.
1.778 + */
1.779 +
1.780 + #fullscreen-button[checked="true"]:not([cui-areatype="menu-panel"]) {
1.781 + -moz-image-region: rect(36px, 432px, 54px, 414px);
1.782 + }
1.783 +
1.784 + #fullscreen-button[checked="true"]@toolbarButtonPressed@ {
1.785 + -moz-image-region: rect(54px, 432px, 72px, 414px);
1.786 + }
1.787 +}
1.788 +
1.789 +@media (min-resolution: 2dppx) {
1.790 + /* Whitelist built-in buttons, instead of .toolbarbutton-1,
1.791 + to avoid potentially breaking add-on toolbar buttons. */
1.792 +
1.793 + :-moz-any(@primaryToolbarButtons@),
1.794 + #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1.795 + list-style-image: url("chrome://browser/skin/Toolbar@2x.png");
1.796 + }
1.797 +
1.798 + toolbar[brighttext] :-moz-any(@primaryToolbarButtons@),
1.799 + toolbar[brighttext] #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1.800 + list-style-image: url("chrome://browser/skin/Toolbar-inverted@2x.png");
1.801 + }
1.802 +
1.803 + #back-button {
1.804 + -moz-image-region: rect(0, 72px, 36px, 36px);
1.805 + }
1.806 +
1.807 + #back-button:hover:active:not([disabled="true"]) {
1.808 + -moz-image-region: rect(36px, 72px, 72px, 36px);
1.809 + }
1.810 +
1.811 + #forward-button {
1.812 + -moz-image-region: rect(0, 144px, 36px, 108px);
1.813 + }
1.814 +
1.815 + #forward-button:hover:active:not([disabled="true"]) {
1.816 + -moz-image-region: rect(36px, 144px, 72px, 108px);
1.817 + }
1.818 +
1.819 + #home-button[cui-areatype="toolbar"] {
1.820 + -moz-image-region: rect(0, 252px, 36px, 216px);
1.821 + }
1.822 +
1.823 + #home-button[cui-areatype="toolbar"]:hover:active {
1.824 + -moz-image-region: rect(36px, 252px, 72px, 216px);
1.825 + }
1.826 +
1.827 + #bookmarks-menu-button[cui-areatype="toolbar"] {
1.828 + -moz-image-region: rect(0, 288px, 36px, 252px);
1.829 + }
1.830 +
1.831 + #bookmarks-menu-button[cui-areatype="toolbar"][buttonover]:hover:active:not([disabled="true"]) {
1.832 + -moz-image-region: rect(36px, 288px, 72px, 252px);
1.833 + }
1.834 +
1.835 + #bookmarks-menu-button[cui-areatype="toolbar"][starred] {
1.836 + -moz-image-region: rect(0, 324px, 36px, 288px);
1.837 + }
1.838 +
1.839 + #bookmarks-menu-button[cui-areatype="toolbar"][starred][buttonover]:hover:active:not([disabled="true"]) {
1.840 + -moz-image-region: rect(36px, 324px, 72px, 288px);
1.841 + }
1.842 +
1.843 + #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1.844 + -moz-image-region: rect(0px, 1260px, 36px, 1224px);
1.845 + }
1.846 +
1.847 + #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker:hover:active:not([disabled="true"]) > .dropmarker-icon {
1.848 + -moz-image-region: rect(36px, 1260px, 72px, 1224px);
1.849 + }
1.850 +
1.851 + #history-panelmenu[cui-areatype="toolbar"] {
1.852 + -moz-image-region: rect(0, 360px, 36px, 324px);
1.853 + }
1.854 +
1.855 + #history-panelmenu[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.856 + -moz-image-region: rect(36px, 360px, 72px, 324px);
1.857 + }
1.858 +
1.859 + #downloads-button[cui-areatype="toolbar"] {
1.860 + -moz-image-region: rect(0, 396px, 36px, 360px);
1.861 + }
1.862 +
1.863 + #downloads-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.864 + -moz-image-region: rect(36px, 396px, 72px, 360px);
1.865 + }
1.866 +
1.867 + #add-ons-button[cui-areatype="toolbar"] {
1.868 + -moz-image-region: rect(0, 432px, 36px, 396px);
1.869 + }
1.870 +
1.871 + #add-ons-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.872 + -moz-image-region: rect(36px, 432px, 72px, 396px);
1.873 + }
1.874 +
1.875 + #open-file-button[cui-areatype="toolbar"] {
1.876 + -moz-image-region: rect(0, 468px, 36px, 432px);
1.877 + }
1.878 +
1.879 + #open-file-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.880 + -moz-image-region: rect(36px, 468px, 72px, 432px);
1.881 + }
1.882 +
1.883 + #save-page-button[cui-areatype="toolbar"] {
1.884 + -moz-image-region: rect(0, 504px, 36px, 468px);
1.885 + }
1.886 +
1.887 + #save-page-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.888 + -moz-image-region: rect(36px, 504px, 72px, 468px);
1.889 + }
1.890 +
1.891 + #sync-button[cui-areatype="toolbar"] {
1.892 + -moz-image-region: rect(0, 540px, 36px, 504px);
1.893 + }
1.894 +
1.895 + #sync-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.896 + -moz-image-region: rect(36px, 540px, 72px, 504px);
1.897 + }
1.898 +
1.899 + #sync-button[cui-areatype="toolbar"][status="active"],
1.900 + #sync-button[cui-areatype="toolbar"][status="active"]:hover:active:not([disabled="true"]) {
1.901 + list-style-image: url("chrome://browser/skin/syncProgress-toolbar@2x.png");
1.902 + -moz-image-region: rect(0, 36px, 36px, 0px);
1.903 + }
1.904 +
1.905 + toolbar[brighttext] #sync-button[cui-areatype="toolbar"][status="active"],
1.906 + toolbar[brighttext] #sync-button[cui-areatype="toolbar"][status="active"]:hover:active:not([disabled="true"]) {
1.907 + list-style-image: url("chrome://browser/skin/syncProgress-toolbar-inverted@2x.png");
1.908 + }
1.909 +
1.910 + #feed-button[cui-areatype="toolbar"] {
1.911 + -moz-image-region: rect(0, 576px, 36px, 540px);
1.912 + }
1.913 +
1.914 + #feed-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.915 + -moz-image-region: rect(36px, 576px, 72px, 540px);
1.916 + }
1.917 +
1.918 + #social-share-button[cui-areatype="toolbar"] {
1.919 + -moz-image-region: rect(0, 612px, 36px, 576px);
1.920 + }
1.921 +
1.922 + #social-share-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.923 + -moz-image-region: rect(36px, 612px, 72px, 576px);
1.924 + }
1.925 +
1.926 + #characterencoding-button[cui-areatype="toolbar"] {
1.927 + -moz-image-region: rect(0, 648px, 36px, 612px);
1.928 + }
1.929 +
1.930 + #characterencoding-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.931 + -moz-image-region: rect(36px, 648px, 72px, 612px);
1.932 + }
1.933 +
1.934 + #new-window-button[cui-areatype="toolbar"] {
1.935 + -moz-image-region: rect(0, 684px, 36px, 648px);
1.936 + }
1.937 +
1.938 + #new-window-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.939 + -moz-image-region: rect(36px, 684px, 72px, 648px);
1.940 + }
1.941 +
1.942 + #e10s-button[cui-areatype="toolbar"] {
1.943 + -moz-image-region: rect(0, 684px, 36px, 648px);
1.944 + }
1.945 +
1.946 + #e10s-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.947 + -moz-image-region: rect(36px, 684px, 72px, 648px);
1.948 + }
1.949 +
1.950 + #e10s-button > .toolbarbutton-icon {
1.951 + transform: scaleY(-1);
1.952 + }
1.953 +
1.954 + #new-tab-button[cui-areatype="toolbar"] {
1.955 + -moz-image-region: rect(0, 720px, 36px, 684px);
1.956 + }
1.957 +
1.958 + #new-tab-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.959 + -moz-image-region: rect(36px, 720px, 72px, 684px);
1.960 + }
1.961 +
1.962 + #privatebrowsing-button[cui-areatype="toolbar"] {
1.963 + -moz-image-region: rect(0, 756px, 36px, 720px);
1.964 + }
1.965 +
1.966 + #privatebrowsing-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.967 + -moz-image-region: rect(36px, 756px, 72px, 720px);
1.968 + }
1.969 +
1.970 + #find-button[cui-areatype="toolbar"] {
1.971 + -moz-image-region: rect(0, 792px, 36px, 756px);
1.972 + }
1.973 +
1.974 + #find-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.975 + -moz-image-region: rect(36px, 792px, 72px, 756px);
1.976 + }
1.977 +
1.978 + #print-button[cui-areatype="toolbar"] {
1.979 + -moz-image-region: rect(0, 828px, 36px, 792px);
1.980 + }
1.981 +
1.982 + #print-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.983 + -moz-image-region: rect(36px, 828px, 72px, 792px);
1.984 + }
1.985 +
1.986 + #restore-button,
1.987 + #fullscreen-button[cui-areatype="toolbar"] {
1.988 + -moz-image-region: rect(0, 864px, 36px, 828px);
1.989 + }
1.990 +
1.991 + #restore-button:hover:active:not([disabled="true"]),
1.992 + #fullscreen-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.993 + -moz-image-region: rect(36px, 864px, 72px, 828px);
1.994 + }
1.995 +
1.996 + #fullscreen-button[cui-areatype="toolbar"][checked="true"] {
1.997 + -moz-image-region: rect(72px, 864px, 108px, 828px);
1.998 + }
1.999 +
1.1000 + #fullscreen-button[cui-areatype="toolbar"][checked="true"]:hover:active:not([disabled="true"]) {
1.1001 + -moz-image-region: rect(108px, 864px, 144px, 828px);
1.1002 + }
1.1003 +
1.1004 + #developer-button[cui-areatype="toolbar"] {
1.1005 + -moz-image-region: rect(0, 900px, 36px, 864px);
1.1006 + }
1.1007 +
1.1008 + #developer-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.1009 + -moz-image-region: rect(36px, 900px, 72px, 864px);
1.1010 + }
1.1011 +
1.1012 + #preferences-button[cui-areatype="toolbar"] {
1.1013 + -moz-image-region: rect(0, 936px, 36px, 900px);
1.1014 + }
1.1015 +
1.1016 + #preferences-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.1017 + -moz-image-region: rect(36px, 936px, 72px, 900px);
1.1018 + }
1.1019 +
1.1020 + #PanelUI-menu-button {
1.1021 + -moz-image-region: rect(0, 972px, 36px, 936px);
1.1022 + }
1.1023 +
1.1024 + #PanelUI-menu-button:hover:active:not([disabled="true"]) {
1.1025 + -moz-image-region: rect(36px, 972px, 72px, 936px);
1.1026 + }
1.1027 +
1.1028 + #edit-controls[cui-areatype="toolbar"] > #cut-button {
1.1029 + -moz-image-region: rect(0, 1008px, 36px, 972px);
1.1030 + }
1.1031 +
1.1032 + #edit-controls[cui-areatype="toolbar"] > #cut-button:hover:active:not([disabled="true"]) {
1.1033 + -moz-image-region: rect(36px, 1008px, 72px, 972px);
1.1034 + }
1.1035 +
1.1036 + #edit-controls[cui-areatype="toolbar"] > #copy-button {
1.1037 + -moz-image-region: rect(0, 1044px, 36px, 1008px);
1.1038 + }
1.1039 +
1.1040 + #edit-controls[cui-areatype="toolbar"] > #copy-button:hover:active:not([disabled="true"]) {
1.1041 + -moz-image-region: rect(36px, 1044px, 72px, 1008px);
1.1042 + }
1.1043 +
1.1044 + #edit-controls[cui-areatype="toolbar"] > #paste-button {
1.1045 + -moz-image-region: rect(0, 1080px, 36px, 1044px);
1.1046 + }
1.1047 +
1.1048 + #edit-controls[cui-areatype="toolbar"] > #paste-button:hover:active:not([disabled="true"]) {
1.1049 + -moz-image-region: rect(36px, 1080px, 72px, 1044px);
1.1050 + }
1.1051 +
1.1052 + #zoom-controls[cui-areatype="toolbar"] > #zoom-out-button {
1.1053 + -moz-image-region: rect(0, 1116px, 36px, 1080px);
1.1054 + }
1.1055 +
1.1056 + #zoom-controls[cui-areatype="toolbar"] > #zoom-out-button:hover:active:not([disabled="true"]) {
1.1057 + -moz-image-region: rect(36px, 1116px, 72px, 1080px);
1.1058 + }
1.1059 +
1.1060 + #zoom-controls[cui-areatype="toolbar"] > #zoom-in-button {
1.1061 + -moz-image-region: rect(0, 1152px, 36px, 1116px);
1.1062 + }
1.1063 +
1.1064 + #zoom-controls[cui-areatype="toolbar"] > #zoom-in-button:hover:active:not([disabled="true"]) {
1.1065 + -moz-image-region: rect(36px, 1152px, 72px, 1116px);
1.1066 + }
1.1067 +
1.1068 + #webrtc-status-button[cui-areatype="toolbar"] {
1.1069 + -moz-image-region: rect(0, 1188px, 36px, 1152px);
1.1070 + }
1.1071 +
1.1072 + #webrtc-status-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.1073 + -moz-image-region: rect(36px, 1188px, 72px, 1152px);
1.1074 + }
1.1075 +
1.1076 + #nav-bar-overflow-button {
1.1077 + -moz-image-region: rect(0, 1224px, 36px, 1188px);
1.1078 + }
1.1079 +
1.1080 + #nav-bar-overflow-button:hover:active:not([disabled="true"]) {
1.1081 + -moz-image-region: rect(36px, 1224px, 72px, 1188px);
1.1082 + }
1.1083 +
1.1084 + #nav-bar-overflow-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
1.1085 + transform: scaleX(-1);
1.1086 + }
1.1087 +
1.1088 + #tabview-button {
1.1089 + -moz-image-region: rect(0, 1296px, 36px, 1260px);
1.1090 + }
1.1091 +
1.1092 + #tabview-button@toolbarButtonPressed@ {
1.1093 + -moz-image-region: rect(36px, 1296px, 72px, 1260px);
1.1094 + }
1.1095 +
1.1096 + #email-link-button[cui-areatype="toolbar"] {
1.1097 + -moz-image-region: rect(0, 1332px, 36px, 1296px);
1.1098 + }
1.1099 +
1.1100 + #email-link-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.1101 + -moz-image-region: rect(36px, 1332px, 72px, 1296px);
1.1102 + }
1.1103 +
1.1104 + #sidebar-button[cui-areatype="toolbar"] {
1.1105 + -moz-image-region: rect(0, 1368px, 36px, 1332px);
1.1106 + }
1.1107 +
1.1108 + #sidebar-button[cui-areatype="toolbar"]:hover:active:not([disabled="true"]) {
1.1109 + -moz-image-region: rect(36px, 1368px, 72px, 1332px);
1.1110 + }
1.1111 +
1.1112 + :-moz-any(@primaryToolbarButtons@) > .toolbarbutton-icon,
1.1113 + :-moz-any(@primaryToolbarButtons@) > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
1.1114 + width: 18px;
1.1115 + }
1.1116 +
1.1117 + /* Menu panel and palette styles */
1.1118 +
1.1119 + toolbaritem[sdkstylewidget="true"] > toolbarbutton,
1.1120 + :-moz-any(@primaryToolbarButtons@)[cui-areatype="menu-panel"],
1.1121 + toolbarpaletteitem[place="palette"] > :-moz-any(@primaryToolbarButtons@) {
1.1122 + list-style-image: url(chrome://browser/skin/menuPanel@2x.png);
1.1123 + }
1.1124 +
1.1125 + #home-button[cui-areatype="menu-panel"],
1.1126 + toolbarpaletteitem[place="palette"] > #home-button {
1.1127 + -moz-image-region: rect(0px, 256px, 64px, 192px);
1.1128 + }
1.1129 +
1.1130 + #bookmarks-menu-button[cui-areatype="menu-panel"],
1.1131 + toolbarpaletteitem[place="palette"] > #bookmarks-menu-button {
1.1132 + -moz-image-region: rect(0px, 384px, 64px, 320px);
1.1133 + }
1.1134 +
1.1135 + #bookmarks-menu-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1.1136 + -moz-image-region: rect(64px, 384px, 128px, 320px);
1.1137 + }
1.1138 +
1.1139 + #history-panelmenu[cui-areatype="menu-panel"],
1.1140 + toolbarpaletteitem[place="palette"] > #history-panelmenu {
1.1141 + -moz-image-region: rect(0px, 448px, 64px, 384px);
1.1142 + }
1.1143 +
1.1144 + #history-panelmenu[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1.1145 + -moz-image-region: rect(64px, 448px, 128px, 384px);
1.1146 + }
1.1147 +
1.1148 + #downloads-button[cui-areatype="menu-panel"],
1.1149 + toolbarpaletteitem[place="palette"] > #downloads-button {
1.1150 + -moz-image-region: rect(0px, 512px, 64px, 448px);
1.1151 + }
1.1152 +
1.1153 + #add-ons-button[cui-areatype="menu-panel"],
1.1154 + toolbarpaletteitem[place="palette"] > #add-ons-button {
1.1155 + -moz-image-region: rect(0px, 576px, 64px, 512px);
1.1156 + }
1.1157 +
1.1158 + #open-file-button[cui-areatype="menu-panel"],
1.1159 + toolbarpaletteitem[place="palette"] > #open-file-button {
1.1160 + -moz-image-region: rect(0px, 640px, 64px, 576px);
1.1161 + }
1.1162 +
1.1163 + #save-page-button[cui-areatype="menu-panel"],
1.1164 + toolbarpaletteitem[place="palette"] > #save-page-button {
1.1165 + -moz-image-region: rect(0px, 704px, 64px, 640px);
1.1166 + }
1.1167 +
1.1168 + #sync-button[cui-areatype="menu-panel"],
1.1169 + toolbarpaletteitem[place="palette"] > #sync-button {
1.1170 + -moz-image-region: rect(0px, 768px, 64px, 704px);
1.1171 + }
1.1172 +
1.1173 + #sync-button[cui-areatype="menu-panel"][status="active"] {
1.1174 + list-style-image: url(chrome://browser/skin/syncProgress-menuPanel@2x.png);
1.1175 + -moz-image-region: rect(0px, 64px, 64px, 0px);
1.1176 + }
1.1177 +
1.1178 + #feed-button[cui-areatype="menu-panel"],
1.1179 + toolbarpaletteitem[place="palette"] > #feed-button {
1.1180 + -moz-image-region: rect(0px, 832px, 64px, 768px);
1.1181 + }
1.1182 +
1.1183 + #social-share-button[cui-areatype="menu-panel"],
1.1184 + toolbarpaletteitem[place="palette"] > #social-share-button {
1.1185 + -moz-image-region: rect(0px, 896px, 64px, 832px);
1.1186 + }
1.1187 +
1.1188 + #characterencoding-button[cui-areatype="menu-panel"],
1.1189 + toolbarpaletteitem[place="palette"] > #characterencoding-button {
1.1190 + -moz-image-region: rect(0, 960px, 64px, 896px);
1.1191 + }
1.1192 +
1.1193 + #characterencoding-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1.1194 + -moz-image-region: rect(64px, 960px, 128px, 896px);
1.1195 + }
1.1196 +
1.1197 + #new-window-button[cui-areatype="menu-panel"],
1.1198 + toolbarpaletteitem[place="palette"] > #new-window-button {
1.1199 + -moz-image-region: rect(0px, 1024px, 64px, 960px);
1.1200 + }
1.1201 +
1.1202 + #e10s-button[cui-areatype="menu-panel"],
1.1203 + toolbarpaletteitem[place="palette"] > #e10s-button {
1.1204 + -moz-image-region: rect(0px, 1024px, 64px, 960px);
1.1205 + }
1.1206 +
1.1207 + #new-tab-button[cui-areatype="menu-panel"],
1.1208 + toolbarpaletteitem[place="palette"] > #new-tab-button {
1.1209 + -moz-image-region: rect(0px, 1088px, 64px, 1024px);
1.1210 + }
1.1211 +
1.1212 + #privatebrowsing-button[cui-areatype="menu-panel"],
1.1213 + toolbarpaletteitem[place="palette"] > #privatebrowsing-button {
1.1214 + -moz-image-region: rect(0px, 1152px, 64px, 1088px);
1.1215 + }
1.1216 +
1.1217 + #tabview-button[cui-areatype="menu-panel"],
1.1218 + toolbarpaletteitem[place="palette"] > #tabview-button {
1.1219 + -moz-image-region: rect(0px, 1216px, 64px, 1152px);
1.1220 + }
1.1221 +
1.1222 + #find-button[cui-areatype="menu-panel"],
1.1223 + toolbarpaletteitem[place="palette"] > #find-button {
1.1224 + -moz-image-region: rect(0px, 1280px, 64px, 1216px);
1.1225 + }
1.1226 +
1.1227 + #print-button[cui-areatype="menu-panel"],
1.1228 + toolbarpaletteitem[place="palette"] > #print-button {
1.1229 + -moz-image-region: rect(0px, 1344px, 64px, 1280px);
1.1230 + }
1.1231 +
1.1232 + #fullscreen-button[cui-areatype="menu-panel"],
1.1233 + toolbarpaletteitem[place="palette"] > #fullscreen-button {
1.1234 + -moz-image-region: rect(0px, 1408px, 64px, 1344px);
1.1235 + }
1.1236 +
1.1237 + #developer-button[cui-areatype="menu-panel"],
1.1238 + toolbarpaletteitem[place="palette"] > #developer-button {
1.1239 + -moz-image-region: rect(0px, 1472px, 64px, 1408px);
1.1240 + }
1.1241 +
1.1242 + #developer-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] {
1.1243 + -moz-image-region: rect(64px, 1472px, 128px, 1408px);
1.1244 + }
1.1245 +
1.1246 + #preferences-button[cui-areatype="menu-panel"],
1.1247 + toolbarpaletteitem[place="palette"] > #preferences-button {
1.1248 + -moz-image-region: rect(0px, 1536px, 64px, 1472px);
1.1249 + }
1.1250 +
1.1251 + #email-link-button[cui-areatype="menu-panel"],
1.1252 + toolbarpaletteitem[place="palette"] > #email-link-button {
1.1253 + -moz-image-region: rect(0px, 1600px, 64px, 1536px);
1.1254 + }
1.1255 +
1.1256 + #sidebar-button[cui-areatype="menu-panel"],
1.1257 + toolbarpaletteitem[place="palette"] > #sidebar-button {
1.1258 + -moz-image-region: rect(0px, 1728px, 64px, 1664px);
1.1259 + }
1.1260 +
1.1261 + toolbaritem[sdkstylewidget="true"] > toolbarbutton {
1.1262 + -moz-image-region: rect(0, 1664px, 64px, 1600px);
1.1263 + }
1.1264 +
1.1265 + /* Footer and wide panel control icons */
1.1266 + #edit-controls@inAnyPanel@ > toolbarbutton,
1.1267 + #zoom-controls@inAnyPanel@ > toolbarbutton,
1.1268 + toolbarpaletteitem[place="palette"] > #edit-controls > toolbarbutton,
1.1269 + toolbarpaletteitem[place="palette"] > #zoom-controls > toolbarbutton {
1.1270 + list-style-image: url(chrome://browser/skin/menuPanel-small@2x.png);
1.1271 + }
1.1272 +
1.1273 + /* Wide items like the Cut/Copy/Paste and Zoom controls are special in that their icons
1.1274 + are 16x16 when in the panel, but 18x18 when in a toolbar. */
1.1275 + #edit-controls@inAnyPanel@ > toolbarbutton > .toolbarbutton-icon,
1.1276 + #zoom-controls@inAnyPanel@ > toolbarbutton > .toolbarbutton-icon,
1.1277 + toolbarpaletteitem[place="palette"] > #edit-controls > toolbarbutton > .toolbarbutton-icon,
1.1278 + toolbarpaletteitem[place="palette"] > #zoom-controls > toolbarbutton > .toolbarbutton-icon {
1.1279 + width: 16px;
1.1280 + }
1.1281 +
1.1282 + #edit-controls@inAnyPanel@ > #cut-button,
1.1283 + toolbarpaletteitem[place="palette"] > #edit-controls > #cut-button {
1.1284 + -moz-image-region: rect(0px, 64px, 32px, 32px);
1.1285 + }
1.1286 +
1.1287 + #edit-controls@inAnyPanel@ > #copy-button,
1.1288 + toolbarpaletteitem[place="palette"] > #edit-controls > #copy-button {
1.1289 + -moz-image-region: rect(0px, 96px, 32px, 64px);
1.1290 + }
1.1291 +
1.1292 + #edit-controls@inAnyPanel@ > #paste-button,
1.1293 + toolbarpaletteitem[place="palette"] > #edit-controls > #paste-button {
1.1294 + -moz-image-region: rect(0px, 128px, 32px, 96px);
1.1295 + }
1.1296 +
1.1297 + #zoom-controls@inAnyPanel@ > #zoom-out-button,
1.1298 + toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-out-button {
1.1299 + -moz-image-region: rect(0px, 160px, 32px, 128px);
1.1300 + }
1.1301 +
1.1302 + #zoom-controls@inAnyPanel@ > #zoom-in-button,
1.1303 + toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button {
1.1304 + -moz-image-region: rect(0px, 192px, 32px, 160px);
1.1305 + }
1.1306 +
1.1307 + #PanelUI-fxa-status > .toolbarbutton-icon,
1.1308 + #PanelUI-quit > .toolbarbutton-icon,
1.1309 + #PanelUI-customize > .toolbarbutton-icon,
1.1310 + #PanelUI-help > .toolbarbutton-icon {
1.1311 + width: 16px;
1.1312 + }
1.1313 +}
1.1314 +
1.1315 +toolbar .toolbarbutton-1:not([type="menu-button"]),
1.1316 +toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1.1317 + min-width: 28px;
1.1318 +}
1.1319 +
1.1320 +/* Help 16px icons fit: */
1.1321 +.toolbarbutton-1[cui-areatype="toolbar"]:not(:-moz-any(@primaryToolbarButtons@)) > .toolbarbutton-icon {
1.1322 + margin: 2px;
1.1323 +}
1.1324 +
1.1325 +/* Help SDK icons fit: */
1.1326 +toolbarbutton[sdk-button="true"][cui-areatype="toolbar"] > .toolbarbutton-icon {
1.1327 + width: 16px;
1.1328 +}
1.1329 +
1.1330 +#main-window:not([customizing]) .toolbarbutton-1[disabled="true"] > .toolbarbutton-icon,
1.1331 +#main-window:not([customizing]) .toolbarbutton-1[disabled="true"] > .toolbarbutton-badge-container > .toolbarbutton-icon,
1.1332 +#main-window:not([customizing]) .toolbarbutton-1 > .toolbarbutton-menubutton-button[disabled="true"] > .toolbarbutton-icon {
1.1333 + opacity: .4;
1.1334 +}
1.1335 +
1.1336 +@media (-moz-mac-lion-theme) {
1.1337 + #main-window:not([customizing]) .toolbarbutton-1[disabled="true"] > .toolbarbutton-icon,
1.1338 + #main-window:not([customizing]) .toolbarbutton-1[disabled="true"] > .toolbarbutton-badge-container > .toolbarbutton-icon,
1.1339 + #main-window:not([customizing]) .toolbarbutton-1 > .toolbarbutton-menubutton-button[disabled="true"] > .toolbarbutton-icon,
1.1340 + #main-window:not([customizing]) .toolbarbutton-1[disabled="true"] > .toolbarbutton-menu-dropmarker,
1.1341 + #main-window:not([customizing]) .toolbarbutton-1[disabled="true"] > .toolbarbutton-menubutton-dropmarker,
1.1342 + .toolbarbutton-1:not(:hover):-moz-window-inactive > .toolbarbutton-icon,
1.1343 + .toolbarbutton-1:not(:hover):-moz-window-inactive > .toolbarbutton-text,
1.1344 + .toolbarbutton-1:not(:hover):-moz-window-inactive > .toolbarbutton-badge-container > .toolbarbutton-icon,
1.1345 + .toolbarbutton-1:not(:hover):-moz-window-inactive > .toolbarbutton-menu-dropmarker,
1.1346 + .toolbarbutton-1:not(:hover):-moz-window-inactive > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
1.1347 + .toolbarbutton-1:not(:hover):-moz-window-inactive > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
1.1348 + opacity: .5;
1.1349 + }
1.1350 +
1.1351 + #main-window:not([customizing]) .toolbarbutton-1:-moz-window-inactive[disabled="true"] > .toolbarbutton-icon,
1.1352 + #main-window:not([customizing]) .toolbarbutton-1:-moz-window-inactive[disabled="true"] > .toolbarbutton-badge-container > .toolbarbutton-icon,
1.1353 + #main-window:not([customizing]) .toolbarbutton-1:-moz-window-inactive > .toolbarbutton-menubutton-button[disabled="true"] > .toolbarbutton-icon {
1.1354 + opacity: .25;
1.1355 + }
1.1356 +}
1.1357 +
1.1358 +.toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
1.1359 +.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1.1360 + list-style-image: url(chrome://browser/skin/toolbarbutton-dropmarker.png);
1.1361 +}
1.1362 +
1.1363 +@media (min-resolution: 2dppx) {
1.1364 + .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
1.1365 + .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1.1366 + list-style-image: url(chrome://browser/skin/toolbarbutton-dropmarker@2x.png);
1.1367 + }
1.1368 +
1.1369 + .toolbarbutton-1 > .toolbarbutton-menu-dropmarker > .dropmarker-icon,
1.1370 + .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1.1371 + width: 7px;
1.1372 + }
1.1373 +}
1.1374 +
1.1375 +.toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
1.1376 + -moz-margin-end: 1px;
1.1377 +}
1.1378 +
1.1379 +.toolbarbutton-1 > .toolbarbutton-menubutton-button {
1.1380 + -moz-border-end: none !important;
1.1381 +}
1.1382 +
1.1383 +.toolbarbutton-1 > .toolbarbutton-menubutton-button:-moz-locale-dir(rtl),
1.1384 +.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker:-moz-locale-dir(ltr) {
1.1385 + border-top-left-radius: 0;
1.1386 + border-bottom-left-radius: 0;
1.1387 +}
1.1388 +
1.1389 +.toolbarbutton-1 > .toolbarbutton-menubutton-button:-moz-locale-dir(ltr),
1.1390 +.toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker:-moz-locale-dir(rtl) {
1.1391 + border-top-right-radius: 0;
1.1392 + border-bottom-right-radius: 0;
1.1393 +}
1.1394 +
1.1395 +.toolbarbutton-1 > .toolbarbutton-text,
1.1396 +.toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-text {
1.1397 + margin: 2px 0 0;
1.1398 +}
1.1399 +
1.1400 +.toolbarbutton-1 > menupopup {
1.1401 + margin-top: 1px;
1.1402 +}
1.1403 +
1.1404 +.toolbarbutton-1 > menupopup.cui-widget-panel {
1.1405 + margin-top: -5px;
1.1406 +}
1.1407 +
1.1408 +/* Common back and forward button styles */
1.1409 +
1.1410 +#back-button,
1.1411 +#forward-button {
1.1412 + background: linear-gradient(rgba(255,255,255,0.5),
1.1413 + rgba(255,255,255,0.2) 50%,
1.1414 + rgba(255,255,255,0.1) 50%,
1.1415 + rgba(255,255,255,0.2)) repeat-x;
1.1416 +}
1.1417 +
1.1418 +#back-button:-moz-lwtheme,
1.1419 +#forward-button:-moz-lwtheme {
1.1420 + background-origin: border-box;
1.1421 + border: 1px solid rgba(0,0,0,0.4);
1.1422 + box-shadow: inset 0 1px rgba(255,255,255,0.3), 0 1px rgba(255,255,255,0.2);
1.1423 +}
1.1424 +
1.1425 +#back-button:active:hover:-moz-lwtheme,
1.1426 +#forward-button:active:hover:-moz-lwtheme {
1.1427 + background-color: rgba(0,0,0,0.2);
1.1428 + box-shadow: inset 0 2px 5px rgba(0,0,0,0.6), 0 1px rgba(255,255,255,0.2);
1.1429 +}
1.1430 +
1.1431 +#back-button:-moz-window-inactive,
1.1432 +#forward-button:-moz-window-inactive {
1.1433 + background-color: rgba(0,0,0,0.04);
1.1434 + border-color: rgba(0,0,0,0.2);
1.1435 +}
1.1436 +
1.1437 +#back-button:-moz-locale-dir(rtl) {
1.1438 + transform: scaleX(-1);
1.1439 +}
1.1440 +
1.1441 +/* Back button styles */
1.1442 +
1.1443 +#back-button {
1.1444 + width: 32px;
1.1445 + height: 32px;
1.1446 + padding: 4px 5px 4px 3px;
1.1447 + -moz-margin-end: 0;
1.1448 + border-radius: 10000px;
1.1449 +}
1.1450 +
1.1451 +#back-button:not(:-moz-lwtheme) {
1.1452 + height: 33px;
1.1453 + padding: 4px 5px 5px 3px;
1.1454 + margin-bottom: -1px;
1.1455 + background: url(chrome://browser/skin/keyhole-circle.png) 0 0 no-repeat;
1.1456 +}
1.1457 +
1.1458 +@media (min-resolution: 2dppx) {
1.1459 + #back-button:not(:-moz-lwtheme) {
1.1460 + background-image: url(chrome://browser/skin/keyhole-circle@2x.png);
1.1461 + background-size: 96px;
1.1462 + }
1.1463 +}
1.1464 +
1.1465 +#back-button:-moz-window-inactive:not(:-moz-lwtheme) {
1.1466 + background-position: -64px 0;
1.1467 +}
1.1468 +
1.1469 +#back-button:not([disabled="true"]):active:hover:not(:-moz-lwtheme),
1.1470 +#back-button[open="true"]:not(:-moz-lwtheme) {
1.1471 + background-position: -32px 0;
1.1472 +}
1.1473 +
1.1474 +/* Forward button styles */
1.1475 +
1.1476 +#forward-button {
1.1477 + margin-left: -2px;
1.1478 + margin-right: 0;
1.1479 + padding-left: 2px;
1.1480 + width: 32px;
1.1481 +}
1.1482 +
1.1483 +#forward-button > .toolbarbutton-icon {
1.1484 + /* shift the icon away from the back button */
1.1485 + margin-left: 3px;
1.1486 + margin-right: -1px;
1.1487 +}
1.1488 +
1.1489 +#forward-button:not(:-moz-lwtheme) {
1.1490 + background: linear-gradient(hsl(0,0%,99%), hsl(0,0%,67%)) padding-box;
1.1491 + border: 1px solid;
1.1492 + border-color: hsl(0,0%,31%) hsla(0,0%,29%,.6) hsl(0,0%,27%);
1.1493 + box-shadow: inset 0 1px 0 hsla(0,0%,100%,.35),
1.1494 + 0 1px 0 hsla(0,0%,100%,.2);
1.1495 +}
1.1496 +
1.1497 +#forward-button:hover:active:not(:-moz-lwtheme) {
1.1498 + background-image: linear-gradient(hsl(0,0%,74%), hsl(0,0%,61%));
1.1499 + box-shadow: inset rgba(0,0,0,.3) 0 -6px 10px,
1.1500 + inset #000 0 1px 3px,
1.1501 + inset rgba(0,0,0,.2) 0 1px 3px,
1.1502 + 0 1px 0 hsla(0,0%,100%,.2);
1.1503 +}
1.1504 +
1.1505 +#forward-button:-moz-window-inactive:not(:-moz-lwtheme) {
1.1506 + border-color: hsl(0,0%,64%) hsl(0,0%,65%) hsl(0,0%,66%);
1.1507 + background-image: linear-gradient(hsl(0,0%,99%), hsl(0,0%,82%));
1.1508 + box-shadow: inset 0 1px 0 hsla(0,0%,100%,.35);
1.1509 +}
1.1510 +
1.1511 +@media (-moz-mac-lion-theme) {
1.1512 + #forward-button:not(:-moz-lwtheme) {
1.1513 + background-image: linear-gradient(hsla(0,0%,100%,.73), hsla(0,0%,100%,.05) 85%);
1.1514 + border-color: hsla(0,0%,0%,.35) hsla(0,0%,0%,.25) hsla(0,0%,0%,.2);
1.1515 + box-shadow: inset 0 1px 0 hsla(0,0%,100%,.2),
1.1516 + inset 0 0 1px hsla(0,0%,100%,.1),
1.1517 + 0 1px 0 hsla(0,0%,100%,.2);
1.1518 + }
1.1519 +
1.1520 + #forward-button:hover:active:not(:-moz-lwtheme) {
1.1521 + background-image: linear-gradient(hsla(0,0%,60%,.37), hsla(0,0%,100%,.35) 95%);
1.1522 + border-color: hsla(0,0%,0%,.43) hsla(0,0%,0%,.25) hsla(0,0%,0%,.37);
1.1523 + box-shadow: inset 0 1px 0 hsla(0,0%,0%,.02),
1.1524 + inset 0 1px 2px hsla(0,0%,0%,.2),
1.1525 + 0 1px 0 hsla(0,0%,100%,.2);
1.1526 + }
1.1527 +
1.1528 + #forward-button:-moz-window-inactive:not(:-moz-lwtheme) {
1.1529 + background-image: none;
1.1530 + border-color: hsla(0,0%,0%,.2);
1.1531 + }
1.1532 +}
1.1533 +
1.1534 +@conditionalForwardWithUrlbar@:not([switchingtabs]) > #forward-button {
1.1535 + transition: margin-left @forwardTransitionLength@ ease-out;
1.1536 +}
1.1537 +
1.1538 +@conditionalForwardWithUrlbar@ > #forward-button[disabled] {
1.1539 + margin-left: -@conditionalForwardWithUrlbarWidth@px;
1.1540 +}
1.1541 +
1.1542 +@conditionalForwardWithUrlbar@:hover:not([switchingtabs]) > #forward-button[disabled] {
1.1543 + /* delay the hiding of the forward button when hovered to avoid accidental clicks on the url bar */
1.1544 + transition-delay: 100s;
1.1545 +}
1.1546 +
1.1547 +@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] {
1.1548 + /* when not hovered anymore, trigger a new transition to hide the forward button immediately */
1.1549 + margin-left: -@conditionalForwardWithUrlbarWidth@.01px;
1.1550 +}
1.1551 +
1.1552 +.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
1.1553 +.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
1.1554 + list-style-image: url("chrome://browser/skin/menu-back.png") !important;
1.1555 +}
1.1556 +
1.1557 +.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(ltr),
1.1558 +.unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
1.1559 + list-style-image: url("chrome://browser/skin/menu-forward.png") !important;
1.1560 +}
1.1561 +
1.1562 +/* home button */
1.1563 +
1.1564 +#home-button.bookmark-item {
1.1565 + /* We need to use !important here, because other selectors that apply padding
1.1566 + are more specific. */
1.1567 + padding-top: 0 !important;
1.1568 + padding-bottom: 0 !important;
1.1569 +}
1.1570 +
1.1571 +#home-button.bookmark-item > .toolbarbutton-icon {
1.1572 + display: -moz-box !important;
1.1573 + -moz-margin-start: -2px;
1.1574 + -moz-margin-end: 3px;
1.1575 +}
1.1576 +
1.1577 +/* tabview menu item */
1.1578 +
1.1579 +#menu_tabview {
1.1580 + list-style-image: url(chrome://browser/skin/tabview/tabview.png);
1.1581 +}
1.1582 +
1.1583 +#menu_tabview {
1.1584 + -moz-image-region: rect(2px, 98px, 18px, 82px);
1.1585 +}
1.1586 +
1.1587 +#menu_tabview[groups="0"] {
1.1588 + -moz-image-region: rect(2px, 18px, 18px, 2px);
1.1589 +}
1.1590 +
1.1591 +#menu_tabview[groups="1"] {
1.1592 + -moz-image-region: rect(2px, 38px, 18px, 22px);
1.1593 +}
1.1594 +
1.1595 +#menu_tabview[groups="2"] {
1.1596 + -moz-image-region: rect(2px, 58px, 18px, 42px);
1.1597 +}
1.1598 +
1.1599 +#menu_tabview[groups="3"] {
1.1600 + -moz-image-region: rect(2px, 78px, 18px, 62px);
1.1601 +}
1.1602 +
1.1603 +#cut-button {
1.1604 + -moz-margin-end: 0;
1.1605 +}
1.1606 +
1.1607 +#edit-controls[cui-areatype="toolbar"] > #cut-button {
1.1608 + -moz-border-end: 0;
1.1609 +}
1.1610 +
1.1611 +#paste-button {
1.1612 + -moz-border-start: none;
1.1613 + -moz-margin-start: 0;
1.1614 +}
1.1615 +
1.1616 +#cut-button:-moz-locale-dir(ltr),
1.1617 +#paste-button:-moz-locale-dir(rtl) {
1.1618 + border-top-right-radius: 0;
1.1619 + border-bottom-right-radius: 0;
1.1620 +}
1.1621 +
1.1622 +#cut-button:-moz-locale-dir(rtl),
1.1623 +#paste-button:-moz-locale-dir(ltr) {
1.1624 + border-top-left-radius: 0;
1.1625 + border-bottom-left-radius: 0;
1.1626 +}
1.1627 +
1.1628 +#copy-button {
1.1629 + border-radius: 0;
1.1630 + margin-right: 0;
1.1631 + margin-left: 0;
1.1632 +}
1.1633 +
1.1634 +/* zoom controls */
1.1635 +
1.1636 +#zoom-out-button {
1.1637 + -moz-margin-end: 0;
1.1638 +}
1.1639 +
1.1640 +#zoom-in-button {
1.1641 + -moz-margin-start: 0;
1.1642 + -moz-border-start: 0;
1.1643 +}
1.1644 +
1.1645 +#zoom-controls[cui-areatype="toolbar"] > #zoom-out-button {
1.1646 + -moz-border-end: 0;
1.1647 +}
1.1648 +
1.1649 +#zoom-controls[cui-areatype="toolbar"] > #zoom-in-button {
1.1650 + -moz-border-start-width: 1px;
1.1651 +}
1.1652 +
1.1653 +#zoom-controls[cui-areatype="toolbar"] > #zoom-reset-button {
1.1654 + border-radius: 0;
1.1655 +}
1.1656 +
1.1657 +#zoom-out-button:-moz-locale-dir(ltr),
1.1658 +#zoom-in-button:-moz-locale-dir(rtl) {
1.1659 + border-top-right-radius: 0;
1.1660 + border-bottom-right-radius: 0;
1.1661 +}
1.1662 +
1.1663 +#zoom-out-button:-moz-locale-dir(rtl),
1.1664 +#zoom-in-button:-moz-locale-dir(ltr) {
1.1665 + border-top-left-radius: 0;
1.1666 + border-bottom-left-radius: 0;
1.1667 +}
1.1668 +
1.1669 +#zoom-controls[cui-areatype="toolbar"]:not([overflowedItem=true]) > #zoom-reset-button {
1.1670 + min-width: 0;
1.1671 + margin: 0;
1.1672 + -moz-box-orient: horizontal;
1.1673 + -moz-box-align: center;
1.1674 +}
1.1675 +
1.1676 +#zoom-controls[cui-areatype="toolbar"]:not([overflowedItem=true]) > #zoom-reset-button > .toolbarbutton-text {
1.1677 + margin-top: 0;
1.1678 +}
1.1679 +
1.1680 +/* ----- FULLSCREEN WINDOW CONTROLS ----- */
1.1681 +
1.1682 +#minimize-button,
1.1683 +#close-button,
1.1684 +#fullscreen-button ~ #window-controls > #restore-button {
1.1685 + display: none;
1.1686 +}
1.1687 +
1.1688 +/* ::::: nav-bar-inner ::::: */
1.1689 +
1.1690 +#urlbar,
1.1691 +.searchbar-textbox {
1.1692 + font: icon;
1.1693 + -moz-appearance: none;
1.1694 + box-shadow: 0 1px rgba(255, 255, 255, 0.2), inset 0 1px hsla(0,0%,0%,.05);
1.1695 + margin: 0 4px;
1.1696 + padding: 1px 0;
1.1697 + border: 1px solid;
1.1698 + border-color: #626262 #787878 #8c8c8c;
1.1699 + background-clip: padding-box;
1.1700 +}
1.1701 +
1.1702 +@media (-moz-mac-lion-theme) {
1.1703 + #urlbar,
1.1704 + .searchbar-textbox {
1.1705 + background-image: linear-gradient(hsl(0,0%,97%), hsl(0,0%,100%));
1.1706 + border-color: hsla(0,0%,0%,.35) hsla(0,0%,0%,.25) hsla(0,0%,0%,.15);
1.1707 + box-shadow: 0 1px 0 hsla(0,0%,100%,.2),
1.1708 + inset 0 0 1px hsla(0,0%,0%,.05),
1.1709 + inset 0 1px 2px hsla(0,0%,0%,.1);
1.1710 + }
1.1711 +}
1.1712 +
1.1713 +@media not all and (-moz-mac-lion-theme) {
1.1714 + #urlbar:-moz-window-inactive,
1.1715 + .searchbar-textbox:-moz-window-inactive {
1.1716 + border-color: @toolbarbuttonInactiveBorderColor@;
1.1717 + }
1.1718 +}
1.1719 +
1.1720 +#urlbar[focused="true"],
1.1721 +.searchbar-textbox[focused="true"] {
1.1722 + border-color: -moz-mac-focusring;
1.1723 + box-shadow: @focusRingShadow@;
1.1724 +}
1.1725 +
1.1726 +#urlbar-container {
1.1727 + -moz-box-align: center;
1.1728 +}
1.1729 +
1.1730 +#urlbar {
1.1731 + -moz-padding-end: 4px;
1.1732 + border-radius: @toolbarbuttonCornerRadius@;
1.1733 +}
1.1734 +
1.1735 +@conditionalForwardWithUrlbar@ > #urlbar {
1.1736 + -moz-border-start: none;
1.1737 + margin-left: 0;
1.1738 +}
1.1739 +
1.1740 +@conditionalForwardWithUrlbar@ > #urlbar:-moz-locale-dir(ltr) {
1.1741 + border-top-left-radius: 0;
1.1742 + border-bottom-left-radius: 0;
1.1743 +}
1.1744 +
1.1745 +@conditionalForwardWithUrlbar@ > #urlbar:-moz-locale-dir(rtl) {
1.1746 + border-top-right-radius: 0;
1.1747 + border-bottom-right-radius: 0;
1.1748 +}
1.1749 +
1.1750 +@conditionalForwardWithUrlbar@ {
1.1751 + clip-path: url("chrome://browser/content/browser.xul#urlbar-back-button-clip-path");
1.1752 + -moz-margin-start: -6px;
1.1753 +}
1.1754 +
1.1755 +@conditionalForwardWithUrlbar@:-moz-locale-dir(rtl),
1.1756 +@conditionalForwardWithUrlbar@ > #urlbar:-moz-locale-dir(rtl) {
1.1757 + /* let urlbar-back-button-clip-path clip the urlbar's right side for RTL */
1.1758 + transform: scaleX(-1);
1.1759 +}
1.1760 +
1.1761 +@conditionalForwardWithUrlbar@:-moz-locale-dir(rtl) {
1.1762 + -moz-box-direction: reverse;
1.1763 +}
1.1764 +
1.1765 +#identity-box {
1.1766 + -moz-margin-end: 3px;
1.1767 + padding-top: 1px;
1.1768 + padding-bottom: 1px;
1.1769 + -moz-padding-start: 4px;
1.1770 + -moz-padding-end: 0;
1.1771 + font-size: .9em;
1.1772 +}
1.1773 +
1.1774 +#identity-box:-moz-locale-dir(ltr) {
1.1775 + border-top-left-radius: 2px;
1.1776 + border-bottom-left-radius: 2px;
1.1777 +}
1.1778 +
1.1779 +#identity-box:-moz-locale-dir(rtl) {
1.1780 + border-top-right-radius: 2px;
1.1781 + border-bottom-right-radius: 2px;
1.1782 +}
1.1783 +
1.1784 +#notification-popup-box:not([hidden]) + #identity-box {
1.1785 + -moz-padding-start: 10px;
1.1786 + border-radius: 0;
1.1787 +}
1.1788 +
1.1789 +@conditionalForwardWithUrlbar@ > #urlbar > #identity-box {
1.1790 + border-radius: 0;
1.1791 +}
1.1792 +
1.1793 +@conditionalForwardWithUrlbar@:not([switchingtabs]) > #urlbar > #identity-box {
1.1794 + transition: padding-left, padding-right;
1.1795 +}
1.1796 +
1.1797 +@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
1.1798 + padding-left: 10px;
1.1799 +}
1.1800 +
1.1801 +@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
1.1802 + padding-right: 10px;
1.1803 +}
1.1804 +
1.1805 +@conditionalForwardWithUrlbar@:hover:not([switchingtabs]) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box {
1.1806 + /* forward button hiding is delayed when hovered */
1.1807 + transition-delay: 100s;
1.1808 +}
1.1809 +
1.1810 +@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(ltr) {
1.1811 + padding-left: 10.01px;
1.1812 +}
1.1813 +
1.1814 +@conditionalForwardWithUrlbar@:not(:hover) > #forward-button[disabled] + #urlbar > #notification-popup-box[hidden] + #identity-box:-moz-locale-dir(rtl) {
1.1815 + padding-right: 10.01px;
1.1816 +}
1.1817 +
1.1818 +#urlbar[pageproxystate="valid"] > #identity-box.chromeUI,
1.1819 +#urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
1.1820 + -moz-padding-end: 4px;
1.1821 +}
1.1822 +
1.1823 +#identity-box:-moz-focusring {
1.1824 + box-shadow: 0 0 2px 1px -moz-mac-focusring inset,
1.1825 + 0 0 2px 2px -moz-mac-focusring;
1.1826 + -moz-border-end-style: none;
1.1827 + -moz-padding-end: 5px;
1.1828 +}
1.1829 +
1.1830 +#identity-icon-labels {
1.1831 + -moz-margin-start: 4px;
1.1832 +}
1.1833 +
1.1834 +.urlbar-input-box {
1.1835 + -moz-margin-start: 0;
1.1836 + padding: 3px 0 2px;
1.1837 +}
1.1838 +
1.1839 +.urlbar-history-dropmarker {
1.1840 + padding: 0 3px;
1.1841 + list-style-image: url("chrome://browser/skin/urlbar-history-dropmarker.png");
1.1842 + -moz-image-region: rect(0px, 11px, 14px, 0px);
1.1843 +}
1.1844 +
1.1845 +.urlbar-history-dropmarker[open="true"],
1.1846 +.urlbar-history-dropmarker:hover:active {
1.1847 + -moz-image-region: rect(0px, 22px, 14px, 11px);
1.1848 + background-image: radial-gradient(circle closest-side, hsla(205,100%,70%,.3), hsla(205,100%,70%,0));
1.1849 +}
1.1850 +
1.1851 +@media (min-resolution: 2dppx) {
1.1852 + .urlbar-history-dropmarker {
1.1853 + list-style-image: url("chrome://browser/skin/urlbar-history-dropmarker@2x.png");
1.1854 + -moz-image-region: rect(0px, 22px, 28px, 0px);
1.1855 + }
1.1856 +
1.1857 + .urlbar-history-dropmarker[open="true"],
1.1858 + .urlbar-history-dropmarker:hover:active {
1.1859 + -moz-image-region: rect(0px, 44px, 28px, 22px);
1.1860 + }
1.1861 +
1.1862 + .urlbar-history-dropmarker > .dropmarker-icon {
1.1863 + width: 11px;
1.1864 + }
1.1865 +}
1.1866 +
1.1867 +#urlbar-icons {
1.1868 + -moz-box-align: center;
1.1869 +}
1.1870 +
1.1871 +.urlbar-icon {
1.1872 + padding: 0 3px;
1.1873 +}
1.1874 +
1.1875 +.urlbar-icon[open="true"],
1.1876 +.urlbar-icon:hover:active {
1.1877 + background-image: radial-gradient(circle closest-side, hsla(205,100%,70%,.3), hsla(205,100%,70%,0));
1.1878 +}
1.1879 +
1.1880 +#urlbar-search-splitter {
1.1881 + min-width: 8px;
1.1882 + width: 8px;
1.1883 + background-image: none;
1.1884 + margin: 0 -4px;
1.1885 + position: relative;
1.1886 + height: 22px;
1.1887 +}
1.1888 +
1.1889 +#search-container {
1.1890 + min-width: calc(54px + 11ch);
1.1891 +}
1.1892 +
1.1893 +%include ../shared/identity-block.inc.css
1.1894 +
1.1895 +#page-proxy-favicon {
1.1896 + margin: 0px;
1.1897 + padding: 0px;
1.1898 + -moz-image-region: rect(0, 16px, 16px, 0);
1.1899 +}
1.1900 +
1.1901 +#identity-box:hover:active > #page-proxy-favicon,
1.1902 +#identity-box[open=true] > #page-proxy-favicon {
1.1903 + -moz-image-region: rect(0, 32px, 16px, 16px);
1.1904 +}
1.1905 +
1.1906 +/* The chromeUI identity-icon set includes three states,
1.1907 + but OS X only uses two of them. */
1.1908 +#identity-box.chromeUI:hover:active > #page-proxy-favicon,
1.1909 +#identity-box.chromeUI[open=true] > #page-proxy-favicon {
1.1910 + -moz-image-region: rect(0, 48px, 16px, 32px);
1.1911 +}
1.1912 +
1.1913 +@media (min-resolution: 2dppx) {
1.1914 + #page-proxy-favicon {
1.1915 + list-style-image: url(chrome://browser/skin/identity-icons-generic@2x.png);
1.1916 + -moz-image-region: rect(0, 32px, 32px, 0);
1.1917 + }
1.1918 +
1.1919 + .chromeUI > #page-proxy-favicon[pageproxystate="valid"] {
1.1920 + list-style-image: url(chrome://branding/content/identity-icons-brand@2x.png);
1.1921 + }
1.1922 +
1.1923 + .verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] {
1.1924 + list-style-image: url(chrome://browser/skin/identity-icons-https@2x.png);
1.1925 + }
1.1926 +
1.1927 + .verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] {
1.1928 + list-style-image: url(chrome://browser/skin/identity-icons-https-ev@2x.png);
1.1929 + }
1.1930 +
1.1931 + .mixedActiveContent > #page-proxy-favicon[pageproxystate="valid"] {
1.1932 + list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-active@2x.png);
1.1933 + }
1.1934 +
1.1935 + .mixedDisplayContent > #page-proxy-favicon[pageproxystate="valid"] {
1.1936 + list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-display@2x.png);
1.1937 + }
1.1938 +
1.1939 + .mixedDisplayContentLoadedActiveBlocked > #page-proxy-favicon[pageproxystate="valid"] {
1.1940 + list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-display@2x.png);
1.1941 + }
1.1942 +
1.1943 + #identity-box:hover:active > #page-proxy-favicon,
1.1944 + #identity-box[open=true] > #page-proxy-favicon {
1.1945 + -moz-image-region: rect(0, 64px, 32px, 32px);
1.1946 + }
1.1947 +
1.1948 + /* The chromeUI identity-icon set includes three states,
1.1949 + but OS X only uses two of them. */
1.1950 + #identity-box.chromeUI:hover:active > #page-proxy-favicon,
1.1951 + #identity-box.chromeUI[open=true] > #page-proxy-favicon {
1.1952 + -moz-image-region: rect(0, 96px, 32px, 64px);
1.1953 + }
1.1954 +}
1.1955 +
1.1956 +#wrapper-urlbar-container[place="palette"] {
1.1957 + max-width: 20em;
1.1958 +}
1.1959 +
1.1960 +#urlbar-display-box {
1.1961 + -moz-border-end: 1px solid #AAA;
1.1962 + -moz-margin-end: 3px;
1.1963 +}
1.1964 +
1.1965 +#urlbar-display {
1.1966 + margin-top: 0;
1.1967 + margin-bottom: 0;
1.1968 + color: GrayText;
1.1969 +}
1.1970 +
1.1971 +#PopupAutoCompleteRichResult {
1.1972 + margin-top: 2px;
1.1973 +}
1.1974 +
1.1975 +/* ----- AUTOCOMPLETE ----- */
1.1976 +
1.1977 +#treecolAutoCompleteImage {
1.1978 + max-width: 36px;
1.1979 +}
1.1980 +
1.1981 +.ac-result-type-bookmark,
1.1982 +.autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
1.1983 + list-style-image: url("chrome://browser/skin/places/star-icons.png");
1.1984 + -moz-image-region: rect(0, 48px, 16px, 32px);
1.1985 +}
1.1986 +
1.1987 +.ac-result-type-keyword,
1.1988 +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
1.1989 + list-style-image: url(chrome://global/skin/icons/search-textbox.png);
1.1990 + margin: 2px;
1.1991 + width: 12px;
1.1992 + height: 12px;
1.1993 +}
1.1994 +
1.1995 +richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type-bookmark,
1.1996 +.autocomplete-treebody::-moz-tree-image(selected, current, bookmark, treecolAutoCompleteImage) {
1.1997 + list-style-image: url("chrome://browser/skin/places/star-icons.png");
1.1998 + -moz-image-region: rect(0, 64px, 16px, 48px);
1.1999 +}
1.2000 +
1.2001 +.ac-result-type-tag,
1.2002 +.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
1.2003 + list-style-image: url("chrome://browser/skin/places/tag.png");
1.2004 + width: 16px;
1.2005 + height: 16px;
1.2006 +}
1.2007 +
1.2008 +.ac-extra > .ac-comment {
1.2009 + font-size: inherit;
1.2010 +}
1.2011 +
1.2012 +.ac-url-text,
1.2013 +.ac-action-text {
1.2014 + color: -moz-nativehyperlinktext;
1.2015 + font: message-box;
1.2016 +}
1.2017 +
1.2018 +richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
1.2019 + list-style-image: url("chrome://browser/skin/actionicon-tab.png");
1.2020 + -moz-image-region: rect(0, 16px, 11px, 0);
1.2021 + padding: 0 3px;
1.2022 +}
1.2023 +
1.2024 +richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
1.2025 + -moz-image-region: rect(11px, 16px, 22px, 0);
1.2026 +}
1.2027 +
1.2028 +@media (min-resolution: 2dppx) {
1.2029 + .ac-result-type-bookmark {
1.2030 + list-style-image: url("chrome://browser/skin/places/star-icons@2x.png");
1.2031 + -moz-image-region: rect(0, 64px, 32px, 32px);
1.2032 + }
1.2033 +
1.2034 + richlistitem[selected="true"][current="true"] > .ac-title-box > .ac-result-type-bookmark {
1.2035 + list-style-image: url("chrome://browser/skin/places/star-icons@2x.png");
1.2036 + -moz-image-region: rect(0, 128px, 32px, 96px);
1.2037 + }
1.2038 +
1.2039 + .ac-result-type-tag {
1.2040 + list-style-image: url("chrome://browser/skin/places/tag@2x.png");
1.2041 + }
1.2042 +
1.2043 + richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
1.2044 + list-style-image: url("chrome://browser/skin/actionicon-tab@2x.png");
1.2045 + -moz-image-region: rect(0, 32px, 22px, 0);
1.2046 + width: 22px;
1.2047 + }
1.2048 +
1.2049 + richlistitem[type~="action"][actiontype="switchtab"][selected="true"] > .ac-url-box > .ac-action-icon {
1.2050 + -moz-image-region: rect(22px, 32px, 44px, 0);
1.2051 + }
1.2052 +}
1.2053 +
1.2054 +.autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
1.2055 + color: GrayText;
1.2056 +}
1.2057 +
1.2058 +.ac-comment[selected="true"],
1.2059 +.ac-url-text[selected="true"],
1.2060 +.ac-action-text[selected="true"] {
1.2061 + color: inherit !important;
1.2062 +}
1.2063 +
1.2064 +.autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
1.2065 +.autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
1.2066 +{
1.2067 + color: GrayText;
1.2068 + font-size: smaller;
1.2069 +}
1.2070 +
1.2071 +.autocomplete-treebody::-moz-tree-cell(suggesthint) {
1.2072 + border-top: 1px solid GrayText;
1.2073 +}
1.2074 +
1.2075 +
1.2076 +/* ----- COMBINED GO/RELOAD/STOP BUTTON IN LOCATION BAR ----- */
1.2077 +
1.2078 +#urlbar > toolbarbutton {
1.2079 + margin: 0;
1.2080 + -moz-padding-start: 2px;
1.2081 + -moz-padding-end: 1px;
1.2082 + background-origin: border-box;
1.2083 + list-style-image: url("chrome://browser/skin/reload-stop-go.png");
1.2084 +}
1.2085 +
1.2086 +#urlbar > toolbarbutton:not([disabled]):hover:active {
1.2087 + background-image: radial-gradient(circle closest-side, hsla(205,100%,70%,.3), hsla(205,100%,70%,0));
1.2088 +}
1.2089 +
1.2090 +#urlbar-go-button {
1.2091 + -moz-image-region: rect(0, 42px, 14px, 28px);
1.2092 +}
1.2093 +
1.2094 +#urlbar-go-button:hover:active {
1.2095 + -moz-image-region: rect(14px, 42px, 28px, 28px);
1.2096 +}
1.2097 +
1.2098 +#urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
1.2099 + transform: scaleX(-1);
1.2100 +}
1.2101 +
1.2102 +#urlbar-reload-button {
1.2103 + -moz-image-region: rect(0, 14px, 14px, 0);
1.2104 +}
1.2105 +
1.2106 +#urlbar-reload-button:not([disabled]):hover:active {
1.2107 + -moz-image-region: rect(14px, 14px, 28px, 0);
1.2108 +}
1.2109 +
1.2110 +#urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
1.2111 + transform: scaleX(-1);
1.2112 +}
1.2113 +
1.2114 +#urlbar-stop-button {
1.2115 + -moz-image-region: rect(0, 28px, 14px, 14px);
1.2116 +}
1.2117 +
1.2118 +#urlbar-stop-button:hover:active {
1.2119 + -moz-image-region: rect(14px, 28px, 28px, 14px);
1.2120 +}
1.2121 +
1.2122 +#bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1.2123 + width: 18px;
1.2124 + height: 18px;
1.2125 +}
1.2126 +
1.2127 +#bookmarks-menu-button[cui-areatype="toolbar"].bookmark-item > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1.2128 + width: 16px;
1.2129 + height: 16px;
1.2130 +}
1.2131 +
1.2132 +#BMB_bookmarksPopup[side="top"],
1.2133 +#BMB_bookmarksPopup[side="bottom"] {
1.2134 + margin-left: -26px;
1.2135 + margin-right: -26px;
1.2136 +}
1.2137 +
1.2138 +#BMB_bookmarksPopup[side="left"],
1.2139 +#BMB_bookmarksPopup[side="right"] {
1.2140 + margin-top: -26px;
1.2141 + margin-bottom: -26px;
1.2142 +}
1.2143 +
1.2144 +@media (min-resolution: 2dppx) {
1.2145 + #urlbar > toolbarbutton {
1.2146 + list-style-image: url("chrome://browser/skin/reload-stop-go@2x.png");
1.2147 + }
1.2148 +
1.2149 + #urlbar-go-button {
1.2150 + -moz-image-region: rect(0, 84px, 28px, 56px);
1.2151 + }
1.2152 +
1.2153 + #urlbar-go-button:hover:active {
1.2154 + -moz-image-region: rect(28px, 84px, 56px, 56px);
1.2155 + }
1.2156 +
1.2157 + #urlbar-reload-button {
1.2158 + -moz-image-region: rect(0, 28px, 28px, 0);
1.2159 + }
1.2160 +
1.2161 + #urlbar-reload-button:not([disabled]):hover:active {
1.2162 + -moz-image-region: rect(28px, 28px, 56px, 0);
1.2163 + }
1.2164 +
1.2165 + #urlbar-stop-button {
1.2166 + -moz-image-region: rect(0, 56px, 28px, 28px);
1.2167 + }
1.2168 +
1.2169 + #urlbar-stop-button:hover:active {
1.2170 + -moz-image-region: rect(28px, 56px, 56px, 28px);
1.2171 + }
1.2172 +
1.2173 + #urlbar > toolbarbutton > .toolbarbutton-icon {
1.2174 + width: 14px;
1.2175 + }
1.2176 +}
1.2177 +
1.2178 +/* POPUP BLOCKER BUTTON */
1.2179 +#page-report-button {
1.2180 + list-style-image: url("chrome://browser/skin/urlbar-popup-blocked.png");
1.2181 + -moz-image-region: rect(0, 16px, 16px, 0);
1.2182 +}
1.2183 +
1.2184 +#page-report-button:hover:active,
1.2185 +#page-report-button[open="true"] {
1.2186 + -moz-image-region: rect(0, 32px, 16px, 16px);
1.2187 +}
1.2188 +
1.2189 +@media (min-resolution: 2dppx) {
1.2190 + #page-report-button {
1.2191 + list-style-image: url("chrome://browser/skin/urlbar-popup-blocked@2x.png");
1.2192 + -moz-image-region: rect(0, 32px, 32px, 0);
1.2193 + width: 22px;
1.2194 + }
1.2195 +
1.2196 + #page-report-button:hover:active,
1.2197 + #page-report-button[open="true"] {
1.2198 + -moz-image-region: rect(0, 64px, 32px, 32px);
1.2199 + }
1.2200 +}
1.2201 +
1.2202 +/* social share panel */
1.2203 +.social-share-frame {
1.2204 + background: linear-gradient(to bottom, rgba(242,242,242,.99), rgba(242,242,242,.95));
1.2205 + border-left: 1px solid #f8f8f8;
1.2206 + width: 330px;
1.2207 + height: 150px;
1.2208 + /* we resize our panels dynamically, make it look nice */
1.2209 + transition: height 100ms ease-out, width 100ms ease-out;
1.2210 +}
1.2211 +
1.2212 +.social-share-toolbar {
1.2213 + border-right: 1px solid #dedede;
1.2214 + background: linear-gradient(to bottom, rgba(247,247,247,.99), rgba(247,247,247,.95));
1.2215 +}
1.2216 +
1.2217 +#social-share-provider-buttons {
1.2218 + border-right: 1px solid #fbfbfb;
1.2219 + padding: 6px;
1.2220 +}
1.2221 +
1.2222 +#social-share-provider-buttons > .share-provider-button {
1.2223 + padding: 6px;
1.2224 + margin: 0;
1.2225 + border: none;
1.2226 + border-radius: 2px;
1.2227 +}
1.2228 +
1.2229 +#social-share-provider-buttons > .share-provider-button[checked],
1.2230 +#social-share-provider-buttons > .share-provider-button:active {
1.2231 + padding: 5px;
1.2232 + border: 1px solid #b5b5b8;
1.2233 + box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.2);
1.2234 +}
1.2235 +
1.2236 +#social-share-provider-buttons > .share-provider-button[checked] {
1.2237 + background: linear-gradient(to bottom, #d9d9d9, #e3e3e3);
1.2238 +}
1.2239 +
1.2240 +#social-share-provider-buttons > .share-provider-button > .toolbarbutton-text {
1.2241 + display: none;
1.2242 +}
1.2243 +#social-share-provider-buttons > .share-provider-button > .toolbarbutton-icon {
1.2244 + width: 16px;
1.2245 + min-height: 16px;
1.2246 + max-height: 16px;
1.2247 +}
1.2248 +
1.2249 +/* social recommending panel */
1.2250 +
1.2251 +#social-mark-button {
1.2252 + -moz-image-region: rect(0, 16px, 16px, 0);
1.2253 +}
1.2254 +
1.2255 +/* bookmarks menu-button */
1.2256 +
1.2257 +#bookmarks-menu-button.bookmark-item,
1.2258 +#bookmarks-menu-button.bookmark-item[open] {
1.2259 + list-style-image: url("chrome://browser/skin/places/star-icons.png");
1.2260 + -moz-image-region: rect(0px 16px 16px 0px);
1.2261 +}
1.2262 +
1.2263 +#bookmarks-menu-button.bookmark-item[starred] {
1.2264 + -moz-image-region: rect(0px 32px 16px 16px);
1.2265 +}
1.2266 +
1.2267 +#bookmarks-menu-button.bookmark-item > .toolbarbutton-menubutton-button {
1.2268 + padding: 0;
1.2269 +}
1.2270 +
1.2271 +@media (min-resolution: 2dppx) {
1.2272 + #bookmarks-menu-button.bookmark-item,
1.2273 + #bookmarks-menu-button.bookmark-item[open] {
1.2274 + list-style-image: url("chrome://browser/skin/places/star-icons@2x.png");
1.2275 + -moz-image-region: rect(0px 32px 32px 0px);
1.2276 + }
1.2277 +
1.2278 + #bookmarks-menu-button.bookmark-item[starred] {
1.2279 + -moz-image-region: rect(0px 64px 32px 32px);
1.2280 + }
1.2281 +
1.2282 + #bookmarks-menu-button.bookmark-item > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
1.2283 + width: 16px;
1.2284 + }
1.2285 +}
1.2286 +
1.2287 +/* BOOKMARKING PANEL */
1.2288 +#editBookmarkPanelStarIcon {
1.2289 + list-style-image: url("chrome://browser/skin/places/starred48.png");
1.2290 + width: 48px;
1.2291 + height: 48px;
1.2292 +}
1.2293 +
1.2294 +#editBookmarkPanelStarIcon[unstarred] {
1.2295 + list-style-image: url("chrome://browser/skin/places/unstarred48.png");
1.2296 +}
1.2297 +
1.2298 +@media (min-resolution: 2dppx) {
1.2299 + #editBookmarkPanelStarIcon {
1.2300 + list-style-image: url("chrome://browser/skin/places/starred48@2x.png");
1.2301 + -moz-image-region: rect(0px 96px 96px 0px);
1.2302 + }
1.2303 +}
1.2304 +
1.2305 +#editBookmarkPanelTitle {
1.2306 + font-size: 130%;
1.2307 + font-weight: bold;
1.2308 +}
1.2309 +
1.2310 +#editBMPanel_rows > row {
1.2311 + margin-bottom: 8px;
1.2312 +}
1.2313 +
1.2314 +#editBMPanel_rows > row:last-of-type {
1.2315 + margin-bottom: 0;
1.2316 +}
1.2317 +
1.2318 +/**** Input elements ****/
1.2319 +
1.2320 +#editBMPanel_rows > row > textbox,
1.2321 +#editBMPanel_rows > row > hbox > textbox {
1.2322 + -moz-appearance: none;
1.2323 + background: linear-gradient(#fafafa, #fff);
1.2324 + background-clip: padding-box;
1.2325 + border-radius: 3px;
1.2326 + border: 1px solid rgba(0,0,0,.3) !important;
1.2327 + box-shadow: inset 0 1px 1px 1px rgba(0,0,0,.05),
1.2328 + 0 1px rgba(255,255,255,.3);
1.2329 + margin: 0;
1.2330 + padding: 3px 6px;
1.2331 +}
1.2332 +
1.2333 +#editBMPanel_rows > row > textbox[focused="true"],
1.2334 +#editBMPanel_rows > row > hbox > textbox[focused="true"] {
1.2335 + border-color: -moz-mac-focusring !important;
1.2336 + box-shadow: @focusRingShadow@;
1.2337 +}
1.2338 +
1.2339 +/**** HUD style buttons ****/
1.2340 +
1.2341 +.editBookmarkPanelHeaderButton,
1.2342 +.editBookmarkPanelBottomButton {
1.2343 + @hudButton@
1.2344 + margin: 0;
1.2345 + min-width: 82px;
1.2346 + min-height: 22px;
1.2347 +}
1.2348 +
1.2349 +.editBookmarkPanelHeaderButton:hover:active,
1.2350 +.editBookmarkPanelBottomButton:hover:active {
1.2351 + @hudButtonPressed@
1.2352 +}
1.2353 +
1.2354 +.editBookmarkPanelHeaderButton:-moz-focusring,
1.2355 +.editBookmarkPanelBottomButton:-moz-focusring {
1.2356 + @hudButtonFocused@
1.2357 +}
1.2358 +
1.2359 +.editBookmarkPanelBottomButton[default="true"] {
1.2360 + background-color: #666;
1.2361 +}
1.2362 +
1.2363 +#editBookmarkPanelHeader {
1.2364 + margin-bottom: 6px;
1.2365 +}
1.2366 +
1.2367 +.editBookmarkPanelBottomButton:last-child {
1.2368 + -moz-margin-start: 8px;
1.2369 +}
1.2370 +
1.2371 +/* The following elements come from editBookmarkOverlay.xul. Styling that's
1.2372 + specific to the editBookmarkPanel should be in browser.css. Styling that
1.2373 + should be shared by all editBookmarkOverlay.xul consumers should be in
1.2374 + editBookmarkOverlay.css. */
1.2375 +
1.2376 +#editBMPanel_newFolderBox {
1.2377 + background: linear-gradient(#fff, #f2f2f2);
1.2378 + background-origin: padding-box;
1.2379 + background-clip: padding-box;
1.2380 + border-radius: 0 0 3px 3px;
1.2381 + border: 1px solid #a5a5a5;
1.2382 + box-shadow: inset 0 1px rgba(255,255,255,.8),
1.2383 + inset 0 0 1px rgba(255,255, 255,.25),
1.2384 + 0 1px rgba(255,255,255,.3);
1.2385 + margin: 0;
1.2386 + padding: 0;
1.2387 + height: 20px;
1.2388 +}
1.2389 +
1.2390 +#editBMPanel_newFolderButton {
1.2391 + -moz-appearance: none;
1.2392 + border: 0 solid #a5a5a5;
1.2393 + -moz-border-end-width: 1px;
1.2394 + padding: 0 9px;
1.2395 + margin: 0;
1.2396 + min-width: 21px;
1.2397 + min-height: 20px;
1.2398 + height: 20px;
1.2399 + color: #fff;
1.2400 + list-style-image: url("chrome://browser/skin/panel-plus-sign.png");
1.2401 + position: relative;
1.2402 +}
1.2403 +
1.2404 +#editBMPanel_newFolderButton:hover:active {
1.2405 + background: linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9));
1.2406 + box-shadow: inset 0 0 3px rgba(0,0,0,.2), inset 0 1px 7px rgba(0,0,0,.4);
1.2407 +}
1.2408 +
1.2409 +#editBMPanel_newFolderButton:-moz-focusring {
1.2410 + @hudButtonFocused@
1.2411 +}
1.2412 +
1.2413 +#editBMPanel_newFolderButton .button-text {
1.2414 + display: none;
1.2415 +}
1.2416 +
1.2417 +#editBMPanel_folderMenuList {
1.2418 + @hudButton@
1.2419 + background-clip: padding-box;
1.2420 + margin: 0;
1.2421 + min-height: 22px;
1.2422 + padding-top: 2px;
1.2423 + padding-bottom: 1px;
1.2424 + -moz-padding-start: 8px;
1.2425 + -moz-padding-end: 4px;
1.2426 +}
1.2427 +
1.2428 +#editBMPanel_folderMenuList:-moz-focusring {
1.2429 + @hudButtonFocused@
1.2430 +}
1.2431 +
1.2432 +#editBMPanel_folderMenuList[open="true"],
1.2433 +#editBMPanel_folderMenuList:hover:active {
1.2434 + @hudButtonPressed@
1.2435 +}
1.2436 +
1.2437 +#editBMPanel_folderMenuList > .menulist-dropmarker {
1.2438 + -moz-appearance: none;
1.2439 + display: -moz-box;
1.2440 + background-color: transparent;
1.2441 + border: 0;
1.2442 + margin: 0;
1.2443 + padding: 0;
1.2444 + -moz-padding-end: 4px;
1.2445 + width: 7px;
1.2446 +}
1.2447 +
1.2448 +#editBMPanel_folderMenuList > .menulist-dropmarker > .dropmarker-icon {
1.2449 + list-style-image: url("chrome://global/skin/icons/panel-dropmarker.png");
1.2450 +}
1.2451 +
1.2452 +/**** folder tree and tag selector ****/
1.2453 +
1.2454 +#editBMPanel_folderTree,
1.2455 +#editBMPanel_tagsSelector {
1.2456 + -moz-appearance: none;
1.2457 + background: linear-gradient(#fafafa, #fff);
1.2458 + background-clip: padding-box;
1.2459 + border-radius: 3px;
1.2460 + border: 1px solid rgba(0,0,0,.3);
1.2461 + box-shadow: inset 0 1px 1px 1px rgba(0,0,0,.05),
1.2462 + 0 1px rgba(255,255,255,.3);
1.2463 + margin: 0;
1.2464 +}
1.2465 +
1.2466 +#editBMPanel_folderTree:-moz-focusring,
1.2467 +#editBMPanel_tagsSelector:-moz-focusring {
1.2468 + border-color: -moz-mac-focusring;
1.2469 + box-shadow: @focusRingShadow@;
1.2470 +}
1.2471 +
1.2472 +#editBMPanel_folderTree {
1.2473 + border-bottom: none;
1.2474 + border-bottom-left-radius: 0;
1.2475 + border-bottom-right-radius: 0;
1.2476 + /* Implements editBookmarkPanel resizing on folderTree un-collapse. */
1.2477 + margin: 0 !important;
1.2478 + min-width: 27em;
1.2479 + position: relative;
1.2480 +}
1.2481 +
1.2482 +/**** expanders ****/
1.2483 +
1.2484 +#editBookmarkPanel .expander-up,
1.2485 +#editBookmarkPanel .expander-down {
1.2486 + @hudButton@
1.2487 + margin: 0;
1.2488 + -moz-margin-start: 4px;
1.2489 + min-width: 27px;
1.2490 + min-height: 22px;
1.2491 +}
1.2492 +
1.2493 +#editBookmarkPanel .expander-up:-moz-focusring,
1.2494 +#editBookmarkPanel .expander-down:-moz-focusring {
1.2495 + @hudButtonFocused@
1.2496 +}
1.2497 +
1.2498 +#editBookmarkPanel .expander-up:hover:active,
1.2499 +#editBookmarkPanel .expander-down:hover:active {
1.2500 + @hudButtonPressed@
1.2501 +}
1.2502 +
1.2503 +#editBookmarkPanel .expander-up {
1.2504 + list-style-image: url("chrome://browser/skin/panel-expander-open.png");
1.2505 +}
1.2506 +
1.2507 +#editBookmarkPanel .expander-down {
1.2508 + list-style-image: url("chrome://browser/skin/panel-expander-closed.png");
1.2509 +}
1.2510 +
1.2511 +#editBookmarkPanel .expander-up > .button-box > .button-icon,
1.2512 +#editBookmarkPanel .expander-down > .button-box > .button-icon {
1.2513 + margin: 1px 0 0;
1.2514 +}
1.2515 +
1.2516 +#editBookmarkPanel .expander-up > .button-box > .button-text,
1.2517 +#editBookmarkPanel .expander-down > .button-box > .button-text {
1.2518 + display: none;
1.2519 +}
1.2520 +
1.2521 +@media (min-resolution: 2dppx) {
1.2522 + #editBookmarkPanel .expander-up {
1.2523 + list-style-image: url("chrome://browser/skin/panel-expander-open@2x.png");
1.2524 + }
1.2525 +
1.2526 + #editBookmarkPanel .expander-down {
1.2527 + list-style-image: url("chrome://browser/skin/panel-expander-closed@2x.png");
1.2528 + }
1.2529 +
1.2530 + #editBookmarkPanel .expander-up > .button-box > .button-icon,
1.2531 + #editBookmarkPanel .expander-down > .button-box > .button-icon {
1.2532 + width: 9px;
1.2533 + }
1.2534 +}
1.2535 +
1.2536 +#editBMPanel_tagsField > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
1.2537 + opacity: 1.0;
1.2538 + color: #bbb;
1.2539 +}
1.2540 +
1.2541 +.editBMPanel_rowLabel {
1.2542 + text-align: end;
1.2543 +}
1.2544 +
1.2545 +.panel-promo-box {
1.2546 + margin: 8px -16px -16px -16px;
1.2547 + padding: 8px 16px;
1.2548 + background-color: hsla(210,4%,10%,.07);
1.2549 + border-top: 1px solid hsla(210,4%,10%,.12);
1.2550 + border-radius: 0 0 5px 5px;
1.2551 + box-shadow: 0 -1px hsla(0,0%,100%,.5) inset, 0 1px 1px hsla(0,0%,0%,.03) inset;
1.2552 + color: hsl(0,0%,30%);
1.2553 +}
1.2554 +
1.2555 +.panel-promo-icon {
1.2556 + list-style-image: url("chrome://browser/skin/sync-notification-24.png");
1.2557 + -moz-margin-end: 10px;
1.2558 + vertical-align: middle;
1.2559 +}
1.2560 +
1.2561 +.panel-promo-closebutton {
1.2562 + border: none;
1.2563 + -moz-margin-end: -14px;
1.2564 + margin-top: -8px;
1.2565 +}
1.2566 +
1.2567 +.panel-promo-closebutton > .toolbarbutton-text {
1.2568 + padding: 0;
1.2569 + margin: 0;
1.2570 +}
1.2571 +
1.2572 +@media (min-resolution: 2dppx) {
1.2573 + .panel-promo-closebutton > .toolbarbutton-icon {
1.2574 + width: 16px;
1.2575 + }
1.2576 +}
1.2577 +
1.2578 +/* History Swipe Animation */
1.2579 +
1.2580 +#historySwipeAnimationCurrentPage,
1.2581 +#historySwipeAnimationNextPage {
1.2582 + box-shadow: 0 3px 6px rgba(0, 0, 0, 0.6);
1.2583 +}
1.2584 +
1.2585 +#historySwipeAnimationContainer {
1.2586 + background: url("chrome://browser/skin/subtle-pattern.png") #B3B9C1;
1.2587 +}
1.2588 +
1.2589 +/* ----- SIDEBAR ELEMENTS ----- */
1.2590 +
1.2591 +#sidebar,
1.2592 +sidebarheader {
1.2593 + background-color: #e2e7ed;
1.2594 +}
1.2595 +
1.2596 +#sidebar:-moz-window-inactive,
1.2597 +sidebarheader:-moz-window-inactive {
1.2598 + background-color: #e8e8e8;
1.2599 +}
1.2600 +
1.2601 +sidebarheader {
1.2602 + padding: 2px;
1.2603 + text-shadow: none;
1.2604 +}
1.2605 +
1.2606 +sidebarheader > .close-icon > .toolbarbutton-text {
1.2607 + display: none;
1.2608 +}
1.2609 +
1.2610 +#sidebar-box {
1.2611 + -moz-appearance: dialog;
1.2612 + -moz-appearance: none;
1.2613 +}
1.2614 +
1.2615 +.sidebar-splitter {
1.2616 + -moz-border-start: none;
1.2617 + -moz-border-end: 1px solid #bdbdbd;
1.2618 + min-width: 1px;
1.2619 + width: 3px;
1.2620 + background-image: none !important;
1.2621 + background-color: transparent;
1.2622 + -moz-margin-start: -3px;
1.2623 + position: relative;
1.2624 +}
1.2625 +
1.2626 +#appcontent ~ .sidebar-splitter {
1.2627 + -moz-border-start: 1px solid #ccc;
1.2628 + -moz-border-end: none;
1.2629 + -moz-margin-start: 0;
1.2630 + -moz-margin-end: -3px;
1.2631 +}
1.2632 +
1.2633 +.sidebar-title,
1.2634 +#sidebar-title {
1.2635 + color: #535f6d;
1.2636 + font-weight: bold;
1.2637 +}
1.2638 +
1.2639 +.sidebar-throbber[loading="true"],
1.2640 +#sidebar-throbber[loading="true"] {
1.2641 + list-style-image: url("chrome://global/skin/icons/loading_16.png");
1.2642 +}
1.2643 +
1.2644 +/* ----- CONTENT ----- */
1.2645 +
1.2646 +.browserContainer > findbar {
1.2647 + background: @scopeBarBackground@;
1.2648 + border-top: @scopeBarSeparatorBorder@;
1.2649 + color: -moz-DialogText;
1.2650 + text-shadow: none;
1.2651 +}
1.2652 +
1.2653 +toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
1.2654 + display: none;
1.2655 +}
1.2656 +
1.2657 +.bookmark-item {
1.2658 + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
1.2659 +}
1.2660 +
1.2661 +@media (min-resolution: 2dppx) {
1.2662 + .bookmark-item {
1.2663 + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon@2x.png");
1.2664 + }
1.2665 +
1.2666 + image.bookmark-item {
1.2667 + width: 16px;
1.2668 + }
1.2669 +}
1.2670 +
1.2671 +.openintabs-menuitem {
1.2672 + list-style-image: none;
1.2673 +}
1.2674 +
1.2675 +/* ::::: tabbrowser ::::: */
1.2676 +
1.2677 +.tabbrowser-tabbox {
1.2678 + margin: 0;
1.2679 +}
1.2680 +
1.2681 +%include ../shared/tabs.inc.css
1.2682 +
1.2683 +.tab-label {
1.2684 + margin-top: 1px;
1.2685 + margin-bottom: 0;
1.2686 + text-align: center;
1.2687 +}
1.2688 +
1.2689 +@media (min-resolution: 2dppx) {
1.2690 + /* image preloading hack from shared/tabs.inc.css */
1.2691 + #tabbrowser-tabs::before {
1.2692 + background-image:
1.2693 + url(chrome://browser/skin/tabbrowser/tab-background-end@2x.png),
1.2694 + url(chrome://browser/skin/tabbrowser/tab-background-middle@2x.png),
1.2695 + url(chrome://browser/skin/tabbrowser/tab-background-start@2x.png);
1.2696 + }
1.2697 +
1.2698 + .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]),
1.2699 + .tabs-newtab-button:hover {
1.2700 + background-image: url(chrome://browser/skin/tabbrowser/tab-background-start@2x.png),
1.2701 + url(chrome://browser/skin/tabbrowser/tab-background-middle@2x.png),
1.2702 + url(chrome://browser/skin/tabbrowser/tab-background-end@2x.png);
1.2703 + }
1.2704 +
1.2705 + .tab-background-middle[selected=true] {
1.2706 + background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle@2x.png),
1.2707 + @fgTabTexture@,
1.2708 + none;
1.2709 + }
1.2710 +
1.2711 + .tab-background-start[selected=true]:-moz-locale-dir(ltr)::after,
1.2712 + .tab-background-end[selected=true]:-moz-locale-dir(rtl)::after {
1.2713 + background-image: url(chrome://browser/skin/tabbrowser/tab-stroke-start@2x.png);
1.2714 + }
1.2715 +
1.2716 + .tab-background-end[selected=true]:-moz-locale-dir(ltr)::after,
1.2717 + .tab-background-start[selected=true]:-moz-locale-dir(rtl)::after {
1.2718 + background-image: url(chrome://browser/skin/tabbrowser/tab-stroke-end@2x.png);
1.2719 + }
1.2720 +
1.2721 + .tab-icon-image {
1.2722 + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon@2x.png");
1.2723 + image-rendering: -moz-crisp-edges;
1.2724 + }
1.2725 +
1.2726 + .tab-throbber {
1.2727 + list-style-image: url("chrome://browser/skin/tabbrowser/connecting@2x.png");
1.2728 + }
1.2729 +
1.2730 + .tab-throbber[progress] {
1.2731 + list-style-image: url("chrome://browser/skin/tabbrowser/loading@2x.png");
1.2732 + }
1.2733 +
1.2734 + /* Background tab separators */
1.2735 + #tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
1.2736 + .tabbrowser-tab:not([selected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
1.2737 + #tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([selected]):not([beforehovered]):not(:hover)::after {
1.2738 + background-image: url(chrome://browser/skin/tabbrowser/tab-separator@2x.png);
1.2739 + }
1.2740 +}
1.2741 +
1.2742 +.tabbrowser-tab:not(:hover) > .tab-stack > .tab-content > .tab-icon-image:not([selected="true"]) {
1.2743 + opacity: .9;
1.2744 +}
1.2745 +
1.2746 +.tab-label:not([selected="true"]) {
1.2747 + opacity: .7;
1.2748 +}
1.2749 +
1.2750 +.tabbrowser-tab,
1.2751 +.tabs-newtab-button {
1.2752 + font: message-box;
1.2753 + border: none;
1.2754 +}
1.2755 +
1.2756 +.tabbrowser-tab[selected=true]:not(:-moz-lwtheme) {
1.2757 + /* overriding tabbox.css */
1.2758 + color: inherit;
1.2759 +}
1.2760 +
1.2761 +.tabbrowser-tab[selected=true] {
1.2762 + /* overriding tabbox.css */
1.2763 + text-shadow: inherit;
1.2764 +}
1.2765 +
1.2766 +.tabs-newtab-button > .toolbarbutton-icon {
1.2767 + -moz-box-align: center;
1.2768 + border: solid transparent;
1.2769 + border-width: 0 11px;
1.2770 +}
1.2771 +
1.2772 +.tabbrowser-tab:focus > .tab-stack > .tab-content > .tab-label {
1.2773 + box-shadow: @focusRingShadow@;
1.2774 +}
1.2775 +
1.2776 +/* We want the titlebar to be unified, but we still want to be able
1.2777 + * to give #TabsToolbar a background. So we can't set -moz-appearance:
1.2778 + * toolbar on #TabsToolbar itself. Instead, we set it on a box of the
1.2779 + * right size which is put underneath #TabsToolbar.
1.2780 + *
1.2781 + * Because of Bug 941309, we make sure this pseudoelement always exists,
1.2782 + * but we only make it visible when we need it.
1.2783 + */
1.2784 +#navigator-toolbox::before {
1.2785 + content: '';
1.2786 + display: block;
1.2787 + -moz-appearance: toolbar;
1.2788 + height: @tabMinHeight@;
1.2789 + margin-bottom: -@tabMinHeight@;
1.2790 + visibility: hidden;
1.2791 +}
1.2792 +
1.2793 +#main-window:not([customizing]) #navigator-toolbox[inFullscreen]:not(:-moz-lwtheme)::before,
1.2794 +#main-window:not(:-moz-any([customizing],[tabsintitlebar])) #navigator-toolbox:not(:-moz-lwtheme)::before {
1.2795 + visibility: visible;
1.2796 +}
1.2797 +
1.2798 +#TabsToolbar {
1.2799 + position: relative;
1.2800 + -moz-appearance: none;
1.2801 + background-repeat: repeat-x;
1.2802 +}
1.2803 +
1.2804 +#TabsToolbar:not(:-moz-lwtheme) {
1.2805 + color: #333;
1.2806 + text-shadow: @loweredShadow@;
1.2807 +}
1.2808 +
1.2809 +/*
1.2810 + * Draw the bottom border of the tabstrip when core doesn't do it for us.
1.2811 + * Because of Bug 941309, we make sure this pseudoelement always exists,
1.2812 + * but we only make it visible when we need it.
1.2813 + */
1.2814 +#TabsToolbar::after {
1.2815 + content: '';
1.2816 + /* Because we use placeholders for window controls etc. in the tabstrip,
1.2817 + * and position those with ordinal attributes, and because our layout code
1.2818 + * expects :before/:after nodes to come first/last in the frame list,
1.2819 + * we have to reorder this element to come last, hence the
1.2820 + * ordinal group value (see bug 853415). */
1.2821 + -moz-box-ordinal-group: 1001;
1.2822 + position: absolute;
1.2823 + bottom: @tabToolbarNavbarOverlap@;
1.2824 + left: 0;
1.2825 + right: 0;
1.2826 + z-index: 0;
1.2827 + border-bottom: 1px solid hsla(0,0%,0%,.3);
1.2828 + visibility: hidden;
1.2829 +}
1.2830 +
1.2831 +#main-window:-moz-any([sizemode="fullscreen"],[customize-entered]) #TabsToolbar::after,
1.2832 +#main-window:not([tabsintitlebar]) #TabsToolbar::after,
1.2833 +#TabsToolbar:-moz-lwtheme::after {
1.2834 + visibility: visible;
1.2835 +}
1.2836 +
1.2837 +#tabbrowser-tabs {
1.2838 + -moz-box-align: stretch;
1.2839 +}
1.2840 +
1.2841 +.tabs-newtab-button > .toolbarbutton-icon {
1.2842 + padding: 6px 0 4px;
1.2843 +}
1.2844 +
1.2845 +/* Background tabs:
1.2846 + *
1.2847 + * Decrease the height of the hoverable region of background tabs whenever the tabs are at the top
1.2848 + * of the window (e.g. no menubar, tabs in titlebar, etc.) to make it easier to drag the window by
1.2849 + * the titlebar. We don't need this in fullscreen since window dragging is not an issue there.
1.2850 + */
1.2851 +#main-window[tabsintitlebar]:not([inFullscreen]) .tab-background-middle:not([selected=true]) {
1.2852 + clip-path: url(chrome://browser/content/browser.xul#tab-hover-clip-path);
1.2853 +}
1.2854 +
1.2855 +/**
1.2856 + * Tab Drag and Drop
1.2857 + */
1.2858 +
1.2859 +.tab-drop-indicator {
1.2860 + list-style-image: url(chrome://browser/skin/tabbrowser/tabDragIndicator.png);
1.2861 + margin-top: -2px;
1.2862 + z-index: 3;
1.2863 +}
1.2864 +
1.2865 +@media (min-resolution: 2dppx) {
1.2866 + .tab-drop-indicator {
1.2867 + list-style-image: url(chrome://browser/skin/tabbrowser/tabDragIndicator@2x.png);
1.2868 + width: 12px;
1.2869 + }
1.2870 +}
1.2871 +
1.2872 +/**
1.2873 + * In-tab close button
1.2874 + */
1.2875 +
1.2876 +.tab-close-button > .toolbarbutton-icon {
1.2877 + -moz-margin-end: 0px !important;
1.2878 +}
1.2879 +
1.2880 +.tab-close-button {
1.2881 + -moz-appearance: none;
1.2882 + border: none !important;
1.2883 + background: none;
1.2884 + cursor: default;
1.2885 +}
1.2886 +
1.2887 +.tab-close-button.close-icon:not([selected=true]):not(:hover):-moz-lwtheme-brighttext {
1.2888 + -moz-image-region: rect(0, 64px, 16px, 48px);
1.2889 +}
1.2890 +
1.2891 +@media (min-resolution: 2dppx) {
1.2892 + .tab-close-button.close-icon:not([selected=true]):not(:hover):-moz-lwtheme-brighttext {
1.2893 + -moz-image-region: rect(0, 128px, 32px, 96px);
1.2894 + }
1.2895 +}
1.2896 +
1.2897 +.tabbrowser-arrowscrollbox > .scrollbutton-up,
1.2898 +.tabbrowser-arrowscrollbox > .scrollbutton-down {
1.2899 + -moz-image-region: rect(0, 13px, 20px, 0);
1.2900 + margin: 0 0 @tabToolbarNavbarOverlap@;
1.2901 + padding: 0 4px;
1.2902 + border: none;
1.2903 +}
1.2904 +
1.2905 +.tabbrowser-arrowscrollbox > .scrollbutton-up {
1.2906 + -moz-border-end: 2px solid transparent;
1.2907 +}
1.2908 +
1.2909 +.tabbrowser-arrowscrollbox > .scrollbutton-down {
1.2910 + -moz-border-start: 2px solid transparent;
1.2911 + transition: 1s background-color ease-out;
1.2912 +}
1.2913 +
1.2914 +.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
1.2915 + background-color: Highlight;
1.2916 + transition: none;
1.2917 +}
1.2918 +
1.2919 +.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(ltr),
1.2920 +.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(rtl) {
1.2921 + list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-left.png");
1.2922 +}
1.2923 +
1.2924 +.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(ltr),
1.2925 +.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(rtl) {
1.2926 + list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-right.png");
1.2927 +}
1.2928 +
1.2929 +.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(ltr):-moz-lwtheme-brighttext,
1.2930 +.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(rtl):-moz-lwtheme-brighttext {
1.2931 + list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-left-inverted.png");
1.2932 +}
1.2933 +
1.2934 +.tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(ltr):-moz-lwtheme-brighttext,
1.2935 +.tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(rtl):-moz-lwtheme-brighttext {
1.2936 + list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-right-inverted.png");
1.2937 +}
1.2938 +
1.2939 +.tabbrowser-arrowscrollbox > .scrollbutton-up:hover,
1.2940 +.tabbrowser-arrowscrollbox > .scrollbutton-down:hover {
1.2941 + -moz-image-region: rect(0, 26px, 20px, 13px);
1.2942 +}
1.2943 +
1.2944 +.tabbrowser-arrowscrollbox > .scrollbutton-up:hover:active,
1.2945 +.tabbrowser-arrowscrollbox > .scrollbutton-down:hover:active {
1.2946 + -moz-image-region: rect(0, 39px, 20px, 26px);
1.2947 +}
1.2948 +
1.2949 +.tabbrowser-arrowscrollbox > .scrollbutton-up[disabled] > .toolbarbutton-icon,
1.2950 +.tabbrowser-arrowscrollbox > .scrollbutton-down[disabled] > .toolbarbutton-icon {
1.2951 + -moz-image-region: rect(0, 13px, 20px, 0) !important;
1.2952 + opacity: .5;
1.2953 +}
1.2954 +
1.2955 +@media (min-resolution: 2dppx) {
1.2956 + .tabbrowser-arrowscrollbox > .scrollbutton-up,
1.2957 + .tabbrowser-arrowscrollbox > .scrollbutton-down {
1.2958 + -moz-image-region: rect(0, 26px, 40px, 0);
1.2959 + }
1.2960 +
1.2961 + .tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(ltr),
1.2962 + .tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(rtl) {
1.2963 + list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-left@2x.png");
1.2964 + }
1.2965 +
1.2966 + .tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(ltr),
1.2967 + .tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(rtl) {
1.2968 + list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-right@2x.png");
1.2969 + }
1.2970 +
1.2971 + .tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(ltr):-moz-lwtheme-brighttext,
1.2972 + .tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(rtl):-moz-lwtheme-brighttext {
1.2973 + list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-left-inverted@2x.png");
1.2974 + }
1.2975 +
1.2976 + .tabbrowser-arrowscrollbox > .scrollbutton-down:-moz-locale-dir(ltr):-moz-lwtheme-brighttext,
1.2977 + .tabbrowser-arrowscrollbox > .scrollbutton-up:-moz-locale-dir(rtl):-moz-lwtheme-brighttext {
1.2978 + list-style-image: url("chrome://browser/skin/tabbrowser/tab-arrow-right-inverted@2x.png");
1.2979 + }
1.2980 +
1.2981 + .tabbrowser-arrowscrollbox > .scrollbutton-up:hover,
1.2982 + .tabbrowser-arrowscrollbox > .scrollbutton-down:hover {
1.2983 + -moz-image-region: rect(0, 52px, 40px, 26px);
1.2984 + }
1.2985 +
1.2986 + .tabbrowser-arrowscrollbox > .scrollbutton-up:hover:active,
1.2987 + .tabbrowser-arrowscrollbox > .scrollbutton-down:hover:active {
1.2988 + -moz-image-region: rect(0, 78px, 40px, 52px);
1.2989 + }
1.2990 +
1.2991 + .tabbrowser-arrowscrollbox > .scrollbutton-up[disabled] > .toolbarbutton-icon,
1.2992 + .tabbrowser-arrowscrollbox > .scrollbutton-down[disabled] > .toolbarbutton-icon {
1.2993 + -moz-image-region: rect(0, 26px, 40px, 0) !important;
1.2994 + }
1.2995 +
1.2996 + .tabbrowser-arrowscrollbox > .scrollbutton-up > .toolbarbutton-icon,
1.2997 + .tabbrowser-arrowscrollbox > .scrollbutton-down > .toolbarbutton-icon {
1.2998 + width: 13px;
1.2999 + }
1.3000 +}
1.3001 +
1.3002 +.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):-moz-locale-dir(ltr),
1.3003 +.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):-moz-locale-dir(rtl) {
1.3004 + border-width: 0 2px 0 0;
1.3005 + border-style: solid;
1.3006 + border-image: url("chrome://browser/skin/tabbrowser/tab-overflow-border.png") 0 2 0 2 fill;
1.3007 +}
1.3008 +
1.3009 +.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):-moz-locale-dir(ltr),
1.3010 +.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):-moz-locale-dir(rtl) {
1.3011 + border-width: 0 0 0 2px;
1.3012 + border-style: solid;
1.3013 + border-image: url("chrome://browser/skin/tabbrowser/tab-overflow-border.png") 0 2 0 2 fill;
1.3014 +}
1.3015 +
1.3016 +/**
1.3017 + * Tabstrip & add-on bar toolbar buttons
1.3018 + */
1.3019 +
1.3020 +#TabsToolbar .toolbarbutton-1,
1.3021 +#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
1.3022 +#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1.3023 + -moz-appearance: none;
1.3024 + margin: 0;
1.3025 + /* !important flags needed because of bug 561154: */
1.3026 + /* Bug 990390: -moz-any is no longer used in the selector so the !important aren't necessary for that anymore. */
1.3027 + padding: 0 !important;
1.3028 + border: none !important;
1.3029 + border-radius: 0 !important;
1.3030 + background: none !important;
1.3031 + box-shadow: none !important;
1.3032 +}
1.3033 +
1.3034 +#TabsToolbar .toolbarbutton-1:not([type="menu-button"]),
1.3035 +#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1.3036 + padding: 0 1px;
1.3037 +}
1.3038 +
1.3039 +#TabsToolbar .toolbarbutton-1 {
1.3040 + margin-bottom: @tabToolbarNavbarOverlap@;
1.3041 +}
1.3042 +
1.3043 +#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1.3044 + padding-left: 4px;
1.3045 + padding-right: 4px;
1.3046 +}
1.3047 +
1.3048 +.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):hover,
1.3049 +.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):hover,
1.3050 +#TabsToolbar .toolbarbutton-1:not([type="menu-button"]):not([disabled=true]):not([open]):hover,
1.3051 +#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled=true]):hover,
1.3052 +#TabsToolbar .toolbarbutton-1:not([disabled=true]):not([buttonover]):hover > .toolbarbutton-menubutton-dropmarker {
1.3053 + background-image: linear-gradient(transparent, rgba(0,0,0,.15)) !important;
1.3054 +}
1.3055 +
1.3056 +.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):hover:active,
1.3057 +.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):hover:active,
1.3058 +#TabsToolbar .toolbarbutton-1:not([type="menu-button"]):not([disabled=true]):hover:active,
1.3059 +#TabsToolbar .toolbarbutton-1[type="menu"][open],
1.3060 +#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled=true]):hover:active,
1.3061 +#TabsToolbar .toolbarbutton-1[open]:not([disabled=true]):hover > .toolbarbutton-menubutton-dropmarker {
1.3062 + background-image: linear-gradient(transparent, rgba(0,0,0,.3)) !important;
1.3063 +}
1.3064 +
1.3065 +.tabs-newtab-button,
1.3066 +#TabsToolbar > #new-tab-button,
1.3067 +#TabsToolbar > toolbarpaletteitem > #new-tab-button {
1.3068 + list-style-image: url(chrome://browser/skin/tabbrowser/newtab.png);
1.3069 + -moz-image-region: rect(0, 18px, 20px, 0);
1.3070 +}
1.3071 +
1.3072 +.tabs-newtab-button:-moz-lwtheme-brighttext,
1.3073 +#TabsToolbar > #new-tab-button:-moz-lwtheme-brighttext,
1.3074 +#TabsToolbar > toolbarpaletteitem > #new-tab-button:-moz-lwtheme-brighttext {
1.3075 + list-style-image: url(chrome://browser/skin/tabbrowser/newtab-inverted.png);
1.3076 +}
1.3077 +
1.3078 +.tabs-newtab-button:hover,
1.3079 +#TabsToolbar > #new-tab-button:hover {
1.3080 + -moz-image-region: rect(0, 36px, 20px, 18px);
1.3081 +}
1.3082 +
1.3083 +.tabs-newtab-button:hover:active,
1.3084 +#TabsToolbar > #new-tab-button:hover:active {
1.3085 + -moz-image-region: rect(0, 54px, 20px, 36px);
1.3086 +}
1.3087 +
1.3088 +@media (min-resolution: 2dppx) {
1.3089 + .tabs-newtab-button,
1.3090 + #TabsToolbar > #new-tab-button,
1.3091 + #TabsToolbar > toolbarpaletteitem > #new-tab-button {
1.3092 + list-style-image: url(chrome://browser/skin/tabbrowser/newtab@2x.png);
1.3093 + -moz-image-region: rect(0, 36px, 40px, 0);
1.3094 + }
1.3095 +
1.3096 + .tabs-newtab-button:-moz-lwtheme-brighttext,
1.3097 + #TabsToolbar > #new-tab-button:-moz-lwtheme-brighttext,
1.3098 + #TabsToolbar > toolbarpaletteitem > #new-tab-button:-moz-lwtheme-brighttext {
1.3099 + list-style-image: url(chrome://browser/skin/tabbrowser/newtab-inverted@2x.png);
1.3100 + }
1.3101 +
1.3102 + .tabs-newtab-button:hover,
1.3103 + #TabsToolbar > #new-tab-button:hover {
1.3104 + -moz-image-region: rect(0, 72px, 40px, 36px);
1.3105 + }
1.3106 +
1.3107 + .tabs-newtab-button:hover:active,
1.3108 + #TabsToolbar > #new-tab-button:hover:active {
1.3109 + -moz-image-region: rect(0, 108px, 40px, 72px);
1.3110 + }
1.3111 +
1.3112 + .tabs-newtab-button > .toolbarbutton-icon {
1.3113 + width: 40px;
1.3114 + }
1.3115 +
1.3116 + #TabsToolbar > #new-tab-button > .toolbarbutton-icon,
1.3117 + #TabsToolbar > toolbarpaletteitem > #new-tab-button > .toolbarbutton-icon {
1.3118 + width: 18px;
1.3119 + }
1.3120 +}
1.3121 +
1.3122 +#alltabs-button {
1.3123 + list-style-image: url(chrome://browser/skin/tabbrowser/alltabs-box-bkgnd-icon.png);
1.3124 + -moz-image-region: rect(0, 17px, 20px, 0);
1.3125 +}
1.3126 +
1.3127 +#alltabs-button:-moz-lwtheme-brighttext {
1.3128 + list-style-image: url(chrome://browser/skin/tabbrowser/alltabs-box-bkgnd-icon-inverted.png);
1.3129 +}
1.3130 +
1.3131 +#alltabs-button:not([disabled="true"]):hover {
1.3132 + -moz-image-region: rect(0, 34px, 20px, 17px);
1.3133 +}
1.3134 +
1.3135 +#alltabs-button[open="true"]:not([disabled="true"]),
1.3136 +#alltabs-button:not([disabled="true"]):hover:active {
1.3137 + -moz-image-region: rect(0, 51px, 20px, 34px);
1.3138 +}
1.3139 +
1.3140 +@media (min-resolution: 2dppx) {
1.3141 + #alltabs-button {
1.3142 + list-style-image: url(chrome://browser/skin/tabbrowser/alltabs-box-bkgnd-icon@2x.png);
1.3143 + -moz-image-region: rect(0, 34px, 40px, 0);
1.3144 + }
1.3145 +
1.3146 + #alltabs-button:-moz-lwtheme-brighttext {
1.3147 + list-style-image: url(chrome://browser/skin/tabbrowser/alltabs-box-bkgnd-icon-inverted@2x.png);
1.3148 + }
1.3149 +
1.3150 + #alltabs-button:not([disabled="true"]):hover {
1.3151 + -moz-image-region: rect(0, 68px, 40px, 34px);
1.3152 + }
1.3153 +
1.3154 + #alltabs-button[open="true"]:not([disabled="true"]),
1.3155 + #alltabs-button:not([disabled="true"]):hover:active {
1.3156 + -moz-image-region: rect(0, 102px, 40px, 68px);
1.3157 + }
1.3158 +
1.3159 + #alltabs-button > .toolbarbutton-icon {
1.3160 + width: 17px;
1.3161 + }
1.3162 +}
1.3163 +
1.3164 +#alltabs-button > .toolbarbutton-menu-dropmarker {
1.3165 + display: none;
1.3166 +}
1.3167 +
1.3168 +#alltabs-button > .toolbarbutton-icon {
1.3169 + -moz-margin-end: 2px;
1.3170 +}
1.3171 +
1.3172 +/* All Tabs Menupopup */
1.3173 +.alltabs-item > .menu-iconic-left > .menu-iconic-icon {
1.3174 + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
1.3175 +}
1.3176 +
1.3177 +@media (min-resolution: 2dppx) {
1.3178 + .alltabs-item > .menu-iconic-left > .menu-iconic-icon {
1.3179 + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon@2x.png");
1.3180 + }
1.3181 +}
1.3182 +
1.3183 +.alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
1.3184 + list-style-image: url("chrome://global/skin/icons/loading_16.png") !important;
1.3185 +}
1.3186 +
1.3187 +.alltabs-item[tabIsVisible] {
1.3188 + /* box-shadow instead of background-color to work around native styling */
1.3189 + box-shadow: inset -5px 0 ThreeDShadow;
1.3190 +}
1.3191 +
1.3192 +/* Bookmarks toolbar */
1.3193 +#PlacesToolbarDropIndicator {
1.3194 + list-style-image: url(chrome://browser/skin/places/toolbarDropMarker.png);
1.3195 +}
1.3196 +
1.3197 +/* Bookmark drag and drop styles */
1.3198 +
1.3199 +.bookmark-item[dragover-into="true"] {
1.3200 + background: Highlight !important;
1.3201 + color: HighlightText !important;
1.3202 +}
1.3203 +
1.3204 +/* rules for menupopup drop indicators */
1.3205 +.menupopup-drop-indicator-bar {
1.3206 + position: relative;
1.3207 + /* these two margins must together compensate the indicator's height */
1.3208 + margin-top: -1px;
1.3209 + margin-bottom: -1px;
1.3210 +}
1.3211 +
1.3212 +.menupopup-drop-indicator {
1.3213 + list-style-image: none;
1.3214 + height: 2px;
1.3215 + -moz-margin-end: -4em;
1.3216 + background-color: Highlight;
1.3217 +}
1.3218 +
1.3219 +/* Popup Icons */
1.3220 +#identity-popup-icon {
1.3221 + height: 64px;
1.3222 + width: 64px;
1.3223 + padding: 0;
1.3224 + list-style-image: url("chrome://browser/skin/identity.png");
1.3225 + -moz-image-region: rect(0px, 64px, 64px, 0px);
1.3226 +}
1.3227 +
1.3228 +#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
1.3229 + -moz-image-region: rect(64px, 64px, 128px, 0px);
1.3230 +}
1.3231 +
1.3232 +#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
1.3233 + -moz-image-region: rect(128px, 64px, 192px, 0px);
1.3234 +}
1.3235 +
1.3236 +@media (min-resolution: 2dppx) {
1.3237 + #identity-popup-icon {
1.3238 + list-style-image: url("chrome://browser/skin/identity@2x.png");
1.3239 + -moz-image-region: rect(0px, 128px, 128px, 0px);
1.3240 + }
1.3241 +
1.3242 + #identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
1.3243 + -moz-image-region: rect(128px, 128px, 256px, 0px);
1.3244 + }
1.3245 +
1.3246 + #identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
1.3247 + -moz-image-region: rect(256px, 128px, 384px, 0px);
1.3248 + }
1.3249 +
1.3250 + #identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon {
1.3251 + list-style-image: url("chrome://branding/content/icon128.png");
1.3252 + }
1.3253 +}
1.3254 +
1.3255 +/* Popup Body Text */
1.3256 +.identity-popup-description {
1.3257 + white-space: pre-wrap;
1.3258 + -moz-padding-start: 15px;
1.3259 + margin: 2px 0 4px;
1.3260 +}
1.3261 +
1.3262 +.identity-popup-label {
1.3263 + white-space: pre-wrap;
1.3264 + -moz-padding-start: 15px;
1.3265 + margin: 0;
1.3266 +}
1.3267 +
1.3268 +#identity-popup-content-host ,
1.3269 +#identity-popup-content-owner {
1.3270 + font-weight: bold;
1.3271 + max-width: 300px;
1.3272 +}
1.3273 +
1.3274 +#identity-popup-content-host ,
1.3275 +#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
1.3276 + font-size: 140%;
1.3277 +}
1.3278 +
1.3279 +#identity-popup-content-owner {
1.3280 + margin-bottom: 0 !important;
1.3281 +}
1.3282 +
1.3283 +#identity-popup-content-verifier {
1.3284 + margin: 4px 0 2px;
1.3285 +}
1.3286 +
1.3287 +#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
1.3288 +#identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
1.3289 + margin-top: 10px;
1.3290 + -moz-margin-start: -24px;
1.3291 +}
1.3292 +
1.3293 +#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
1.3294 +#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
1.3295 + margin-top: 5px;
1.3296 + list-style-image: url("chrome://browser/skin/Secure-Glyph.png");
1.3297 +}
1.3298 +
1.3299 +#identity-popup-help-icon {
1.3300 + -moz-appearance: none;
1.3301 + border: none;
1.3302 + margin: 10px 0 0 2px;
1.3303 + background: none;
1.3304 + min-width: 0;
1.3305 + list-style-image: url("chrome://global/skin/icons/question-16.png");
1.3306 + cursor: pointer;
1.3307 +}
1.3308 +
1.3309 +#identity-popup-help-icon > .button-box > .button-text {
1.3310 + display: none;
1.3311 +}
1.3312 +
1.3313 +#identity-popup-help-icon > .button-box > .button-icon {
1.3314 + height: 16px;
1.3315 + width: 16px;
1.3316 +}
1.3317 +
1.3318 +#identity-popup-help-icon:focus {
1.3319 + @hudButtonFocused@
1.3320 +}
1.3321 +
1.3322 +#identity-popup-help-icon:hover:active {
1.3323 + @hudButtonPressed@
1.3324 +}
1.3325 +
1.3326 +@media (min-resolution: 2dppx) {
1.3327 + #identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
1.3328 + #identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
1.3329 + list-style-image: url("chrome://browser/skin/Secure-Glyph@2x.png");
1.3330 + width: 24px;
1.3331 + }
1.3332 +
1.3333 + #identity-popup-help-icon {
1.3334 + list-style-image: url("chrome://global/skin/icons/question-32.png");
1.3335 + }
1.3336 +}
1.3337 +
1.3338 +#identity-popup {
1.3339 + margin-top: 1px;
1.3340 +}
1.3341 +
1.3342 +#identity-popup > .panel-arrowcontainer > .panel-arrowcontent {
1.3343 + padding: 0;
1.3344 +}
1.3345 +
1.3346 +#identity-popup-container {
1.3347 + padding: 16px;
1.3348 +}
1.3349 +
1.3350 +#identity-popup-button-container {
1.3351 + background-color: hsla(210,4%,10%,.07);
1.3352 + border-top: 1px solid hsla(210,4%,10%,.12);
1.3353 + padding: 16px;
1.3354 + margin-top: 5px;
1.3355 +}
1.3356 +
1.3357 +#notification-popup-box {
1.3358 + position: relative;
1.3359 + background-color: #fff;
1.3360 + background-clip: padding-box;
1.3361 + padding-left: 3px;
1.3362 + border-radius: 2px 0 0 2px;
1.3363 + border-width: 0 8px 0 0;
1.3364 + border-style: solid;
1.3365 + border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 fill;
1.3366 + -moz-margin-end: -8px;
1.3367 +}
1.3368 +
1.3369 +@media (min-resolution: 2dppx) {
1.3370 + #notification-popup-box {
1.3371 + border-image: url("chrome://browser/skin/urlbar-arrow@2x.png") 0 16 0 0 fill;
1.3372 + }
1.3373 +}
1.3374 +
1.3375 +@conditionalForwardWithUrlbar@ > #forward-button[disabled] + #urlbar > #notification-popup-box {
1.3376 + padding-left: 7px;
1.3377 +}
1.3378 +
1.3379 +#notification-popup-box:-moz-locale-dir(rtl),
1.3380 +.notification-anchor-icon:-moz-locale-dir(rtl) {
1.3381 + transform: scaleX(-1);
1.3382 +}
1.3383 +
1.3384 +.notification-anchor-icon {
1.3385 + width: 16px;
1.3386 + height: 16px;
1.3387 + margin: 0 2px;
1.3388 +}
1.3389 +
1.3390 +.notification-anchor-icon:-moz-focusring {
1.3391 + box-shadow: 0 0 2px 1px -moz-mac-focusring inset,
1.3392 + 0 0 3px 2px -moz-mac-focusring;
1.3393 +}
1.3394 +
1.3395 +#social-notification-icon > .toolbarbutton-icon {
1.3396 + height: 16px;
1.3397 +}
1.3398 +
1.3399 +.default-notification-icon,
1.3400 +#default-notification-icon {
1.3401 + list-style-image: url(chrome://global/skin/icons/information-16.png);
1.3402 +}
1.3403 +@media (min-resolution: 2dppx) {
1.3404 + .default-notification-icon,
1.3405 + #default-notification-icon {
1.3406 + list-style-image: url(chrome://global/skin/icons/information-32.png);
1.3407 + }
1.3408 +}
1.3409 +
1.3410 +.identity-notification-icon,
1.3411 +#identity-notification-icon {
1.3412 + list-style-image: url(chrome://mozapps/skin/profile/profileicon.png);
1.3413 +}
1.3414 +/* XXX: need HiDPI version */
1.3415 +
1.3416 +.geo-notification-icon,
1.3417 +#geo-notification-icon {
1.3418 + list-style-image: url(chrome://browser/skin/Geolocation-16.png);
1.3419 +}
1.3420 +@media (min-resolution: 2dppx) {
1.3421 + .geo-notification-icon,
1.3422 + #geo-notification-icon {
1.3423 + list-style-image: url(chrome://browser/skin/Geolocation-16@2x.png);
1.3424 + }
1.3425 +}
1.3426 +
1.3427 +
1.3428 +#canvas-notification-icon {
1.3429 + list-style-image: url(chrome://browser/skin/canvas-popup.svg);
1.3430 +}
1.3431 +
1.3432 +.indexedDB-notification-icon,
1.3433 +#indexedDB-notification-icon {
1.3434 + list-style-image: url(chrome://global/skin/icons/question-16.png);
1.3435 +}
1.3436 +@media (min-resolution: 2dppx) {
1.3437 + .indexedDB-notification-icon,
1.3438 + #indexedDB-notification-icon {
1.3439 + list-style-image: url(chrome://global/skin/icons/question-32.png);
1.3440 + }
1.3441 +}
1.3442 +
1.3443 +#addons-notification-icon {
1.3444 + list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric-16.png);
1.3445 +}
1.3446 +@media (min-resolution: 2dppx) {
1.3447 + #addons-notification-icon {
1.3448 + list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric.png);
1.3449 + }
1.3450 +}
1.3451 +
1.3452 +#password-notification-icon {
1.3453 + list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png);
1.3454 +}
1.3455 +@media (min-resolution: 2dppx) {
1.3456 + #password-notification-icon {
1.3457 + list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16@2x.png);
1.3458 + }
1.3459 +}
1.3460 +
1.3461 +.webapps-notification-icon,
1.3462 +#webapps-notification-icon {
1.3463 + list-style-image: url(chrome://global/skin/icons/webapps-16.png);
1.3464 +}
1.3465 +@media (min-resolution: 2dppx) {
1.3466 + .webapps-notification-icon,
1.3467 + #webapps-notification-icon {
1.3468 + list-style-image: url(chrome://global/skin/icons/webapps-16@2x.png);
1.3469 + }
1.3470 +}
1.3471 +
1.3472 +#plugins-notification-icon {
1.3473 + list-style-image: url(chrome://browser/skin/notification-pluginNormal.png);
1.3474 +}
1.3475 +
1.3476 +#plugins-notification-icon.plugin-hidden {
1.3477 + list-style-image: url(chrome://browser/skin/notification-pluginAlert.png);
1.3478 +}
1.3479 +
1.3480 +#plugins-notification-icon.plugin-blocked {
1.3481 + list-style-image: url(chrome://browser/skin/notification-pluginBlocked.png);
1.3482 +}
1.3483 +
1.3484 +#plugins-notification-icon {
1.3485 + -moz-image-region: rect(0, 16px, 16px, 0);
1.3486 +}
1.3487 +
1.3488 +#plugins-notification-icon:hover {
1.3489 + -moz-image-region: rect(0, 32px, 16px, 16px);
1.3490 +}
1.3491 +
1.3492 +#plugins-notification-icon:active {
1.3493 + -moz-image-region: rect(0, 48px, 16px, 32px);
1.3494 +}
1.3495 +
1.3496 +@media (min-resolution: 2dppx) {
1.3497 + #plugins-notification-icon {
1.3498 + list-style-image: url(chrome://browser/skin/notification-pluginNormal@2x.png);
1.3499 + }
1.3500 +
1.3501 + #plugins-notification-icon.plugin-hidden {
1.3502 + list-style-image: url(chrome://browser/skin/notification-pluginAlert@2x.png);
1.3503 + }
1.3504 +
1.3505 + #plugins-notification-icon.plugin-blocked {
1.3506 + list-style-image: url(chrome://browser/skin/notification-pluginBlocked@2x.png);
1.3507 + }
1.3508 +
1.3509 + #plugins-notification-icon {
1.3510 + -moz-image-region: rect(0, 32px, 32px, 0);
1.3511 + }
1.3512 +
1.3513 + #plugins-notification-icon:hover {
1.3514 + -moz-image-region: rect(0, 64px, 32px, 32px);
1.3515 + }
1.3516 +
1.3517 + #plugins-notification-icon:active {
1.3518 + -moz-image-region: rect(0, 96px, 32px, 64px);
1.3519 + }
1.3520 +}
1.3521 +
1.3522 +#plugin-install-notification-icon {
1.3523 + list-style-image: url(chrome://browser/skin/pluginInstall-16.png);
1.3524 +}
1.3525 +@media (min-resolution: 2dppx) {
1.3526 + #plugin-install-notification-icon {
1.3527 + list-style-image: url(chrome://browser/skin/pluginInstall-16@2x.png);
1.3528 + }
1.3529 +}
1.3530 +
1.3531 +#notification-popup-box[hidden] {
1.3532 + /* Override display:none to make the pluginBlockedNotification animation work
1.3533 + when showing the notification repeatedly. */
1.3534 + display: -moz-box;
1.3535 + visibility: collapse;
1.3536 +}
1.3537 +
1.3538 +#plugins-notification-icon.plugin-blocked[showing] {
1.3539 + animation: pluginBlockedNotification 500ms ease 0s 5 alternate both;
1.3540 +}
1.3541 +
1.3542 +@keyframes pluginBlockedNotification {
1.3543 + from {
1.3544 + opacity: 0;
1.3545 + }
1.3546 + to {
1.3547 + opacity: 1;
1.3548 + }
1.3549 +}
1.3550 +
1.3551 +#mixed-content-blocked-notification-icon {
1.3552 + list-style-image: url(chrome://browser/skin/mixed-content-blocked-16.png);
1.3553 +}
1.3554 +@media (min-resolution: 2dppx) {
1.3555 + #mixed-content-blocked-notification-icon {
1.3556 + list-style-image: url(chrome://browser/skin/mixed-content-blocked-16@2x.png);
1.3557 + }
1.3558 +}
1.3559 +
1.3560 +.webRTC-shareDevices-notification-icon,
1.3561 +#webRTC-shareDevices-notification-icon {
1.3562 + list-style-image: url(chrome://browser/skin/webRTC-shareDevice-16.png);
1.3563 +}
1.3564 +@media (min-resolution: 2dppx) {
1.3565 + .webRTC-shareDevices-notification-icon,
1.3566 + #webRTC-shareDevices-notification-icon {
1.3567 + list-style-image: url(chrome://browser/skin/webRTC-shareDevice-16@2x.png);
1.3568 + }
1.3569 +}
1.3570 +
1.3571 +.webRTC-sharingDevices-notification-icon,
1.3572 +#webRTC-sharingDevices-notification-icon {
1.3573 + list-style-image: url(chrome://browser/skin/webRTC-sharingDevice-16.png);
1.3574 +}
1.3575 +@media (min-resolution: 2dppx) {
1.3576 + .webRTC-sharingDevices-notification-icon,
1.3577 + #webRTC-sharingDevices-notification-icon {
1.3578 + list-style-image: url(chrome://browser/skin/webRTC-sharingDevice-16@2x.png);
1.3579 + }
1.3580 +}
1.3581 +
1.3582 +.webRTC-shareMicrophone-notification-icon,
1.3583 +#webRTC-shareMicrophone-notification-icon {
1.3584 + list-style-image: url(chrome://browser/skin/webRTC-shareMicrophone-16.png);
1.3585 +}
1.3586 +@media (min-resolution: 2dppx) {
1.3587 + .webRTC-shareMicrophone-notification-icon,
1.3588 + #webRTC-shareMicrophone-notification-icon {
1.3589 + list-style-image: url(chrome://browser/skin/webRTC-shareMicrophone-16@2x.png);
1.3590 + }
1.3591 +}
1.3592 +
1.3593 +.webRTC-sharingMicrophone-notification-icon,
1.3594 +#webRTC-sharingMicrophone-notification-icon {
1.3595 + list-style-image: url(chrome://browser/skin/webRTC-sharingMicrophone-16.png);
1.3596 +}
1.3597 +@media (min-resolution: 2dppx) {
1.3598 + .webRTC-sharingMicrophone-notification-icon,
1.3599 + #webRTC-sharingMicrophone-notification-icon {
1.3600 + list-style-image: url(chrome://browser/skin/webRTC-sharingMicrophone-16@2x.png);
1.3601 + }
1.3602 +}
1.3603 +
1.3604 +.web-notifications-notification-icon,
1.3605 +#web-notifications-notification-icon {
1.3606 + list-style-image: url(chrome://browser/skin/notification-16.png);
1.3607 +}
1.3608 +@media (min-resolution: 2dppx) {
1.3609 + .web-notifications-notification-icon,
1.3610 + #web-notifications-notification-icon {
1.3611 + list-style-image: url(chrome://browser/skin/notification-16@2x.png);
1.3612 + }
1.3613 +}
1.3614 +
1.3615 +.pointerLock-notification-icon,
1.3616 +#pointerLock-notification-icon {
1.3617 + list-style-image: url(chrome://browser/skin/pointerLock-16.png);
1.3618 +}
1.3619 +@media (min-resolution: 2dppx) {
1.3620 + .pointerLock-notification-icon,
1.3621 + #pointerLock-notification-icon {
1.3622 + list-style-image: url(chrome://browser/skin/pointerLock-16@2x.png);
1.3623 + }
1.3624 +}
1.3625 +
1.3626 +.translate-notification-icon,
1.3627 +#translate-notification-icon {
1.3628 + list-style-image: url(chrome://browser/skin/translation-16.png);
1.3629 + -moz-image-region: rect(0px, 16px, 16px, 0px);
1.3630 +}
1.3631 +@media (min-resolution: 2dppx) {
1.3632 + .translate-notification-icon,
1.3633 + #translate-notification-icon {
1.3634 + list-style-image: url(chrome://browser/skin/translation-16@2x.png);
1.3635 + -moz-image-region: rect(0px, 32px, 32px, 0px);
1.3636 + }
1.3637 +}
1.3638 +
1.3639 +.translated-notification-icon,
1.3640 +#translated-notification-icon {
1.3641 + list-style-image: url(chrome://browser/skin/translation-16.png);
1.3642 + -moz-image-region: rect(0px, 32px, 16px, 16px);
1.3643 +}
1.3644 +@media (min-resolution: 2dppx) {
1.3645 + .translated-notification-icon,
1.3646 + #translated-notification-icon {
1.3647 + list-style-image: url(chrome://browser/skin/translation-16@2x.png);
1.3648 + -moz-image-region: rect(0px, 64px, 32px, 32px);
1.3649 + }
1.3650 +}
1.3651 +
1.3652 +
1.3653 +.popup-notification-icon {
1.3654 + width: 64px;
1.3655 + height: 64px;
1.3656 + -moz-margin-end: 10px;
1.3657 +}
1.3658 +
1.3659 +.popup-notification-icon[popupid="geolocation"] {
1.3660 + list-style-image: url(chrome://browser/skin/Geolocation-64.png);
1.3661 +}
1.3662 +@media (min-resolution: 2dppx) {
1.3663 + .popup-notification-icon[popupid="geolocation"] {
1.3664 + list-style-image: url(chrome://browser/skin/Geolocation-64@2x.png);
1.3665 + }
1.3666 +}
1.3667 +
1.3668 +.popup-notification-icon[popupid="web-notifications"] {
1.3669 + list-style-image: url(chrome://browser/skin/notification-64.png);
1.3670 +}
1.3671 +@media (min-resolution: 2dppx) {
1.3672 + .popup-notification-icon[popupid="web-notifications"] {
1.3673 + list-style-image: url(chrome://browser/skin/notification-64@2x.png);
1.3674 + }
1.3675 +}
1.3676 +
1.3677 +.popup-notification-icon[popupid="xpinstall-disabled"],
1.3678 +.popup-notification-icon[popupid="addon-progress"],
1.3679 +.popup-notification-icon[popupid="addon-install-cancelled"],
1.3680 +.popup-notification-icon[popupid="addon-install-blocked"],
1.3681 +.popup-notification-icon[popupid="addon-install-failed"],
1.3682 +.popup-notification-icon[popupid="addon-install-complete"] {
1.3683 + list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric.png);
1.3684 + width: 32px;
1.3685 + height: 32px;
1.3686 +}
1.3687 +
1.3688 +.popup-notification-icon[popupid="click-to-play-plugins"] {
1.3689 + list-style-image: url(chrome://mozapps/skin/plugins/pluginBlocked-64.png);
1.3690 +}
1.3691 +
1.3692 +.popup-notification-icon[popupid="plugins-not-found"] {
1.3693 + list-style-image: url(chrome://browser/skin/pluginInstall-64.png);
1.3694 +}
1.3695 +@media (min-resolution: 2dppx) {
1.3696 + .popup-notification-icon[popupid="plugins-not-found"] {
1.3697 + list-style-image: url(chrome://browser/skin/pluginInstall-64\@2x.png);
1.3698 + }
1.3699 +}
1.3700 +
1.3701 +.addon-progress-description {
1.3702 + width: 350px;
1.3703 + max-width: 350px;
1.3704 +}
1.3705 +
1.3706 +.popup-progress-label,
1.3707 +.popup-progress-meter {
1.3708 + -moz-margin-start: 0;
1.3709 + -moz-margin-end: 0;
1.3710 +}
1.3711 +
1.3712 +.popup-progress-cancel {
1.3713 + -moz-appearance: none;
1.3714 + min-height: 16px;
1.3715 + min-width: 16px;
1.3716 + max-height: 16px;
1.3717 + max-width: 16px;
1.3718 + padding: 0;
1.3719 + margin: 0 1px 0 1px;
1.3720 + list-style-image: url(chrome://mozapps/skin/downloads/buttons.png);
1.3721 + -moz-image-region: rect(0px, 16px, 16px, 0px);
1.3722 +}
1.3723 +
1.3724 +.popup-progress-cancel:hover {
1.3725 + -moz-image-region: rect(0px, 32px, 16px, 16px);
1.3726 +}
1.3727 +
1.3728 +.popup-progress-cancel:active {
1.3729 + -moz-image-region: rect(0px, 48px, 16px, 32px);
1.3730 +}
1.3731 +
1.3732 +.popup-notification-icon[popupid="canvas-permissions-prompt"] {
1.3733 + list-style-image: url(chrome://browser/skin/canvas-popup.svg);
1.3734 +}
1.3735 +
1.3736 +.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
1.3737 +.popup-notification-icon[popupid="indexedDB-quota-prompt"],
1.3738 +.popup-notification-icon[popupid*="offline-app-requested"],
1.3739 +.popup-notification-icon[popupid="offline-app-usage"] {
1.3740 + list-style-image: url(chrome://global/skin/icons/question-64.png);
1.3741 +}
1.3742 +
1.3743 +.popup-notification-icon[popupid="password-save"],
1.3744 +.popup-notification-icon[popupid="password-change"] {
1.3745 + list-style-image: url(chrome://mozapps/skin/passwordmgr/key-64.png);
1.3746 +}
1.3747 +
1.3748 +.popup-notification-icon[popupid="webapps-install-progress"],
1.3749 +.popup-notification-icon[popupid="webapps-install"] {
1.3750 + list-style-image: url(chrome://global/skin/icons/webapps-64.png);
1.3751 +}
1.3752 +
1.3753 +.popup-notification-icon[popupid="mixed-content-blocked"] {
1.3754 + list-style-image: url(chrome://browser/skin/mixed-content-blocked-64.png);
1.3755 +}
1.3756 +@media (min-resolution: 2dppx) {
1.3757 + .popup-notification-icon[popupid="mixed-content-blocked"] {
1.3758 + list-style-image: url(chrome://browser/skin/mixed-content-blocked-64@2x.png);
1.3759 + }
1.3760 +}
1.3761 +
1.3762 +.popup-notification-icon[popupid="pointerLock"] {
1.3763 + list-style-image: url(chrome://browser/skin/pointerLock-64.png);
1.3764 +}
1.3765 +@media (min-resolution: 2dppx) {
1.3766 + .popup-notification-icon[popupid="pointerLock"] {
1.3767 + list-style-image: url(chrome://browser/skin/pointerLock-64@2x.png);
1.3768 + }
1.3769 +}
1.3770 +#pointerLock-cancel {
1.3771 + margin: 0px;
1.3772 +}
1.3773 +
1.3774 +
1.3775 +.popup-notification-icon[popupid="webRTC-sharingDevices"],
1.3776 +.popup-notification-icon[popupid="webRTC-shareDevices"] {
1.3777 + list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64.png);
1.3778 +}
1.3779 +@media (min-resolution: 2dppx) {
1.3780 + .popup-notification-icon[popupid="webRTC-sharingDevices"],
1.3781 + .popup-notification-icon[popupid="webRTC-shareDevices"] {
1.3782 + list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64@2x.png);
1.3783 + }
1.3784 +}
1.3785 +
1.3786 +.popup-notification-icon[popupid="webRTC-sharingMicrophone"],
1.3787 +.popup-notification-icon[popupid="webRTC-shareMicrophone"] {
1.3788 + list-style-image: url(chrome://browser/skin/webRTC-shareMicrophone-64.png);
1.3789 +}
1.3790 +@media (min-resolution: 2dppx) {
1.3791 + .popup-notification-icon[popupid="webRTC-sharingMicrophone"],
1.3792 + .popup-notification-icon[popupid="webRTC-shareMicrophone"] {
1.3793 + list-style-image: url(chrome://browser/skin/webRTC-shareMicrophone-64@2x.png);
1.3794 + }
1.3795 +}
1.3796 +
1.3797 +/* Popup Buttons */
1.3798 +#identity-popup-more-info-button {
1.3799 + @hudButton@
1.3800 + margin: 10px 0 0;
1.3801 + min-height: 0px;
1.3802 +}
1.3803 +
1.3804 +#identity-popup-more-info-button:focus {
1.3805 + @hudButtonFocused@
1.3806 +}
1.3807 +
1.3808 +#identity-popup-more-info-button:hover:active {
1.3809 + @hudButtonPressed@
1.3810 +}
1.3811 +
1.3812 +/* ::::: Keyboard UI Panel ::::: */
1.3813 +
1.3814 +.KUI-panel {
1.3815 + -moz-appearance: none;
1.3816 + background: rgba(27%,27%,27%,.9) url(KUI-background.png) repeat-x;
1.3817 + color: white;
1.3818 + border-style: none;
1.3819 + border-radius: 20px;
1.3820 +}
1.3821 +
1.3822 +.KUI-panel[level="top"] {
1.3823 + background-color: rgba(27%,27%,27%,.65);
1.3824 + -moz-window-shadow: none;
1.3825 +}
1.3826 +
1.3827 +/* Ctrl-Tab */
1.3828 +
1.3829 +#ctrlTab-panel {
1.3830 + padding: 20px 10px 10px;
1.3831 + text-shadow: 0 0 1px rgb(27%,27%,27%), 0 0 2px rgb(27%,27%,27%);
1.3832 +}
1.3833 +
1.3834 +.ctrlTab-favicon[src] {
1.3835 + background-color: white;
1.3836 + width: 20px;
1.3837 + height: 20px;
1.3838 + padding: 2px;
1.3839 +}
1.3840 +
1.3841 +.ctrlTab-preview-inner > .tabPreview-canvas {
1.3842 + box-shadow: 1px 1px 2px rgb(12%,12%,12%);
1.3843 +}
1.3844 +
1.3845 +.ctrlTab-preview:not(#ctrlTab-showAll) > * > .ctrlTab-preview-inner > .tabPreview-canvas {
1.3846 + margin-bottom: 2px;
1.3847 +}
1.3848 +
1.3849 +.ctrlTab-preview-inner {
1.3850 + padding-bottom: 10px;
1.3851 +}
1.3852 +
1.3853 +#ctrlTab-showAll:not(:focus) > * > .ctrlTab-preview-inner {
1.3854 + padding: 10px;
1.3855 + background-color: rgba(255,255,255,.2);
1.3856 + border-radius: .5em;
1.3857 +}
1.3858 +
1.3859 +.ctrlTab-preview:focus > * > .ctrlTab-preview-inner {
1.3860 + color: white;
1.3861 + background-color: rgba(0,0,0,.6);
1.3862 + text-shadow: none;
1.3863 + padding: 8px;
1.3864 + border: 2px solid white;
1.3865 + border-radius: .5em;
1.3866 +}
1.3867 +
1.3868 +.ctrlTab-preview:not(#ctrlTab-showAll):focus > * > .ctrlTab-preview-inner {
1.3869 + margin: -10px -10px 0;
1.3870 +}
1.3871 +
1.3872 +#ctrlTab-showAll {
1.3873 + margin-top: .5em;
1.3874 +}
1.3875 +
1.3876 +/* Sync Panels */
1.3877 +
1.3878 +.sync-panel-icon {
1.3879 + height:32px;
1.3880 + width: 32px;
1.3881 + background: url("chrome://browser/content/abouthome/sync.png") top left no-repeat;
1.3882 +}
1.3883 +
1.3884 +@media (min-resolution: 2dppx) {
1.3885 + .sync-panel-icon {
1.3886 + background: url("chrome://browser/content/abouthome/sync@2x.png") top left no-repeat;
1.3887 + background-size: 32px 32px;
1.3888 + }
1.3889 +}
1.3890 +
1.3891 +.sync-panel-inner {
1.3892 + width: 0;
1.3893 + padding-left: 10px;
1.3894 +}
1.3895 +
1.3896 +.sync-panel-button-box {
1.3897 + margin-top: 1em;
1.3898 +}
1.3899 +
1.3900 +.sync-panel-button {
1.3901 + @hudButton@
1.3902 + margin: 0;
1.3903 + min-width: 72px;
1.3904 + min-height: 22px;
1.3905 +}
1.3906 +
1.3907 +.sync-panel-button:hover:active {
1.3908 + @hudButtonPressed@
1.3909 +}
1.3910 +
1.3911 +.sync-panel-button:-moz-focusring {
1.3912 + @hudButtonFocused@
1.3913 +}
1.3914 +
1.3915 +#sync-error-panel-title,
1.3916 +#sync-start-panel-title {
1.3917 + font-size: 120%;
1.3918 + font-weight: bold;
1.3919 + margin-bottom: 5px;
1.3920 +}
1.3921 +
1.3922 +#sync-start-panel-subtitle,
1.3923 +#sync-error-panel-subtitle {
1.3924 + margin: 0;
1.3925 +}
1.3926 +
1.3927 +/* Status panel */
1.3928 +
1.3929 +.statuspanel-label {
1.3930 + margin: 0;
1.3931 + padding: 2px 4px;
1.3932 + background: linear-gradient(#fff, #ddd);
1.3933 + border: 1px none #ccc;
1.3934 + border-top-style: solid;
1.3935 + color: #333;
1.3936 + text-shadow: none;
1.3937 +}
1.3938 +
1.3939 +.statuspanel-label:-moz-locale-dir(ltr):not([mirror]),
1.3940 +.statuspanel-label:-moz-locale-dir(rtl)[mirror] {
1.3941 + border-right-style: solid;
1.3942 + border-top-right-radius: .3em;
1.3943 + margin-right: 1em;
1.3944 +}
1.3945 +
1.3946 +.statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
1.3947 +.statuspanel-label:-moz-locale-dir(ltr)[mirror] {
1.3948 + border-left-style: solid;
1.3949 + border-top-left-radius: .3em;
1.3950 + margin-left: 1em;
1.3951 +}
1.3952 +
1.3953 +/* Lion Fullscreen window styling */
1.3954 +@media (-moz-mac-lion-theme) {
1.3955 + #navigator-toolbox[inFullscreen]::before {
1.3956 + /* Adjust by the full element height of #titlebar, since that element is
1.3957 + * not displayed in native full-screen.
1.3958 + * Also add the height of the tabs, since we're calculating the
1.3959 + * total height of this pseudo-element, not just the top-padding. */
1.3960 + height: calc(@tabMinHeight@ + @spaceAboveTabbar@) !important;
1.3961 + }
1.3962 +}
1.3963 +
1.3964 +#full-screen-warning-message {
1.3965 + background-image: url("chrome://browser/skin/fullscreen-darknoise.png");
1.3966 + color: white;
1.3967 + border-radius: 4px;
1.3968 + margin-top: 30px;
1.3969 + padding: 30px 50px;
1.3970 + box-shadow: 0 0 2px white;
1.3971 +}
1.3972 +
1.3973 +#full-screen-warning-container[obscure-browser] {
1.3974 + background-color: rgba(0,0,0,0.3);
1.3975 +}
1.3976 +
1.3977 +.full-screen-description {
1.3978 + font-size: 150%;
1.3979 +}
1.3980 +
1.3981 +#full-screen-domain-text {
1.3982 + font-size: 300%;
1.3983 +}
1.3984 +
1.3985 +.full-screen-approval-button,
1.3986 +#full-screen-remember-decision {
1.3987 + font-size: 120%;
1.3988 +}
1.3989 +
1.3990 +%include ../shared/devtools/responsivedesign.inc.css
1.3991 +%include ../shared/devtools/highlighter.inc.css
1.3992 +%include ../shared/devtools/commandline.inc.css
1.3993 +%include ../shared/plugin-doorhanger.inc.css
1.3994 +
1.3995 +%include downloads/indicator.css
1.3996 +
1.3997 +/* On mac, the popup notification contents are indented by default and so
1.3998 + the default closebutton margins from notification.css require adjustment */
1.3999 +
1.4000 +.click-to-play-plugins-notification-description-box > .popup-notification-closebutton {
1.4001 + -moz-margin-end: -6px;
1.4002 + margin-top: -7px;
1.4003 +}
1.4004 +
1.4005 +
1.4006 +
1.4007 +.gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
1.4008 + color: hsl(210,11%,16%);
1.4009 +}
1.4010 +
1.4011 +/* Developer Toolbar */
1.4012 +
1.4013 +#developer-toolbar-closebutton {
1.4014 + margin-left: 8px;
1.4015 + margin-right: 8px;
1.4016 +}
1.4017 +
1.4018 +/* Error counter */
1.4019 +
1.4020 +#developer-toolbar-toolbox-button[error-count]:before {
1.4021 + color: #FDF3DE;
1.4022 + min-width: 16px;
1.4023 + text-shadow: none;
1.4024 + background-image: linear-gradient(#B4211B, #8A1915);
1.4025 + border-radius: 1px;
1.4026 +}
1.4027 +
1.4028 +/* === social toolbar button === */
1.4029 +
1.4030 +#social-toolbar-item > .toolbarbutton-1 {
1.4031 + margin-left: 0;
1.4032 + margin-right: 0;
1.4033 + border-top-left-radius: 0;
1.4034 + border-bottom-left-radius: 0;
1.4035 + border-top-right-radius: 0;
1.4036 + border-bottom-right-radius: 0;
1.4037 +}
1.4038 +
1.4039 +#social-toolbar-item > .toolbarbutton-1:-moz-locale-dir(ltr) {
1.4040 + -moz-border-end-width: 0;
1.4041 +}
1.4042 +#social-toolbar-item > .toolbarbutton-1:last-child:-moz-locale-dir(ltr) {
1.4043 + -moz-border-end-width: 1px;
1.4044 +}
1.4045 +#social-toolbar-item > .toolbarbutton-1:-moz-locale-dir(rtl) {
1.4046 + -moz-border-start-width: 0;
1.4047 +}
1.4048 +#social-toolbar-item > .toolbarbutton-1:first-child:-moz-locale-dir(rtl) {
1.4049 + -moz-border-start-width: 1px;
1.4050 +}
1.4051 +
1.4052 +#social-toolbar-item > .toolbarbutton-1:-moz-locale-dir(ltr):first-child,
1.4053 +#social-toolbar-item > .toolbarbutton-1:-moz-locale-dir(rtl):last-child {
1.4054 + margin-left: 4px;
1.4055 + border-top-left-radius: 3px;
1.4056 + border-bottom-left-radius: 3px;
1.4057 +}
1.4058 +#social-toolbar-item > .toolbarbutton-1:-moz-locale-dir(rtl):first-child,
1.4059 +#social-toolbar-item > .toolbarbutton-1:-moz-locale-dir(ltr):last-child {
1.4060 + margin-right: 4px;
1.4061 + border-top-right-radius: 3px;
1.4062 + border-bottom-right-radius: 3px;
1.4063 +}
1.4064 +
1.4065 +#social-toolbar-item > toolbaritem {
1.4066 + margin: 0;
1.4067 +}
1.4068 +
1.4069 +#social-provider-button {
1.4070 + list-style-image: url(chrome://browser/skin/social/services-16.png);
1.4071 +}
1.4072 +
1.4073 +@media (min-resolution: 2dppx) {
1.4074 + #social-provider-button {
1.4075 + list-style-image: url(chrome://browser/skin/social/services-16@2x.png);
1.4076 + }
1.4077 + #social-provider-button > .toolbarbutton-icon {
1.4078 + width: 16px;
1.4079 + }
1.4080 +}
1.4081 +
1.4082 +#social-provider-button > .toolbarbutton-menu-dropmarker {
1.4083 + display: none;
1.4084 +}
1.4085 +
1.4086 +.toolbarbutton-badge-container {
1.4087 + margin: 0;
1.4088 + padding: 0;
1.4089 + position: relative;
1.4090 +}
1.4091 +
1.4092 +.toolbarbutton-badge[badge]:not([badge=""]) {
1.4093 + /* The |content| property is set in the content stylesheet. */
1.4094 + font-size: 9px;
1.4095 + font-weight: bold;
1.4096 + padding: 0 1px;
1.4097 + color: #fff;
1.4098 + background-color: rgb(240,61,37);
1.4099 + border: 1px solid rgb(216,55,34);
1.4100 + border-radius: 2px;
1.4101 + box-shadow: 0 1px 0 rgba(0,39,121,0.77);
1.4102 + position: absolute;
1.4103 + top: 0;
1.4104 + right: 0;
1.4105 + z-index: 1;
1.4106 +}
1.4107 +
1.4108 +.toolbarbutton-badge[badge]:not([badge=""]):-moz-window-inactive {
1.4109 + background-color: rgb(230,230,230);
1.4110 + box-shadow: none;
1.4111 + border: 1px solid rgb(206,206,206);
1.4112 + color: rgb(192,192,192);
1.4113 +}
1.4114 +
1.4115 +.toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl) {
1.4116 + left: 0;
1.4117 + right: auto;
1.4118 +}
1.4119 +
1.4120 +toolbar[mode="icons"] > *|* > .toolbarbutton-badge[badge]:not([badge=""]) {
1.4121 + right: -2px;
1.4122 +}
1.4123 +
1.4124 +toolbar[mode="icons"] > *|* > .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl) {
1.4125 + left: -2px;
1.4126 +}
1.4127 +
1.4128 +.popup-notification-icon[popupid="servicesInstall"] {
1.4129 + list-style-image: url(chrome://browser/skin/social/services-64.png);
1.4130 +}
1.4131 +#servicesInstall-notification-icon {
1.4132 + list-style-image: url(chrome://browser/skin/social/services-16.png);
1.4133 +}
1.4134 +
1.4135 +@media (min-resolution: 2dppx) {
1.4136 + .popup-notification-icon[popupid="servicesInstall"] {
1.4137 + list-style-image: url(chrome://browser/skin/social/services-64@2x.png);
1.4138 + }
1.4139 + #servicesInstall-notification-icon {
1.4140 + list-style-image: url(chrome://browser/skin/social/services-16@2x.png);
1.4141 + }
1.4142 +}
1.4143 +
1.4144 +#social-undoactivation-button {
1.4145 + -moz-margin-start: 0; /* override default label margin to match description margin */
1.4146 +}
1.4147 +
1.4148 +.social-activation-icon {
1.4149 + width: auto;
1.4150 + height: auto;
1.4151 + max-height: 64px;
1.4152 + max-width: 64px;
1.4153 +}
1.4154 +
1.4155 +#social-activation-message {
1.4156 + max-width: 250px;
1.4157 +}
1.4158 +
1.4159 +#social-activation-message > label {
1.4160 + margin: 0;
1.4161 +}
1.4162 +
1.4163 +#social-activation-button {
1.4164 + @hudButton@
1.4165 + min-height: 0px;
1.4166 +}
1.4167 +
1.4168 +#social-activation-button:focus {
1.4169 + @hudButtonFocused@
1.4170 +}
1.4171 +
1.4172 +#social-activation-button:hover:active {
1.4173 + @hudButtonPressed@
1.4174 +}
1.4175 +
1.4176 +/* === end of social toolbar button === */
1.4177 +
1.4178 +/* === social toolbar provider menu === */
1.4179 +
1.4180 +.social-statusarea-user {
1.4181 + list-style-image:url("chrome://global/skin/icons/information-32.png");
1.4182 +}
1.4183 +
1.4184 +.social-statusarea-user-portrait {
1.4185 + width: 32px;
1.4186 + height: 32px;
1.4187 + margin: 4px;
1.4188 + -moz-margin-start: 0;
1.4189 +}
1.4190 +
1.4191 +.social-panel > .panel-arrowcontainer > .panel-arrowcontent {
1.4192 + padding: 0;
1.4193 +}
1.4194 +
1.4195 +/* fixup rounded corners for osx panels */
1.4196 +.social-panel > .social-panel-frame {
1.4197 + border-radius: inherit;
1.4198 +}
1.4199 +
1.4200 +#social-share-panel {
1.4201 + max-height: 600px;
1.4202 + min-height: 100px;
1.4203 + max-width: 800px;
1.4204 + min-width: 300px;
1.4205 +}
1.4206 +
1.4207 +.social-share-frame:-moz-locale-dir(ltr) {
1.4208 + border-top-left-radius: 0;
1.4209 + border-bottom-left-radius: 0;
1.4210 + border-top-right-radius: inherit;
1.4211 + border-bottom-right-radius: inherit;
1.4212 +}
1.4213 +
1.4214 +.social-share-frame:-moz-locale-dir(rtl) {
1.4215 + border-top-left-radius: inherit;
1.4216 + border-bottom-left-radius: inherit;
1.4217 + border-top-right-radius: 0;
1.4218 + border-bottom-right-radius: 0;
1.4219 +}
1.4220 +
1.4221 +#social-share-panel > .social-share-toolbar:-moz-locale-dir(ltr) {
1.4222 + border-top-left-radius: inherit;
1.4223 + border-bottom-left-radius: inherit;
1.4224 +}
1.4225 +
1.4226 +#social-share-panel > .social-share-toolbar:-moz-locale-dir(rtl) {
1.4227 + border-top-right-radius: inherit;
1.4228 + border-bottom-right-radius: inherit;
1.4229 +}
1.4230 +
1.4231 +#social-share-provider-buttons:-moz-locale-dir(ltr) {
1.4232 + border-top-left-radius: inherit;
1.4233 + border-bottom-left-radius: inherit;
1.4234 +}
1.4235 +
1.4236 +#social-share-provider-buttons:-moz-locale-dir(rtl) {
1.4237 + border-top-right-radius: inherit;
1.4238 + border-bottom-right-radius: inherit;
1.4239 +}
1.4240 +
1.4241 +/* === end of social toolbar provider menu === */
1.4242 +
1.4243 +%include ../shared/social/chat.inc.css
1.4244 +
1.4245 +.chat-titlebar {
1.4246 + background-color: #d9d9d9;
1.4247 + background-image: linear-gradient(rgba(255,255,255,.43), rgba(255,255,255,0));
1.4248 +}
1.4249 +
1.4250 +.chat-titlebar[selected] {
1.4251 + background-color: #f0f0f0;
1.4252 +}
1.4253 +
1.4254 +.chatbar-button {
1.4255 + background-color: #d9d9d9;
1.4256 + background-image: linear-gradient(rgba(255,255,255,.43), rgba(255,255,255,0));
1.4257 + border-top-left-radius: @toolbarbuttonCornerRadius@;
1.4258 + border-top-right-radius: @toolbarbuttonCornerRadius@;
1.4259 +}
1.4260 +
1.4261 +.chatbar-button:hover,
1.4262 +.chatbar-button[open="true"] {
1.4263 + background-color: #f0f0f0;
1.4264 +}
1.4265 +
1.4266 +.chatbar-button[activity]:not([open]) {
1.4267 + background-image: radial-gradient(circle farthest-corner at center 2px, rgb(254,254,255) 3%, rgba(210,235,255,0.9) 12%, rgba(148,205,253,0.6) 30%, rgba(148,205,253,0.2) 70%);
1.4268 +}
1.4269 +
1.4270 +chatbox {
1.4271 + border-top-left-radius: @toolbarbuttonCornerRadius@;
1.4272 + border-top-right-radius: @toolbarbuttonCornerRadius@;
1.4273 +}
1.4274 +
1.4275 +window > chatbox {
1.4276 + border-top-left-radius: @toolbarbuttonCornerRadius@;
1.4277 + border-top-right-radius: @toolbarbuttonCornerRadius@;
1.4278 + border-bottom-left-radius: @toolbarbuttonCornerRadius@;
1.4279 + border-bottom-right-radius: @toolbarbuttonCornerRadius@;
1.4280 +}
1.4281 +
1.4282 +/* Customization mode */
1.4283 +
1.4284 +%include ../shared/customizableui/customizeMode.inc.css
1.4285 +
1.4286 +#main-window[customizing] {
1.4287 + background-color: rgb(178,178,178);
1.4288 +}
1.4289 +
1.4290 +#main-window[tabsintitlebar][customize-entered] > #titlebar,
1.4291 +#main-window[privatebrowsingmode=temporary]:not([tabsintitlebar])[customize-entered] > #titlebar,
1.4292 +#main-window[customize-entered] > #tab-view-deck {
1.4293 + background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png"),
1.4294 + url("chrome://browser/skin/customizableui/background-noise-toolbar.png"),
1.4295 + linear-gradient(to bottom, rgb(233,233,233), rgb(178,178,178) 40px);
1.4296 + background-attachment: fixed;
1.4297 +}
1.4298 +
1.4299 +#main-window[customize-entered] #browser-bottombox,
1.4300 +#main-window[customize-entered] #navigator-toolbox > toolbar:not(#TabsToolbar),
1.4301 +#main-window[customize-entered] #customization-container {
1.4302 + border: 3px solid hsla(0,0%,0%,.1);
1.4303 + border-top-width: 0;
1.4304 + background-clip: padding-box;
1.4305 + background-origin: padding-box;
1.4306 + -moz-border-right-colors: hsla(0,0%,0%,.05) hsla(0,0%,0%,.1) hsla(0,0%,0%,.2);
1.4307 + -moz-border-bottom-colors: hsla(0,0%,0%,.05) hsla(0,0%,0%,.1) hsla(0,0%,0%,.2);
1.4308 + -moz-border-left-colors: hsla(0,0%,0%,.05) hsla(0,0%,0%,.1) hsla(0,0%,0%,.2);
1.4309 +}
1.4310 +
1.4311 +#main-window[customize-entered] #customization-container,
1.4312 +#main-window[customize-entered] #navigator-toolbox > toolbar:not(#TabsToolbar) {
1.4313 + border-bottom-width: 0;
1.4314 +}
1.4315 +
1.4316 +#main-window[customize-entered] #TabsToolbar {
1.4317 + background-clip: padding-box;
1.4318 + border-right: 3px solid transparent;
1.4319 + border-left: 3px solid transparent;
1.4320 +}
1.4321 +
1.4322 +@media (min-resolution: 2dppx) {
1.4323 + #customization-titlebar-visibility-button {
1.4324 + list-style-image: url("chrome://browser/skin/customizableui/customize-titleBar-toggle@2x.png");
1.4325 + -moz-image-region: rect(0, 48px, 48px, 0);
1.4326 + }
1.4327 +
1.4328 + #customization-titlebar-visibility-button[checked] {
1.4329 + -moz-image-region: rect(0, 96px, 48px, 48px);
1.4330 + }
1.4331 +
1.4332 + #customization-titlebar-visibility-button > .button-box > .button-icon {
1.4333 + width: 24px;
1.4334 + }
1.4335 +
1.4336 + .customization-tipPanel-infoBox {
1.4337 + background-image: url(chrome://browser/skin/customizableui/info-icon-customizeTip@2x.png);
1.4338 + background-size: 25px 25px;
1.4339 + }
1.4340 +
1.4341 + .customization-tipPanel-contentImage {
1.4342 + list-style-image: url(chrome://browser/skin/customizableui/customize-illustration@2x.png);
1.4343 + }
1.4344 +
1.4345 + .customization-tipPanel-contentImage:-moz-locale-dir(rtl) {
1.4346 + list-style-image: url(chrome://browser/skin/customizableui/customize-illustration-rtl@2x.png);
1.4347 + }
1.4348 +
1.4349 + #customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="left"],
1.4350 + #customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="right"] {
1.4351 + list-style-image: url("chrome://browser/skin/customizableui/panelarrow-customizeTip@2x.png");
1.4352 + }
1.4353 +}
1.4354 +
1.4355 +/* End customization mode */
1.4356 +
1.4357 +.private-browsing-indicator {
1.4358 + background-image: url("chrome://browser/skin/privatebrowsing-mask.png");
1.4359 + background-repeat: no-repeat;
1.4360 + background-size: 100% auto;
1.4361 + width: 38px;
1.4362 + height: 28px;
1.4363 + /**
1.4364 + * The private browsing mask graphic has a 3px flare at the top. The distance
1.4365 + * we want between the mask and items on either side is 7px, so we use 4px,
1.4366 + * since the other 3px is accounted for by the empty space on either side.
1.4367 + */
1.4368 + margin-left: 4px;
1.4369 + margin-right: 4px;
1.4370 +}
1.4371 +
1.4372 +#titlebar-secondary-buttonbox > .private-browsing-indicator {
1.4373 + position: relative;
1.4374 +}
1.4375 +
1.4376 +#main-window[privatebrowsingmode=temporary]:not([tabsintitlebar]) > #titlebar > #titlebar-content > #titlebar-secondary-buttonbox > .private-browsing-indicator {
1.4377 + background-image: url("chrome://browser/skin/privatebrowsing-mask-short.png");
1.4378 + height: 20px;
1.4379 +}
1.4380 +
1.4381 +#main-window:not([privatebrowsingmode=temporary]) .private-browsing-indicator,
1.4382 +#main-window[privatebrowsingmode=temporary][inFullscreen] > #titlebar > #titlebar-content > #titlebar-secondary-buttonbox > .private-browsing-indicator,
1.4383 +#main-window[privatebrowsingmode=temporary]:not([inFullscreen]) > #tab-view-deck > #browser-panel > #navigator-toolbox > #TabsToolbar > .private-browsing-indicator {
1.4384 + display: none;
1.4385 +}
1.4386 +
1.4387 +@media (min-resolution: 2dppx) {
1.4388 + .private-browsing-indicator {
1.4389 + background-image: url("chrome://browser/skin/privatebrowsing-mask@2x.png");
1.4390 + }
1.4391 + #main-window[privatebrowsingmode=temporary]:not([tabsintitlebar]) > #titlebar > #titlebar-content > #titlebar-secondary-buttonbox > .private-browsing-indicator {
1.4392 + background-image: url("chrome://browser/skin/privatebrowsing-mask-short@2x.png");
1.4393 + }
1.4394 +}
1.4395 +
1.4396 +@media (-moz-mac-lion-theme) {
1.4397 + #TabsToolbar > .private-browsing-indicator {
1.4398 + transform: translateY(-@spaceAboveTabbar@);
1.4399 + /* We offset by 38px for mask graphic, plus 4px to account for the
1.4400 + * margin-left, which sums to 42px.
1.4401 + */
1.4402 + margin-right: -42px;
1.4403 + }
1.4404 +
1.4405 + #main-window[privatebrowsingmode=temporary] .titlebar-placeholder[type="fullscreen-button"],
1.4406 + #main-window[privatebrowsingmode=temporary] > #titlebar > #titlebar-content > #titlebar-secondary-buttonbox > #titlebar-fullscreen-button {
1.4407 + margin-left: 0px;
1.4408 + }
1.4409 +
1.4410 + #main-window[privatebrowsingmode=temporary][inFullscreen] .titlebar-placeholder[type="fullscreen-button"] {
1.4411 + /* Override display:none for .titlebar-placeholder in fullscreen so we can have consistent
1.4412 + position and padding for the private browsing indicator. */
1.4413 + display: -moz-box;
1.4414 + }
1.4415 +}
1.4416 +
1.4417 +#TabsToolbar > .private-browsing-indicator:-moz-locale-dir(rtl) {
1.4418 + -moz-box-ordinal-group: 0;
1.4419 +}
1.4420 +
1.4421 +%include ../shared/UITour.inc.css
1.4422 +
1.4423 +#UITourTooltipDescription {
1.4424 + font-size: 1.18rem;
1.4425 + line-height: 2rem;
1.4426 +}
1.4427 +
1.4428 +#UITourTooltipClose {
1.4429 + -moz-margin-end: -10px;
1.4430 + margin-top: -14px;
1.4431 +}
1.4432 +
1.4433 +@media (min-resolution: 2dppx) {
1.4434 + #UITourTooltipClose > .toolbarbutton-icon {
1.4435 + width: 16px;
1.4436 + }
1.4437 +}
