browser/metro/theme/content.css

Wed, 31 Dec 2014 06:09:35 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 06:09:35 +0100
changeset 0
6474c204b198
permissions
-rw-r--r--

Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.

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

mercurial