toolkit/content/minimal-xul.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 /**
   6  * This file should only contain a minimal set of rules for the XUL elements
   7  * that may be implicitly created as part of HTML/SVG documents (e.g.
   8  * scrollbars).  Rules for everything else related to XUL can be found in
   9  * xul.css.  (This split of the XUL rules is to minimize memory use and improve
  10  * performance in HTML/SVG documents.)
  11  *
  12  * ANYTHING ADDED TO THIS FILE WILL APPLY TO ALL DOCUMENTS, INCLUDING WEB CONTENT.
  13  * IF UA RULES ARE ONLY NEEDED IN CHROME, THEY SHOULD BE ADDED TO xul.css.
  14  */
  15
  16 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
  17
  18 * {
  19   -moz-user-focus: ignore;
  20   user-select: none;
  21   display: -moz-box;
  22   box-sizing: border-box;
  23 }
  24
  25 /* hide the content and destroy the frame */
  26 [hidden="true"] {
  27   display: none;
  28 }
  29
  30 /* hide the content, but don't destroy the frames */
  31 [collapsed="true"] {
  32   visibility: collapse;
  33 }
  34
  35 /* Rules required for style caching of anonymous content scrollbar parts */
  36 @supports -moz-bool-pref("layout.css.cached-scrollbar-styles.enabled") {
  37   :is(scrollcorner, resizer, scrollbar, scrollbarbutton, slider):where(:-moz-native-anonymous) {
  38     /* All scrollbar parts must not inherit any properties from the scrollable
  39      * element (except for visibility and pointer-events), for the anonymous
  40      * content style caching system to work.
  41      */
  42     all: initial;
  43     visibility: inherit;
  44     pointer-events: inherit;
  45
  46     /* These properties are not included in 'all'. */
  47     -moz-context-properties: initial;
  48     -moz-control-character-visibility: initial;
  49     -moz-font-smoothing-background-color: initial;
  50     -moz-min-font-size-ratio: initial;
  51     -moz-box-layout: initial;
  52     math-depth: initial;
  53     /* As long as inert implies pointer-events: none as it does now, we're
  54      * good. */
  55     -moz-inert: initial;
  56
  57     /* Using initial is not sufficient for direction, since its initial value can
  58      * depend on the document's language.
  59      *
  60      * LTR is what we want for all scrollbar parts anyway, so that e.g. we don't
  61      * reverse the rendering of a horizontal scrollbar.
  62      */
  63     direction: ltr;
  64
  65     /* Similarly for font properties, whose initial values depend on the
  66      * document's language.  Scrollbar parts don't have any text or rely on
  67      * font metrics.
  68      */
  69     font: 16px sans-serif;
  70
  71     /* The initial value of justify-items is `legacy`, which makes it depend on
  72      * the parent style.
  73      *
  74      * Reset it to something else.
  75      */
  76     justify-items: start;
  77
  78     /* Avoid `object > *` rule in html.css from setting a useless, non-initial
  79      * value of vertical-align.
  80      */
  81     vertical-align: initial !important;
  82
  83     /* Duplicate the rules from the '*' rule above, which were clobbered by the
  84      * 'all: initial' declaration.
  85      *
  86      * The other zero specificity rules above are on :root, and scrollbar parts
  87      * cannot match :root, so no need to duplicate them.
  88      */
  89     -moz-user-focus: ignore;
  90     user-select: none;
  91     display: -moz-box;
  92     box-sizing: border-box;
  93   }
  94
  95   /* There are other rules that set the cursor on the scrollbar, expecting them
  96    * to inherit into its children. Explicitly inherit it, overriding the
  97    * 'all: initial;' declaration above.
  98    */
  99   :is(scrollbarbutton, slider, thumb):where(:-moz-native-anonymous) {
 100     cursor: inherit;
 101   }
 102 }
 103
 104 scrollbar[orient="vertical"],
 105 slider[orient="vertical"],
 106 thumb[orient="vertical"] {
 107   -moz-box-orient: vertical;
 108 }
 109
 110 thumb {
 111   /* Prevent -moz-user-modify declaration from designmode.css having an
 112    * effect. */
 113   -moz-user-modify: initial;
 114
 115   -moz-box-align: center;
 116   -moz-box-pack: center;
 117 }
 118
 119 /********** resizer **********/
 120
 121 resizer {
 122   position: relative;
 123   z-index: 2147483647;
 124   /* Widget gets decide on its own whether or not the native theme should apply,
 125      based on the context/OS theme. If it does not, SVG background will kick in. */
 126   appearance: auto;
 127   -moz-default-appearance: resizer;
 128
 129   /* native resizer should never flip on its own;
 130      we will flip it (or the SVG background) with CSS transform below. */
 131   direction: ltr;
 132   writing-mode: initial;
 133
 134   background: url("chrome://global/skin/icons/resizer.svg") no-repeat;
 135   background-size: 100% 100%;
 136   cursor: se-resize;
 137   width: 15px;
 138   height: 15px;
 139 }
 140
 141 /* bottomstart/bottomend is supported in XUL window only */
 142 resizer[dir="bottom"][flip],
 143 resizer[dir="bottomleft"],
 144 resizer[dir="bottomstart"]:-moz-locale-dir(ltr),
 145 resizer[dir="bottomend"]:-moz-locale-dir(rtl) {
 146   transform: scaleX(-1);
 147 }
 148
 149 resizer[dir="bottomleft"],
 150 resizer[dir="bottomstart"]:-moz-locale-dir(ltr),
 151 resizer[dir="bottomend"]:-moz-locale-dir(rtl) {
 152   cursor: sw-resize;
 153 }
 154
 155 resizer[dir="top"],
 156 resizer[dir="bottom"] {
 157   cursor: ns-resize;
 158 }
 159
 160 resizer[dir="left"] {
 161   transform: scaleX(-1);
 162 }
 163
 164 resizer[dir="left"],
 165 resizer[dir="right"] {
 166   cursor: ew-resize;
 167 }
 168
 169 resizer[dir="topleft"] {
 170   cursor: nw-resize;
 171 }
 172
 173 resizer[dir="topright"] {
 174   cursor: ne-resize;
 175 }
 176
 177 /********** scrollbar **********/
 178
 179 thumb {
 180   -moz-box-flex: 1;
 181   display: -moz-box !important;
 182 }
 183
 184 /* Don't collapse thumb when scrollbar is disabled. */
 185 thumb[collapsed="true"] {
 186   visibility: hidden;
 187 }
 188
 189 scrollbar, scrollbarbutton, scrollcorner, slider, thumb {
 190   user-select: none;
 191 }
 192
 193 scrollcorner {
 194   display: -moz-box !important;
 195 }
 196
 197 scrollcorner[hidden="true"] {
 198   display: none !important;
 199 }
 200
 201 scrollbar[value="hidden"] {
 202   visibility: hidden;
 203 }
 204
 205 @media (-moz-scrollbar-start-backward: 0) {
 206   scrollbarbutton[sbattr="scrollbar-up-top"] {
 207     display: none;
 208   }
 209 }
 210
 211 @media (-moz-scrollbar-start-forward: 0) {
 212   scrollbarbutton[sbattr="scrollbar-down-top"] {
 213     display: none;
 214   }
 215 }
 216
 217 @media (-moz-scrollbar-end-backward: 0) {
 218   scrollbarbutton[sbattr="scrollbar-up-bottom"] {
 219     display: none;
 220   }
 221 }
 222
 223 @media (-moz-scrollbar-end-forward: 0) {
 224   scrollbarbutton[sbattr="scrollbar-down-bottom"] {
 225     display: none;
 226   }
 227 }