mobile/android/themes/core/config.css

branch
TOR_BUG_3246
changeset 4
fc2d59ddac77
equal deleted inserted replaced
-1:000000000000 0:21004363d4c6
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 html,
6 body {
7 margin: 0;
8 padding: 0;
9 background-color: #ced7de;
10 -moz-user-select: none;
11 font-family: "Clear Sans",sans-serif;
12 -moz-text-size-adjust: none;
13 }
14
15 .toolbar {
16 width: 100%;
17 height: 3em;
18 position: fixed;
19 top: 0;
20 left: 0;
21 z-index: 10;
22 box-shadow: 0 0 3px #444;
23 background-color: #ced7de;
24 color: #000000;
25 font-weight: bold;
26 border-bottom: 2px solid;
27 -moz-border-bottom-colors: #ff9100 #f27900;
28 }
29
30 .toolbar-container {
31 max-width: 40em;
32 margin-left: auto;
33 margin-right: auto;
34 }
35
36 #filter-container {
37 margin-top: 0.5em;
38 margin-bottom: 0.5em;
39 margin-right: 0.5em;
40 height: 2em;
41 border: 1px solid transparent;
42 border-image-source: url("chrome://browser/skin/images/textfield.png");
43 border-image-slice: 1 1 3 1;
44 border-image-width: 1px 1px 3px 1px;
45 overflow: hidden;
46 display: flex;
47 flex-direction: row;
48 }
49
50 #filter-input {
51 -moz-appearance: none;
52 border: none;
53 background-image: none;
54 background-color: transparent;
55 display: inline-block;
56 width: 12em;
57 min-width: 0;
58 color: #000000;
59 opacity: 1;
60 flex: 1 1 auto;
61 }
62
63 #filter-input:-moz-placeholder {
64 color: rgba(255,255,255,0.5);
65 }
66
67 .toolbar input {
68 display: inline-block;
69 height: 100%;
70 min-width: 3em;
71 box-sizing: border-box;
72 opacity: 0.75;
73 }
74
75 #new-pref-toggle-button {
76 background-position: center center;
77 background-image: url("chrome://browser/skin/images/reader-plus-icon-xhdpi.png");
78 background-size: 48px 48px;
79 height: 48px;
80 width: 48px;
81 display: inline-block;
82 outline-style: none;
83 }
84
85 #filter-search-button {
86 background-image: url("chrome://browser/skin/images/search.png");
87 background-size: 32px 32px;
88 height: 32px;
89 width: 32px;
90 display: inline-block;
91 outline-style: none;
92 }
93
94 #filter-input-clear-button {
95 background-image: url("chrome://browser/skin/images/search-clear-30.png");
96 background-size: 32px 32px;
97 height: 32px;
98 width: 32px;
99 display: inline-block;
100 outline-style: none;
101 }
102
103 #filter-input[value=""] + #filter-input-clear-button {
104 display: none;
105 }
106
107 .toolbar-item {
108 display: inline-block;
109 height: 3em;
110 min-width: 3em;
111 float: right;
112 }
113
114 #content {
115 position: relative;
116 margin: 0;
117 margin-left: auto;
118 margin-right: auto;
119 padding-top: 3em;
120 padding-left: 0;
121 padding-right: 0;
122 min-height: 100%;
123 max-width: 40em;
124 }
125
126 ul {
127 list-style-position: inside;
128 border: 1px solid #808080;
129 background-color: #ffffff;
130 min-height: 100%;
131 width: 100%;
132 padding-top: 0;
133 margin: 0;
134 padding-left: 0;
135 box-sizing: border-box;
136 box-shadow: 0 0 5px #000000;
137 overflow-x: hidden;
138 }
139
140 #new-pref-container {
141 width: 100%;
142 margin: 0;
143 background-color: #ffffff;
144 box-sizing: border-box;
145 box-shadow: 0 0 5px #000000;
146 overflow-x: hidden;
147 max-width: 40em;
148 max-height: 100%;
149 position: fixed;
150 top: 3em;
151 left: auto;
152 display: none;
153 z-index: 5;
154 }
155
156 #new-pref-container input,
157 #new-pref-container select {
158 border: none;
159 background-image: none;
160 }
161
162 #new-pref-container.show {
163 display: block;
164 }
165
166 li {
167 list-style-type: none;
168 border-bottom: 1px solid #d3d3d3;
169 opacity: 1;
170 background-color: #ffffff;
171 cursor: pointer;
172 }
173
174 #new-pref-line-boolean,
175 #new-pref-value-string,
176 #new-pref-value-int {
177 display: none;
178 }
179 #new-pref-item[typestyle="boolean"] #new-pref-line-boolean,
180 #new-pref-item[typestyle="string"] #new-pref-value-string,
181 #new-pref-item[typestyle="int"] #new-pref-value-int {
182 display: block;
183 }
184
185 .pref-name,
186 .pref-value {
187 padding: 15px 10px;
188 text-align: left;
189 text-overflow: ellipsis;
190 overflow: hidden;
191 background-image: none;
192 }
193
194 .pref-value {
195 color: rgba(0,0,0,0.5);
196 flex: 1 1 auto;
197 border: none;
198 -moz-appearance: none;
199 background-image: none;
200 background-color: transparent;
201 }
202
203 .pref-name[locked] {
204 padding-right: 20px;
205 background-image: url("chrome://browser/skin/images/lock.png");
206 background-repeat: no-repeat;
207 background-position: right 50%;
208 background-size: auto 60%;
209 }
210
211 #new-pref-name {
212 width: 30em;
213 }
214
215 #new-pref-type {
216 display: inline-block !important;
217 border-left: 1px solid #d3d3d3;
218 width: 10em;
219 text-align: right;
220 }
221
222 .pref-item-line {
223 border-top: 1px solid rgba(0,0,0,0.05);
224 color: rgba(0,0,0,0.5);
225 display: flex;
226 flex-direction: row;
227 }
228
229 #new-pref-value-boolean {
230 flex: 1 1 auto;
231 }
232
233 #new-pref-container .pref-button.toggle {
234 display: inline-block;
235 opacity: 1;
236 flex: 0 1 auto;
237 float: right;
238 }
239
240 #new-pref-container .pref-button.cancel,
241 #new-pref-container .pref-button.create {
242 display: inline-block;
243 opacity: 1;
244 flex: 1 1 auto;
245 }
246
247 .pref-item-line {
248 pointer-events: none;
249 }
250
251 #new-pref-container .pref-item-line,
252 .pref-item.selected .pref-item-line,
253 .pref-item:not(.selected) .pref-button.reset {
254 pointer-events: auto;
255 }
256
257 #new-pref-container .pref-button.create[disabled] {
258 color: #d3d3d3;
259 }
260
261 .pref-item.selected {
262 background-color: rgba(0,0,255,0.05);
263 }
264
265 .pref-button {
266 display: inline-block;
267 box-sizing: border-box;
268 text-align: center;
269 padding: 10px 1em;
270 border-left: 1px solid rgba(0,0,0,0.1);
271 opacity: 0;
272 transition-property: opacity;
273 transition-duration: 500ms;
274 }
275
276 .pref-item.selected .pref-item-line .pref-button {
277 opacity: 1;
278 }
279
280 .pref-item:not(.selected) .pref-item-line .pref-button:not(.reset) {
281 display: none;
282 }
283
284 .pref-item:not(.selected) .pref-button.reset {
285 opacity: 1;
286 }
287
288 .pref-button:active {
289 background-color: rgba(0,0,255,0.2);
290 }
291
292 .pref-button[disabled] {
293 display: none;
294 }
295
296 .pref-button.up {
297 background-image: url("chrome://browser/skin/images/arrowup-16.png");
298 background-position: center center;
299 background-repeat: no-repeat;
300 }
301
302 .pref-button.down {
303 background-image: url("chrome://browser/skin/images/arrowdown-16.png");
304 background-position: center center;
305 background-repeat: no-repeat;
306 }
307
308 #prefs-shield {
309 width: 100%;
310 height: 100%;
311 background-color: rgba(0,0,0,0.5);
312 position: fixed;
313 top: 0;
314 left: 0;
315 opacity: 0;
316 transition-property: opacity;
317 transition-duration: 500ms;
318 display: none;
319 }
320
321 #prefs-shield[shown] {
322 display: block;
323 opacity: 1;
324 }
325
326 #loading-container > li {
327 background-image: url(chrome://browser/skin/images/throbber.png);
328 background-position: center center;
329 background-repeat: no-repeat;
330 padding-left: 40px;
331 height: 3em;
332 width: 100%;
333 }

mercurial