browser/themes/osx/devedition.css

   1 % This Source Code Form is subject to the terms of the Mozilla Public
   2 % License, v. 2.0. If a copy of the MPL was not distributed with this
   3 % file, You can obtain one at http://mozilla.org/MPL/2.0/.
   4
   5 %include ../shared/devedition.inc.css
   6
   7 /* Use forward-facing magnifying glasses for the search box */
   8 :root[devtoolstheme="dark"] {
   9   --search-button-image: url("chrome://browser/skin/devedition/search.svg#search-icon-mac-inverted");
  10 }
  11 :root[devtoolstheme="light"] {
  12   --search-button-image: url("chrome://browser/skin/devedition/search.svg#search-icon-mac");
  13 }
  14
  15 /* Use only 1px separator between nav toolbox and page content */
  16 #navigator-toolbox::after {
  17   background: linear-gradient(to top, var(--chrome-navigator-toolbox-separator-color), var(--chrome-navigator-toolbox-separator-color) 1px, transparent 1px);
  18 }
  19
  20 /* Include extra space on left/right for dragging since there is no space above
  21    the tabs */
  22 #main-window[tabsintitlebar] #TabsToolbar {
  23   padding-left: 50px;
  24   padding-right: 50px;
  25   margin-bottom: 0; /* Don't overlap the inner highlight at the top of the nav-bar */
  26 }
  27
  28 /* Get rid of 1px bright strip at the top of window */
  29 #main-window[tabsintitlebar] #titlebar-content {
  30   background: var(--chrome-background-color);
  31 }
  32
  33 /* Resize things so that the native titlebar is in line with the tabs */
  34 #main-window[tabsintitlebar] > #titlebar > #titlebar-content > #titlebar-buttonbox-container,
  35 #main-window[tabsintitlebar] > #titlebar > #titlebar-content > #titlebar-secondary-buttonbox > #titlebar-fullscreen-button {
  36   margin-top: 6px;
  37 }
  38
  39 /* Square back and forward buttons.  Need !important on these because there
  40    are a lot of more specific selectors sprinkled around elsewhere for changing
  41    background / shadows for different states */
  42 #back-button,
  43 #forward-button {
  44   height: 22px !important;
  45   box-shadow: none !important;
  46   border: none !important;
  47   background: var(--chrome-nav-buttons-background) !important;
  48 }
  49
  50 #back-button:hover:not([disabled="true"]),
  51 #forward-button:hover:not([disabled="true"]) {
  52   background: var(--chrome-nav-buttons-hover-background) !important;
  53 }
  54
  55 #back-button {
  56   border-radius: 3px 0 0 3px !important;
  57   padding: 0 !important;
  58   margin: 0 !important;
  59 }
  60
  61 #back-button:hover:active:not([disabled="true"]) {
  62   -moz-image-region: rect(18px, 54px, 36px, 36px);
  63 }
  64
  65 /* Use smaller back button icon */
  66 @media (min-resolution: 2dppx) {
  67   #back-button {
  68     -moz-image-region: rect(0, 108px, 36px, 72px);
  69   }
  70
  71   #back-button:hover:active:not([disabled="true"]) {
  72     -moz-image-region: rect(36px, 108px, 72px, 72px);
  73   }
  74 }
  75
  76 #forward-button:hover:active:not(:-moz-lwtheme) {
  77   background-image: none;
  78   box-shadow: none;
  79 }
  80
  81 /* Don't use the default background for tabs toolbar */
  82 #TabsToolbar {
  83   -moz-appearance: none !important;
  84 }
  85
  86 /* Tab styling - make sure to use an inverted icon for the selected tab
  87    (brighttext only covers the unselected tabs) */
  88 .tab-close-button[selected=true]:not(:hover) {
  89   -moz-image-region: rect(0, 64px, 16px, 48px);
  90 }
  91 @media (min-resolution: 2dppx) {
  92   .tab-close-button[selected=true]:not(:hover) {
  93     -moz-image-region: rect(0, 128px, 32px, 96px);
  94   }
  95 }