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 html { |
| 6 background: #fafafa !important; |
| 7 } |
| 8 |
5 body { | 9 body { |
6 margin: 10px 8px; | 10 font-family: Arial, sans-serif; |
| 11 font-size: 75%; |
| 12 line-height: 1.5; |
| 13 } |
| 14 |
| 15 h1 { |
| 16 color: #000; |
| 17 font-size: 1.7em; |
| 18 font-weight: normal; |
| 19 line-height: 1.2em; |
| 20 margin: 0 0 .7em; |
| 21 } |
| 22 |
| 23 a { |
| 24 color: rgb(66, 129, 244); |
| 25 text-decoration: none; |
| 26 } |
| 27 |
| 28 a:hover { |
| 29 text-decoration: underline; |
| 30 } |
| 31 |
| 32 p { |
| 33 margin: 0 0 1em; |
7 } | 34 } |
8 | 35 |
9 .icon { | 36 .icon { |
10 -webkit-margin-end: 3px; | 37 content: -webkit-image-set( |
11 -webkit-margin-start: 6px; | 38 url('../../../browser/resources/ntp4/images/incognito_illustration_sml.png
') 1x, |
| 39 url('../../../browser/resources/ntp4/images/2x/incognito_illustration_sml.
png') 2x); |
| 40 height: 128px; |
| 41 width: 128px; |
12 } | 42 } |
13 | 43 |
14 html[dir='ltr'] .icon { | 44 html[dir='ltr'] .icon { |
15 -webkit-transform: scaleX(-1); | |
16 float: right; | 45 float: right; |
| 46 margin: 4px 0 10px 25px; |
17 } | 47 } |
18 | 48 |
19 html[dir='rtl'] .icon { | 49 html[dir='rtl'] .icon { |
20 float: left; | 50 float: left; |
| 51 margin: 4px 35px 10px 0; |
21 } | 52 } |
22 | 53 |
23 .content { | 54 .content { |
24 background-color: #eee; | 55 background-color: #fff; |
25 border-radius: 5px; | 56 border-radius: 2px; |
| 57 box-shadow: 0 4px 6px 1px rgba(50, 50, 50, 0.14); |
| 58 box-sizing: border-box; |
26 color: black; | 59 color: black; |
27 margin-left: auto; | 60 line-height: 1.5; |
28 margin-right: auto; | 61 margin: 5.5em auto 0; |
29 margin-top: 66px; | 62 max-width: 640px; |
30 max-width: 600px; | 63 padding: 30px 35px 30px 37px; |
31 padding: 10px; | 64 width: 100%; |
32 } | 65 } |
33 | 66 |
34 .extensions-message { | 67 .content > span { |
35 -webkit-padding-start: 39px; | 68 display: block; |
36 margin-top: 15px; | 69 max-width: 416px; |
37 position: relative; | |
38 } | 70 } |
39 | 71 |
40 .extension-icon { | 72 .content p:last-child { |
41 content: -webkit-image-set( | 73 margin-bottom: 4px; |
42 url('../../../app/theme/default_100_percent/extensions_section.png') 1x, | |
43 url('../../../app/theme/default_200_percent/extensions_section.png') 2x); | |
44 display: inline-block; | |
45 left: 0; | |
46 margin-top: -15px; | |
47 position: absolute; | |
48 right: 0; | |
49 top: 50%; | |
50 width: 30px; | |
51 } | 74 } |
| 75 |
| 76 @media (max-width:700px) { |
| 77 body { |
| 78 margin: 3em 2em 2em; |
| 79 } |
| 80 } |
| 81 |
| 82 @media (max-width:400px) { |
| 83 body { |
| 84 margin: 3em 1.5em 2em; |
| 85 } |
| 86 |
| 87 .icon { |
| 88 height: 96px; |
| 89 width: 96px; |
| 90 } |
| 91 |
| 92 html[dir='ltr'] .icon { |
| 93 margin: 4px 0 10px 15px; |
| 94 } |
| 95 |
| 96 html[dir='rtl'] .icon { |
| 97 margin: 4px 15px 10px 0; |
| 98 } |
| 99 } |
| 100 |
| 101 @media (max-height:480px) and (max-width:400px) { |
| 102 .content { |
| 103 margin: auto; |
| 104 } |
| 105 } |
OLD | NEW |