LCARStrek/global/scrollbars.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 /* ===== scrollbars.css =================================================
   6   == Styles used by XUL scrollbar-related elements.
   7   ======================================================================= */
   8
   9 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
  10 @namespace html url("http://www.w3.org/1999/xhtml"); /* namespace for HTML elements */
  11
  12 /* ::::: scrollbar ::::: */
  13
  14 scrollbar {
  15   -moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar");
  16   cursor: default;
  17   background-color: #000000;
  18   border-radius: 50%;
  19   pointer-events: auto;
  20 }
  21
  22 @media all and (-moz-overlay-scrollbars) {
  23   scrollbar[root="true"] {
  24     position: relative;
  25     z-index: 2147483647; /* largest positive value of a signed 32-bit integer */
  26   }
  27
  28   scrollbar:not([active="true"]),
  29   scrollbar[disabled="true"] {
  30     visibility: hidden;
  31   }
  32 }
  33
  34 /* ::::: slider ::::: */
  35
  36 slider {
  37   height: 13px;
  38   background-color: #404048; /* #202024;*/
  39 }
  40
  41 slider[orient="vertical"] {
  42   width: 13px;
  43 }
  44
  45 /* ::::: borders for thumb and buttons ::::: */
  46
  47 thumb,
  48 scrollbarbutton {
  49   border: none;
  50   background: transparent 50% 50% no-repeat;
  51   padding: 1px;
  52   min-width: 13px;
  53   min-height: 13px;
  54 }
  55
  56 scrollbar:not([orient="vertical"]) > scrollbarbutton {
  57   min-width: 16px;
  58 }
  59
  60 scrollbar[orient="vertical"] > scrollbarbutton {
  61   min-height: 16px;
  62 }
  63
  64
  65 /* ::::: thumb ::::: */
  66
  67 thumb {
  68   background-color: #A09090;
  69   background-image: url("chrome://global/skin/scrollbar/thumb-vert-grip.gif");
  70 }
  71
  72 thumb[orient="horizontal"] {
  73   background-image: url("chrome://global/skin/scrollbar/thumb-horiz-grip.gif");
  74 }
  75
  76
  77 thumb:active,
  78 thumb:hover:active {
  79    background-color: #008484;
  80 }
  81
  82 thumb:hover {
  83    background-color: #FFCF00;
  84 }
  85
  86 thumb[disabled="true"] {
  87   background-image: url("chrome://global/skin/scrollbar/thumb-vert-grip-disabled.gif");
  88 }
  89
  90 thumb[orient="horizontal"][disabled="true"] {
  91   background-image: url("chrome://global/skin/scrollbar/thumb-horiz-grip-disabled.gif");
  92 }
  93
  94 /* keep clickthrough scrollbars in e.g. devtoools with a simpler thumb */
  95 scrollbar[clickthrough="always"] > slider > thumb {
  96   background-image: none;
  97 }
  98
  99 /* ::::: scrollbar button ::::: */
 100
 101 scrollbarbutton {
 102   background-color: #C09070;
 103 }
 104
 105 scrollbarbutton:hover:active,
 106 scrollbarbutton[active="true"] {
 107   background-position: calc(50% + 1px) calc(50% + 1px);
 108 }
 109
 110 scrollbarbutton:hover {
 111   background-color: #FFCF00;
 112 }
 113
 114 scrollbarbutton:hover:active {
 115   background-color: #FF9F00;
 116 }
 117
 118 scrollbarbutton[disabled="true"] {
 119   background-color: #402858 !important;
 120 }
 121
 122 /* XXX - scrollbar.xml always grabs the OS settings and we don't want that (but keep clickthrough scrollbars in e.g. devtoools working) */
 123 scrollbarbutton[sbattr="scrollbar-up-bottom"],
 124 scrollbarbutton[sbattr="scrollbar-down-top"] {
 125   display: none;
 126 }
 127 scrollbar:not([clickthrough="always"]) > scrollbarbutton[sbattr="scrollbar-up-top"],
 128 scrollbar:not([clickthrough="always"]) > scrollbarbutton[sbattr="scrollbar-down-bottom"] {
 129   display: -moz-box !important;
 130 }
 131
 132 /* ::::: square at the corner of two scrollbars ::::: */
 133
 134 scrollcorner {
 135   -moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar-base");
 136   cursor: default;
 137   background-color: #000000;
 138   width: 13px;
 139 }
 140
 141 /* ..... increment .... */
 142
 143 scrollbarbutton[type="increment"] {
 144   background-image: url("chrome://global/skin/scrollbar/arrow-right.png");
 145   border-radius: 0 300px 300px 0;
 146   border-inline-start: 3px solid #000000;
 147 }
 148
 149 scrollbar[orient="vertical"] > scrollbarbutton[type="increment"] {
 150   background-image: url("chrome://global/skin/scrollbar/arrow-down.png");
 151   border-radius: 0 0 300px 300px;
 152   border-inline-start: none;
 153   border-top: 3px solid #000000;
 154 }
 155
 156 /* ..... decrement .... */
 157
 158 scrollbarbutton[type="decrement"] {
 159   background-image: url("chrome://global/skin/scrollbar/arrow-left.png");
 160   border-radius: 300px 0 0 300px;
 161   border-inline-end: 3px solid #000000;
 162 }
 163
 164 scrollbar[orient="vertical"] > scrollbarbutton[type="decrement"] {
 165   background-image: url("chrome://global/skin/scrollbar/arrow-up.png");
 166   border-radius: 300px 300px 0 0;
 167   border-inline-end: none;
 168   border-bottom: 3px solid #000000;
 169 }
 170
 171 /* :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
 172 /* ::::::::::::::::::::: MEDIA PRINT :::::::::::::::::::::: */
 173 /* :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
 174 @media print {
 175   /* ::::: scrollbar ::::: */
 176
 177   html|div scrollbar {
 178     -moz-appearance: scrollbartrack-horizontal;
 179     -moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar");
 180     cursor: default;
 181     background: url("chrome://global/skin/scrollbar/slider.gif") scrollbar;
 182   }
 183
 184   html|div scrollbar[orient="vertical"]
 185   {
 186      -moz-appearance: scrollbartrack-vertical;
 187   }
 188
 189   /* ::::: borders for thumb and buttons ::::: */
 190
 191   html|div thumb,
 192   html|div scrollbarbutton {
 193     border: 2px solid;
 194     -moz-border-top-colors: ThreeDLightShadow ThreeDHighlight;
 195     -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow;
 196     -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow;
 197     -moz-border-left-colors: ThreeDLightShadow ThreeDHighlight;
 198     background-color: -moz-Dialog;
 199   }
 200
 201   /* ::::: thumb (horizontal) ::::: */
 202
 203   html|div thumb {
 204     -moz-appearance: scrollbarthumb-vertical;
 205     min-height: 8px;
 206   }
 207
 208   html|div thumb[orient="horizontal"] {
 209     -moz-appearance: scrollbarthumb-horizontal;
 210     min-width: 8px;
 211   }
 212
 213   /* ::::: scrollbar button ::::: */
 214
 215   html|div scrollbarbutton {
 216     background: -moz-Dialog no-repeat 50% 50%;
 217     min-width: 16px;
 218     min-height: 16px;
 219   }
 220
 221   html|div scrollbarbutton:hover:active,
 222   html|div scrollbarbutton[active="true"] {
 223     -moz-border-top-colors: ThreeDShadow -moz-Dialog;
 224     -moz-border-right-colors: ThreeDShadow -moz-Dialog;
 225     -moz-border-bottom-colors: ThreeDShadow -moz-Dialog;
 226     -moz-border-left-colors: ThreeDShadow -moz-Dialog;
 227     background-position: 60% 60%;
 228   }
 229
 230   /* ..... increment .... */
 231
 232   html|div scrollbarbutton[type="increment"] {
 233     -moz-appearance: scrollbarbutton-right;
 234     background-image: url("chrome://global/skin/scrollbar/arrow-right.png")
 235   }
 236
 237   html|div scrollbar[orient="vertical"] > scrollbarbutton[type="increment"] {
 238     -moz-appearance: scrollbarbutton-down;
 239     background-image: url("chrome://global/skin/scrollbar/arrow-down.png")
 240   }
 241
 242   /* ..... decrement .... */
 243
 244   html|div scrollbarbutton[type="decrement"] {
 245     -moz-appearance: scrollbarbutton-left;
 246      background-image: url("chrome://global/skin/scrollbar/arrow-left.png")
 247   }
 248
 249   html|div scrollbar[orient="vertical"] > scrollbarbutton[type="decrement"] {
 250     -moz-appearance: scrollbarbutton-up;
 251      background-image: url("chrome://global/skin/scrollbar/arrow-up.png")
 252   }
 253
 254 }