1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/browser/metro/theme/content.css Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,186 @@
1.4 +/* This Source Code Form is subject to the terms of the Mozilla Public
1.5 + * License, v. 2.0. If a copy of the MPL was not distributed with this
1.6 + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
1.7 +
1.8 +%filter substitution
1.9 +%include defines.inc
1.10 +
1.11 +@namespace url("http://www.w3.org/1999/xhtml");
1.12 +@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
1.13 +
1.14 +/* Typography & General Styling -------------------------------------------- */
1.15 +
1.16 +::-moz-selection {
1.17 + color: white;
1.18 + background-color: @metro_orange@;
1.19 +}
1.20 +
1.21 +*:-moz-any-link:focus {
1.22 + outline-offset: -2px;
1.23 +}
1.24 +
1.25 +/* Input Styling -------------------------------------------- */
1.26 +
1.27 +select:not([size]):not([multiple]) > xul|scrollbar,
1.28 +select[size="1"] > xul|scrollbar,
1.29 +select:not([size]):not([multiple]) xul|scrollbarbutton,
1.30 +select[size="1"] xul|scrollbarbutton {
1.31 + display: block;
1.32 + margin-left: 0;
1.33 + min-width: 16px;
1.34 +}
1.35 +
1.36 +select[size],
1.37 +select[multiple],
1.38 +select[size][multiple],
1.39 +* > input:not([type="image"]) {
1.40 + border-style: solid;
1.41 + border-color: #7d7d7d;
1.42 + color: #414141;
1.43 +}
1.44 +
1.45 +/* For both mouse and touch, single-selects are handled by the SelectHelper popup.
1.46 + * Suppress mouse events on the popup itself. See also ../base/content/cursor.css */
1.47 +select[size="1"] :-moz-any(option, optgroup),
1.48 +select:not([size]):not([multiple]) :-moz-any(option, optgroup) {
1.49 + pointer-events: none;
1.50 +}
1.51 +
1.52 +input:-moz-placeholder {
1.53 + color: GrayText;
1.54 +}
1.55 +
1.56 +select:not([size]):not([multiple]),
1.57 +select[size="0"],
1.58 +select[size="1"],
1.59 +* > input[type="button"],
1.60 +* > input[type="submit"],
1.61 +* > input[type="reset"],
1.62 +button {
1.63 + border-style: solid;
1.64 + border-color: #7d7d7d;
1.65 + color: #414141;
1.66 +}
1.67 +
1.68 +input[type="checkbox"] {
1.69 + 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);
1.70 +}
1.71 +
1.72 +input[type="radio"] {
1.73 + 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%);
1.74 +}
1.75 +
1.76 +select {
1.77 + border-width: 1px;
1.78 + padding: 1px;
1.79 +}
1.80 +
1.81 +select:not([size]):not([multiple]),
1.82 +select[size="0"],
1.83 +select[size="1"] {
1.84 + padding: 0 1px 0 1px;
1.85 +}
1.86 +
1.87 +* > input:not([type="image"]) {
1.88 + border-width: 1px;
1.89 + padding: 1px;
1.90 +}
1.91 +
1.92 +input[type="button"],
1.93 +input[type="submit"],
1.94 +input[type="reset"],
1.95 +button {
1.96 + border-width: 1px;
1.97 + padding: 0 7px 0 7px;
1.98 +}
1.99 +
1.100 +input[type="radio"],
1.101 +input[type="checkbox"] {
1.102 + max-width: 14px;
1.103 + max-height: 14px;
1.104 + border: 1px solid #a7a7a7 !important;
1.105 + padding: 2px 1px 2px 1px;
1.106 +}
1.107 +
1.108 +select > button {
1.109 + border-width: 1px !important;
1.110 + margin: 0px !important;
1.111 + padding: 0px !important;
1.112 + border-radius: 0;
1.113 + color: #414141;
1.114 + position: relative !important;
1.115 + font-size: inherit;
1.116 +}
1.117 +
1.118 +input[type="checkbox"]:focus,
1.119 +input[type="radio"]:focus {
1.120 + border-color: #99c6e0 !important;
1.121 +}
1.122 +
1.123 +input[type="checkbox"]:focus {
1.124 + 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);
1.125 +}
1.126 +
1.127 +input[type="radio"]:focus {
1.128 + 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%);
1.129 +}
1.130 +
1.131 +/* we need to be specific for selects because the above rules are specific too */
1.132 +select[size][disabled],
1.133 +select[multiple][disabled],
1.134 +select[size][multiple][disabled],
1.135 +select:not([size]):not([multiple])[disabled],
1.136 +select[size="0"][disabled],
1.137 +select[size="1"][disabled],
1.138 +button[disabled],
1.139 +* > input:not([type="image"])[disabled] {
1.140 + color: rgba(0,0,0,0.3);
1.141 + border-color: rgba(125,125,125,0.4);
1.142 + border-style: solid;
1.143 + border-width: 1px;
1.144 + 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%);
1.145 +}
1.146 +
1.147 +select:not([size]):not([multiple])[disabled],
1.148 +select[size="0"][disabled],
1.149 +select[size="1"][disabled] {
1.150 + 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%);
1.151 +}
1.152 +
1.153 +input[type="button"][disabled],
1.154 +input[type="submit"][disabled],
1.155 +input[type="reset"][disabled],
1.156 +button[disabled] {
1.157 + padding: 0 7px 0 7px;
1.158 + 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%);
1.159 +}
1.160 +
1.161 +input[type="radio"][disabled],
1.162 +input[type="radio"][disabled]:active,
1.163 +input[type="radio"][disabled]:hover,
1.164 +input[type="radio"][disabled]:hover:active,
1.165 +input[type="checkbox"][disabled],
1.166 +input[type="checkbox"][disabled]:active,
1.167 +input[type="checkbox"][disabled]:hover,
1.168 +input[type="checkbox"][disabled]:hover:active {
1.169 + border:1px solid rgba(125,125,125,0.4) !important;
1.170 +}
1.171 +
1.172 +select[disabled] > button {
1.173 + opacity: 0.6;
1.174 + padding: 1px 7px 1px 7px;
1.175 +}
1.176 +
1.177 +/* -moz-touch-enabled? media elements */
1.178 +video > xul|videocontrols,
1.179 +audio > xul|videocontrols {
1.180 + -moz-binding: url("chrome://global/content/bindings/videocontrols.xml#touchControls");
1.181 +}
1.182 +
1.183 +/*
1.184 + * Enforce nearest scaling for video in order not to lose too much performance
1.185 + * after fixing bug 598736 ("Use higher-quality imageinterpolation on mobile")
1.186 + */
1.187 +video {
1.188 + image-rendering: -moz-crisp-edges;
1.189 +}
