The Tor Browser / file comparison
comparison: browser/metro/theme/content.css
browser/metro/theme/content.css
- changeset 2
- 7e26c7da4463
equal
deleted
inserted
replaced
| -1:000000000000 | 0:a3e5b0a33a39 |
|---|---|
| 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 %filter substitution | |
| 6 %include defines.inc | |
| 7 | |
| 8 @namespace url("http://www.w3.org/1999/xhtml"); | |
| 9 @namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); | |
| 10 | |
| 11 /* Typography & General Styling -------------------------------------------- */ | |
| 12 | |
| 13 ::-moz-selection { | |
| 14 color: white; | |
| 15 background-color: @metro_orange@; | |
| 16 } | |
| 17 | |
| 18 *:-moz-any-link:focus { | |
| 19 outline-offset: -2px; | |
| 20 } | |
| 21 | |
| 22 /* Input Styling -------------------------------------------- */ | |
| 23 | |
| 24 select:not([size]):not([multiple]) > xul|scrollbar, | |
| 25 select[size="1"] > xul|scrollbar, | |
| 26 select:not([size]):not([multiple]) xul|scrollbarbutton, | |
| 27 select[size="1"] xul|scrollbarbutton { | |
| 28 display: block; | |
| 29 margin-left: 0; | |
| 30 min-width: 16px; | |
| 31 } | |
| 32 | |
| 33 select[size], | |
| 34 select[multiple], | |
| 35 select[size][multiple], | |
| 36 * > input:not([type="image"]) { | |
| 37 border-style: solid; | |
| 38 border-color: #7d7d7d; | |
| 39 color: #414141; | |
| 40 } | |
| 41 | |
| 42 /* For both mouse and touch, single-selects are handled by the SelectHelper popup. | |
| 43 * Suppress mouse events on the popup itself. See also ../base/content/cursor.css */ | |
| 44 select[size="1"] :-moz-any(option, optgroup), | |
| 45 select:not([size]):not([multiple]) :-moz-any(option, optgroup) { | |
| 46 pointer-events: none; | |
| 47 } | |
| 48 | |
| 49 input:-moz-placeholder { | |
| 50 color: GrayText; | |
| 51 } | |
| 52 | |
| 53 select:not([size]):not([multiple]), | |
| 54 select[size="0"], | |
| 55 select[size="1"], | |
| 56 * > input[type="button"], | |
| 57 * > input[type="submit"], | |
| 58 * > input[type="reset"], | |
| 59 button { | |
| 60 border-style: solid; | |
| 61 border-color: #7d7d7d; | |
| 62 color: #414141; | |
| 63 } | |
| 64 | |
| 65 input[type="checkbox"] { | |
| 66 background: white linear-gradient(rgba(115,115,115,0.5) 0, rgba(215,215,215,0.5) 2px, rgba(255,255,255,0.2) 6px); | |
| 67 } | |
| 68 | |
| 69 input[type="radio"] { | |
| 70 background: radial-gradient(at 6px 6px, rgba(255,255,255,0.2) 3px, rgba(195,195,195,0.5) 5px, rgba(115,115,115,0.5) 100%); | |
| 71 } | |
| 72 | |
| 73 select { | |
| 74 border-width: 1px; | |
| 75 padding: 1px; | |
| 76 } | |
| 77 | |
| 78 select:not([size]):not([multiple]), | |
| 79 select[size="0"], | |
| 80 select[size="1"] { | |
| 81 padding: 0 1px 0 1px; | |
| 82 } | |
| 83 | |
| 84 * > input:not([type="image"]) { | |
| 85 border-width: 1px; | |
| 86 padding: 1px; | |
| 87 } | |
| 88 | |
| 89 input[type="button"], | |
| 90 input[type="submit"], | |
| 91 input[type="reset"], | |
| 92 button { | |
| 93 border-width: 1px; | |
| 94 padding: 0 7px 0 7px; | |
| 95 } | |
| 96 | |
| 97 input[type="radio"], | |
| 98 input[type="checkbox"] { | |
| 99 max-width: 14px; | |
| 100 max-height: 14px; | |
| 101 border: 1px solid #a7a7a7 !important; | |
| 102 padding: 2px 1px 2px 1px; | |
| 103 } | |
| 104 | |
| 105 select > button { | |
| 106 border-width: 1px !important; | |
| 107 margin: 0px !important; | |
| 108 padding: 0px !important; | |
| 109 border-radius: 0; | |
| 110 color: #414141; | |
| 111 position: relative !important; | |
| 112 font-size: inherit; | |
| 113 } | |
| 114 | |
| 115 input[type="checkbox"]:focus, | |
| 116 input[type="radio"]:focus { | |
| 117 border-color: #99c6e0 !important; | |
| 118 } | |
| 119 | |
| 120 input[type="checkbox"]:focus { | |
| 121 background: white linear-gradient(rgba(27,113,177,0.5) 0, rgba(198,225,246,0.2) 2px, rgba(255,255,255,0.2) 6px); | |
| 122 } | |
| 123 | |
| 124 input[type="radio"]:focus { | |
| 125 background: radial-gradient(at 6px 6px, rgba(255,255,255,0.2) 3px, rgba(198,225,246,0.2) 5px, rgba(27,113,177,0.5) 100%); | |
| 126 } | |
| 127 | |
| 128 /* we need to be specific for selects because the above rules are specific too */ | |
| 129 select[size][disabled], | |
| 130 select[multiple][disabled], | |
| 131 select[size][multiple][disabled], | |
| 132 select:not([size]):not([multiple])[disabled], | |
| 133 select[size="0"][disabled], | |
| 134 select[size="1"][disabled], | |
| 135 button[disabled], | |
| 136 * > input:not([type="image"])[disabled] { | |
| 137 color: rgba(0,0,0,0.3); | |
| 138 border-color: rgba(125,125,125,0.4); | |
| 139 border-style: solid; | |
| 140 border-width: 1px; | |
| 141 background: transparent linear-gradient(rgba(185,185,185,0.4) 0, rgba(235,235,235,0.4) 3px, rgba(255,255,255,0.4) 100%); | |
| 142 } | |
| 143 | |
| 144 select:not([size]):not([multiple])[disabled], | |
| 145 select[size="0"][disabled], | |
| 146 select[size="1"][disabled] { | |
| 147 background: transparent linear-gradient(rgba(255,255,255,0.4) 0, rgba(235,235,235,0.4) 3px, rgba(185,185,185,0.4) 100%); | |
| 148 } | |
| 149 | |
| 150 input[type="button"][disabled], | |
| 151 input[type="submit"][disabled], | |
| 152 input[type="reset"][disabled], | |
| 153 button[disabled] { | |
| 154 padding: 0 7px 0 7px; | |
| 155 background: transparent linear-gradient(rgba(255,255,255,0.4) 0, rgba(235,235,235,0.4) 3px, rgba(185,185,185,0.4) 100%); | |
| 156 } | |
| 157 | |
| 158 input[type="radio"][disabled], | |
| 159 input[type="radio"][disabled]:active, | |
| 160 input[type="radio"][disabled]:hover, | |
| 161 input[type="radio"][disabled]:hover:active, | |
| 162 input[type="checkbox"][disabled], | |
| 163 input[type="checkbox"][disabled]:active, | |
| 164 input[type="checkbox"][disabled]:hover, | |
| 165 input[type="checkbox"][disabled]:hover:active { | |
| 166 border:1px solid rgba(125,125,125,0.4) !important; | |
| 167 } | |
| 168 | |
| 169 select[disabled] > button { | |
| 170 opacity: 0.6; | |
| 171 padding: 1px 7px 1px 7px; | |
| 172 } | |
| 173 | |
| 174 /* -moz-touch-enabled? media elements */ | |
| 175 video > xul|videocontrols, | |
| 176 audio > xul|videocontrols { | |
| 177 -moz-binding: url("chrome://global/content/bindings/videocontrols.xml#touchControls"); | |
| 178 } | |
| 179 | |
| 180 /* | |
| 181 * Enforce nearest scaling for video in order not to lose too much performance | |
| 182 * after fixing bug 598736 ("Use higher-quality imageinterpolation on mobile") | |
| 183 */ | |
| 184 video { | |
| 185 image-rendering: -moz-crisp-edges; | |
| 186 } |
