OLD | NEW |
---|---|
1 /* Copyright 2013 The Chromium Authors. All rights reserved. | 1 /* Copyright 2013 The Chromium Authors. All rights reserved. |
2 * Use of this source code is governed by a BSD-style license that can be | 2 * Use of this source code is governed by a BSD-style license that can be |
3 * found in the LICENSE file. */ | 3 * found in the LICENSE file. */ |
4 | 4 |
5 /******************************************************************************* | 5 /******************************************************************************* |
6 * | 6 * |
7 * Note: This is also used by a file in chrome/browser/resources/ssl. When | 7 * Note: This is also used by a file in chrome/browser/resources/ssl. When |
Bernhard Bauer
2014/08/04 11:49:18
This comment makes less sense in a file that is in
Randy Smith (Not in Mondays)
2014/08/04 12:21:26
And is no longer accurate, even in c/r/r. Removed
| |
8 * updating this file, make sure nothing in that directory regresses. | 8 * updating this file, make sure nothing in that directory regresses. |
9 * | 9 * |
10 ******************************************************************************/ | 10 ******************************************************************************/ |
11 | 11 |
12 body { | 12 body { |
13 background-color: #E6E6E6; | 13 background-color: #E6E6E6; |
14 font-family: Helvetica, Arial, sans-serif; | 14 font-family: Helvetica, Arial, sans-serif; |
15 font-size: 10pt; | 15 font-size: 10pt; |
16 margin: 50px 40px 20px 40px; | 16 margin: 50px 40px 20px 40px; |
17 } | 17 } |
(...skipping 20 matching lines...) Expand all Loading... | |
38 border-bottom: 1px solid #888; | 38 border-bottom: 1px solid #888; |
39 border-radius: 3px; | 39 border-radius: 3px; |
40 color: black; | 40 color: black; |
41 <if expr="not is_android and not is_ios"> | 41 <if expr="not is_android and not is_ios"> |
42 /* Not done on mobile for performance reasons. */ | 42 /* Not done on mobile for performance reasons. */ |
43 box-shadow: 0px 2px 2px #AAA; | 43 box-shadow: 0px 2px 2px #AAA; |
44 </if> | 44 </if> |
45 } | 45 } |
46 | 46 |
47 #diagnose-button { | 47 #diagnose-button { |
48 -webkit-margin-start: 0; | |
49 margin-bottom: 10px; | |
48 margin-top: 20px; | 50 margin-top: 20px; |
49 margin-bottom: 10px; | |
50 -webkit-margin-start: 0px; | |
51 } | 51 } |
52 | 52 |
53 #content-top #buttons, | 53 #content-top #buttons, |
54 #content-top h1 { | 54 #content-top h1 { |
55 color: #666; | 55 color: #666; |
56 margin: 10px 0px 30px 0px; | 56 font-size: 1.5em; |
57 font-weight: normal; | 57 font-weight: normal; |
58 font-size: 1.5em; | 58 margin: 10px 0 30px 0; |
59 text-align: center; | 59 text-align: center; |
60 } | 60 } |
61 | 61 |
62 h2 { | 62 h2 { |
63 color: #666; | 63 color: #666; |
64 font-size: 1.2em; | 64 font-size: 1.2em; |
65 font-weight: normal; | 65 font-weight: normal; |
66 margin: 10px 0; | 66 margin: 10px 0; |
67 } | 67 } |
68 | 68 |
69 a { | 69 a { |
70 color: #15c; | 70 color: rgb(17, 85, 204); |
71 text-decoration: none; | 71 text-decoration: none; |
72 } | 72 } |
73 | 73 |
74 .icon { | 74 .icon { |
75 -webkit-user-select: none; | 75 -webkit-user-select: none; |
76 } | 76 } |
77 | 77 |
78 .icon-generic { | 78 .icon-generic { |
79 /** | 79 /** |
80 * Can't access chrome://theme/IDR_ERROR_NETWORK_GENERIC from an untrusted | 80 * Can't access chrome://theme/IDR_ERROR_NETWORK_GENERIC from an untrusted |
81 * renderer process, so embed the resource manually. | 81 * renderer process, so embed the resource manually. |
82 */ | 82 */ |
83 content: -webkit-image-set( | 83 content: -webkit-image-set( |
84 url('../../app/theme/default_100_percent/common/error_network_generic.png' ) 1x, | 84 url('../../../app/theme/default_100_percent/common/error_network_generic.p ng') 1x, |
85 url('../../app/theme/default_200_percent/common/error_network_generic.png' ) 2x); | 85 url('../../../app/theme/default_200_percent/common/error_network_generic.p ng') 2x); |
86 } | 86 } |
87 | 87 |
88 .icon-offline { | 88 .icon-offline { |
89 content: -webkit-image-set( | 89 content: -webkit-image-set( |
90 url('../../app/theme/default_100_percent/common/error_network_offline.png' ) 1x, | 90 url('../../../app/theme/default_100_percent/common/error_network_offline.p ng') 1x, |
91 url('../../app/theme/default_200_percent/common/error_network_offline.png' ) 2x); | 91 url('../../../app/theme/default_200_percent/common/error_network_offline.p ng') 2x); |
92 } | 92 } |
93 | 93 |
94 #content-top { | 94 #content-top { |
95 margin: 20px; | 95 margin: 20px; |
96 } | 96 } |
97 | 97 |
98 #help-box-outer { | 98 #help-box-outer { |
99 -webkit-transition: height ease-in 218ms; | |
99 overflow: hidden; | 100 overflow: hidden; |
100 -webkit-transition: height ease-in 218ms; | |
101 } | 101 } |
102 | 102 |
103 #help-box-inner { | 103 #help-box-inner { |
104 background-color: #f9f9f9; | 104 background-color: #f9f9f9; |
105 border-top: 1px solid #EEE; | 105 border-top: 1px solid #EEE; |
106 color: #444; | 106 color: #444; |
107 padding: 20px; | 107 padding: 20px; |
108 text-align: start; | 108 text-align: start; |
109 } | 109 } |
110 | 110 |
(...skipping 11 matching lines...) Expand all Loading... | |
122 /* Not done on mobile for performance reasons. */ | 122 /* Not done on mobile for performance reasons. */ |
123 text-shadow: 0 1px 0 rgba(255,255,255,0.3); | 123 text-shadow: 0 1px 0 rgba(255,255,255,0.3); |
124 </if> | 124 </if> |
125 } | 125 } |
126 | 126 |
127 [jscontent=failedUrl] { | 127 [jscontent=failedUrl] { |
128 overflow-wrap: break-word; | 128 overflow-wrap: break-word; |
129 } | 129 } |
130 | 130 |
131 button { | 131 button { |
132 -webkit-user-select: none; | |
132 border: 1px solid rgba(0, 0, 0, 0.25); | 133 border: 1px solid rgba(0, 0, 0, 0.25); |
133 border-radius: 2px; | 134 border-radius: 2px; |
134 color: #444; | 135 color: #444; |
135 -webkit-user-select: none; | |
136 <if expr="not is_android"> | 136 <if expr="not is_android"> |
137 /* iOS does not support linear-gradient without a prefix. */ | 137 /* iOS does not support linear-gradient without a prefix. */ |
138 background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede); | 138 background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede); |
139 text-shadow: 0 1px 0 rgb(240, 240, 240); | 139 text-shadow: 0 1px 0 rgb(240, 240, 240); |
140 </if> | 140 </if> |
141 <if expr="is_android"> | 141 <if expr="is_android"> |
142 /* Android uses flat background colors. */ | 142 /* Android uses flat background colors. */ |
143 background-color: #ededed; | 143 background-color: #ededed; |
144 font-weight: bold; | 144 font-weight: bold; |
145 </if> | 145 </if> |
146 <if expr="not is_android and not is_ios"> | 146 <if expr="not is_android and not is_ios"> |
147 /* Not done on mobile for performance reasons. */ | 147 /* Not done on mobile for performance reasons. */ |
148 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08), inset 0 1px 2px rgba(255, 255, 255, 0 .75); | 148 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08), |
149 inset 0 1px 2px rgba(255, 255, 255, 0.75); | |
149 </if> | 150 </if> |
150 } | 151 } |
151 | 152 |
152 button:hover { | 153 button:hover { |
153 border: 1px solid rgba(0, 0, 0, 0.3); | 154 border: 1px solid rgba(0, 0, 0, 0.3); |
154 color: #000; | 155 color: #000; |
155 <if expr="not is_android"> | 156 <if expr="not is_android"> |
156 background-image: -webkit-linear-gradient(#f0f0f0, #f0f0f0 38%, #e0e0e0); | 157 background-image: -webkit-linear-gradient(#f0f0f0, #f0f0f0 38%, #e0e0e0); |
157 </if> | 158 </if> |
158 <if expr="is_android"> | 159 <if expr="is_android"> |
159 background-color: #f0f0f0; | 160 background-color: #f0f0f0; |
160 </if> | 161 </if> |
161 <if expr="not is_android and not is_ios"> | 162 <if expr="not is_android and not is_ios"> |
162 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12), inset 0 1px 2px rgba(255, 255, 255, 0 .95); | 163 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12), |
164 inset 0 1px 2px rgba(255, 255, 255, 0.95); | |
163 </if> | 165 </if> |
164 } | 166 } |
165 | 167 |
166 button:active { | 168 button:active { |
167 border: 1px solid rgba(0, 0, 0, 0.3); | 169 border: 1px solid rgba(0, 0, 0, 0.3); |
168 color: #444; | 170 color: #444; |
169 <if expr="not is_android"> | 171 <if expr="not is_android"> |
170 background-image: -webkit-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7); | 172 background-image: -webkit-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7); |
171 </if> | 173 </if> |
172 <if expr="is_android"> | 174 <if expr="is_android"> |
173 background-color: #e7e7e7; | 175 background-color: #e7e7e7; |
174 </if> | 176 </if> |
175 <if expr="not is_android and not is_ios"> | 177 <if expr="not is_android and not is_ios"> |
176 box-shadow: none; | 178 box-shadow: none; |
177 </if> | 179 </if> |
178 } | 180 } |
179 | 181 |
180 .text-button { | 182 .text-button { |
181 margin: 0px 5px; | 183 margin: 0 5px; |
182 min-height: 29px; | 184 min-height: 29px; |
183 min-width: 65px; | 185 min-width: 65px; |
184 padding: 7px 13px; | 186 padding: 7px 13px; |
185 } | 187 } |
186 | 188 |
187 .blue-button { | 189 .blue-button { |
188 color: #fff; | 190 color: #fff; |
189 <if expr="not is_android"> | 191 <if expr="not is_android"> |
190 background-image: -webkit-linear-gradient(#5d9aff, #5d9aff 38%, #5891f0); | 192 background-image: -webkit-linear-gradient(#5d9aff, #5d9aff 38%, #5891f0); |
191 border: 1px solid rgba(45, 102, 195, 1); | 193 border: 1px solid rgba(45, 102, 195, 1); |
192 text-shadow: 0 1px 0 rgba(0,0,0,0.5); | 194 text-shadow: 0 1px 0 rgba(0,0,0,0.5); |
193 </if> | 195 </if> |
194 <if expr="is_android"> | 196 <if expr="is_android"> |
195 background-color: rgb(39, 180, 231); | 197 background-color: rgb(39, 180, 231); |
196 border: 1px solid rgb(0, 152, 206); | 198 border: 1px solid rgb(0, 152, 206); |
197 </if> | 199 </if> |
198 <if expr="not is_android and not is_ios"> | 200 <if expr="not is_android and not is_ios"> |
199 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 1px 2px rgba(255, 255, 255, 0 .2); | 201 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), |
202 inset 0 1px 2px rgba(255, 255, 255, 0.2); | |
200 </if> | 203 </if> |
201 } | 204 } |
202 | 205 |
203 .blue-button:hover { | 206 .blue-button:hover { |
204 color: #fff; | 207 color: #fff; |
205 <if expr="not is_android"> | 208 <if expr="not is_android"> |
206 background-image: -webkit-linear-gradient(#659efd, #659efd 38%, #6097f1); | 209 background-image: -webkit-linear-gradient(#659efd, #659efd 38%, #6097f1); |
207 border: 1px solid rgba(45, 102, 195, 1); | 210 border: 1px solid rgba(45, 102, 195, 1); |
208 </if> | 211 </if> |
209 <if expr="not is_android and not is_ios"> | 212 <if expr="not is_android and not is_ios"> |
210 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25), inset 0 1px 2px rgba(255, 255, 255, 0 .2); | 213 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25), |
214 inset 0 1px 2px rgba(255, 255, 255, 0.2); | |
211 </if> | 215 </if> |
212 } | 216 } |
213 | 217 |
214 .blue-button:active { | 218 .blue-button:active { |
215 <if expr="not is_android"> | 219 <if expr="not is_android"> |
216 background-image: -webkit-linear-gradient(#6095ed, #6095ed 38%, #6095ed); | 220 background-image: -webkit-linear-gradient(#6095ed, #6095ed 38%, #6095ed); |
217 border: 1px solid rgb(38, 84, 160); | 221 border: 1px solid rgb(38, 84, 160); |
218 </if> | 222 </if> |
219 <if expr="is_android"> | 223 <if expr="is_android"> |
220 background-color: rgb(0, 152, 206); | 224 background-color: rgb(0, 152, 206); |
(...skipping 12 matching lines...) Expand all Loading... | |
233 #search-box { | 237 #search-box { |
234 border: 1px solid #cdcdcd; | 238 border: 1px solid #cdcdcd; |
235 flex-grow: 1; | 239 flex-grow: 1; |
236 font-size: 16px; | 240 font-size: 16px; |
237 height: 26px; | 241 height: 26px; |
238 margin-right: 0; | 242 margin-right: 0; |
239 padding: 1px 9px; | 243 padding: 1px 9px; |
240 } | 244 } |
241 | 245 |
242 #search-box:focus { | 246 #search-box:focus { |
243 border: 1px solid #5d9aff; | 247 border: 1px solid rgb(93, 154, 255); |
244 outline: none; | 248 outline: none; |
245 } | 249 } |
246 | 250 |
247 #search-button { | 251 #search-button { |
248 border: none; | 252 border: none; |
253 border-bottom-left-radius: 0; | |
249 border-top-left-radius: 0; | 254 border-top-left-radius: 0; |
250 border-bottom-left-radius: 0; | |
251 box-shadow: none; | 255 box-shadow: none; |
252 display: flex; | 256 display: flex; |
253 height: 30px; | 257 height: 30px; |
254 margin: 0; | 258 margin: 0; |
259 padding: 0; | |
255 width: 60px; | 260 width: 60px; |
256 padding: 0; | |
257 } | 261 } |
258 | 262 |
259 #search-image { | 263 #search-image { |
260 content: | 264 content: |
261 -webkit-image-set( | 265 -webkit-image-set( |
262 url('../../app/theme/default_100_percent/common/omnibox_search_button_ loupe.png') 1x, | 266 url('../../../app/theme/default_100_percent/common/omnibox_search_butt on_loupe.png') 1x, |
263 url('../../app/theme/default_200_percent/common/omnibox_search_button_ loupe.png') 2x); | 267 url('../../../app/theme/default_200_percent/common/omnibox_search_butt on_loupe.png') 2x); |
264 margin: auto; | 268 margin: auto; |
265 } | 269 } |
266 | 270 |
267 .hidden { | 271 .hidden { |
268 display: none; | 272 display: none; |
269 } | 273 } |
270 | 274 |
271 .suggestions { | 275 .suggestions { |
272 margin-top: 18px; | 276 margin-top: 18px; |
273 } | 277 } |
(...skipping 18 matching lines...) Expand all Loading... | |
292 line-height: 18px; | 296 line-height: 18px; |
293 } | 297 } |
294 } | 298 } |
295 | 299 |
296 /* Decrease padding at low sizes. */ | 300 /* Decrease padding at low sizes. */ |
297 @media (max-width: 640px), (max-height: 640px) { | 301 @media (max-width: 640px), (max-height: 640px) { |
298 body { | 302 body { |
299 margin: 15px; | 303 margin: 15px; |
300 } | 304 } |
301 h1 { | 305 h1 { |
302 margin: 10px 0px 15px 0px; | 306 margin: 10px 0 15px 0; |
303 } | 307 } |
304 #content-top { | 308 #content-top { |
305 margin: 15px; | 309 margin: 15px; |
306 } | 310 } |
307 #help-box-inner { | 311 #help-box-inner { |
308 padding: 20px; | 312 padding: 20px; |
309 } | 313 } |
310 .suggestions { | 314 .suggestions { |
311 margin-top: 10px; | 315 margin-top: 10px; |
312 } | 316 } |
313 .suggestion-header { | 317 .suggestion-header { |
314 margin-bottom: 0px; | 318 margin-bottom: 0; |
315 } | 319 } |
316 .error-code { | 320 .error-code { |
317 margin-top: 10px; | 321 margin-top: 10px; |
318 } | 322 } |
319 } | 323 } |
320 | 324 |
321 /* Don't allow overflow when in a subframe. */ | 325 /* Don't allow overflow when in a subframe. */ |
322 html[subframe] body { | 326 html[subframe] body { |
323 overflow: hidden; | 327 overflow: hidden; |
324 } | 328 } |
325 | 329 |
326 #sub-frame-error { | 330 #sub-frame-error { |
327 -webkit-align-items: center; | 331 -webkit-align-items: center; |
332 -webkit-flex-flow: column; | |
333 -webkit-justify-content: center; | |
328 background-color: #DDD; | 334 background-color: #DDD; |
329 display: -webkit-flex; | 335 display: -webkit-flex; |
330 -webkit-flex-flow: column; | |
331 height: 100%; | 336 height: 100%; |
332 -webkit-justify-content: center; | 337 left: 0; |
333 left: 0px; | |
334 position: absolute; | 338 position: absolute; |
335 top: 0px; | 339 top: 0; |
336 width: 100%; | 340 width: 100%; |
337 } | 341 } |
338 | 342 |
339 #sub-frame-error:hover { | 343 #sub-frame-error:hover { |
340 background-color: #EEE; | 344 background-color: #EEE; |
341 } | 345 } |
342 | 346 |
343 #sub-frame-error-details { | 347 #sub-frame-error-details { |
344 margin: 0 10px; | 348 margin: 0 10px; |
345 visibility: hidden; | 349 visibility: hidden; |
346 } | 350 } |
347 | 351 |
348 /* Show details only when hovering. */ | 352 /* Show details only when hovering. */ |
349 #sub-frame-error:hover #sub-frame-error-details { | 353 #sub-frame-error:hover #sub-frame-error-details { |
350 visibility: visible; | 354 visibility: visible; |
351 } | 355 } |
352 | 356 |
353 /* If the iframe is too small, always hide the error code. */ | 357 /* If the iframe is too small, always hide the error code. */ |
354 /* TODO(mmenke): See if overflow: no-display works better, once supported. */ | 358 /* TODO(mmenke): See if overflow: no-display works better, once supported. */ |
355 @media (max-width: 200px), (max-height: 95px) { | 359 @media (max-width: 200px), (max-height: 95px) { |
356 #sub-frame-error-details { | 360 #sub-frame-error-details { |
357 display: none; | 361 display: none; |
358 } | 362 } |
359 } | 363 } |
OLD | NEW |