Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(45)

Side by Side Diff: chrome/browser/resources/sync_promo/sync_promo.css

Issue 9741001: DOMUI: Remove experimental sync promo layouts (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: a Created 8 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. 1 /* Copyright (c) 2012 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 html { 6 html {
7 font-family: segoe ui, arial, helvetica, sans-serif; 7 font-family: segoe ui, arial, helvetica, sans-serif;
8 font-size: 13px; 8 font-size: 13px;
9 } 9 }
10 10
11 html, body { 11 html, body {
12 margin: 0; 12 margin: 0;
13 min-height: 100%; 13 min-height: 100%;
14 min-width: 100%; 14 min-width: 100%;
15 padding 0; 15 padding 0;
16 position: absolute; 16 position: absolute;
17 } 17 }
18 18
19 html[promo-version='0'] body {
20 background-image: -webkit-linear-gradient(
21 rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.04));
22 }
23
24 #sync-setup-overlay { 19 #sync-setup-overlay {
25 background-color: transparent; 20 background-color: transparent;
26 margin: 0; 21 margin: 0;
27 width: 100%; 22 width: 100%;
28 } 23 }
29 24
30 #sync-setup-configure { 25 #sync-setup-configure {
31 background-color: transparent; 26 background-color: transparent;
32 margin-left: auto; 27 margin-left: auto;
33 margin-right: auto; 28 margin-right: auto;
34 width: 600px; 29 width: 600px;
35 } 30 }
36 31
37 .sync-main-content { 32 .sync-main-content {
38 margin: 0 auto; 33 margin: 0 auto;
39 max-width: 900px;
40 min-width: 830px;
41 padding: 23px 44px 0;
42 width: auto; 34 width: auto;
43 } 35 }
44 36
45 html[promo-version='3'] .sync-main-content {
46 max-width: none;
47 min-width: 0;
48 padding-top: 0;
49 }
50
51 #sync-setup-login-content-column { 37 #sync-setup-login-content-column {
52 float: right; 38 margin: 0 auto;
53 width: 335px; 39 width: 335px;
54 } 40 }
55 41
56 html[dir='rtl'] #sync-setup-login-content-column {
57 float: left;
58 }
59
60 html[promo-version='3'] #sync-setup-login-content-column {
61 float: none;
62 margin: 0 auto;
63 }
64
65 #sync-setup-login-promo-column p, 42 #sync-setup-login-promo-column p,
66 #sync-setup-login-promo-column h3 { 43 #sync-setup-login-promo-column h3 {
67 color: rgb(34, 34, 34); 44 color: rgb(34, 34, 34);
68 } 45 }
69 46
70 /* When showing the full page promo, remove top margin from sign-in box. */ 47 /* When showing the full page promo, remove top margin from sign-in box. */
71 #sync-promo .sign-in { 48 #sync-promo .sign-in {
72 margin-top: 0; 49 margin-top: 0;
73 } 50 }
74 51
(...skipping 48 matching lines...) Expand 10 before | Expand all | Expand 10 after
123 } 100 }
124 101
125 /* Page Title. ****************************************************************/ 102 /* Page Title. ****************************************************************/
126 103
127 #promo-title-container { 104 #promo-title-container {
128 display: block; 105 display: block;
129 margin: 37px 44px 35px; 106 margin: 37px 44px 35px;
130 text-align: center; 107 text-align: center;
131 } 108 }
132 109
133 html[promo-version='2'] #promo-title-container {
134 display: none;
135 }
136
137 h1 { 110 h1 {
138 color: rgb(34, 34, 34); 111 color: rgb(34, 34, 34);
139 font-size: 27px; 112 font-size: 36px;
140 font-weight: normal; 113 font-weight: normal;
141 margin: 0; 114 margin: 0;
142 } 115 }
143 116
144 html[promo-version='1'] #sync-setup-login h1 {
145 font-size: 40px;
146 }
147
148 html[promo-version='3'] #sync-setup-login h1 {
149 font-size: 36px;
150 }
151
152 #promo-title-container h2 { 117 #promo-title-container h2 {
153 color: rgb(102, 102, 102); 118 color: rgb(102, 102, 102);
154 font-size: 16px; 119 font-size: 14px;
155 font-weight: normal; 120 font-weight: normal;
156 } 121 }
157 122
158 html[promo-version='0'] #promo-title-container h2,
159 html[promo-version='2'] #promo-title-container h2 {
160 display: none;
161 }
162
163 html[promo-version='3'] #promo-title-container h2 {
164 font-size: 14px;
165 }
166
167 #promo-learn-more { 123 #promo-learn-more {
168 display: inline-block; 124 display: inline-block;
169 } 125 }
170
171 /* Signup header bar. *********************************************************/
172
173 .signup-header-bar {
174 background: rgb(245, 245, 245);
175 border-bottom: 1px solid rgb(229, 229, 229);
176 height: 71px;
177 overflow: hidden;
178 padding: 0 44px;
179 }
180
181 .signup-header-bar .logo {
182 background: url('chrome://resources/images/google-logo-41.png') no-repeat;
183 float: left;
184 height: 41px;
185 margin: 17px 0 0;
186 width: 116px;
187 }
188
189 html[dir='rtl'] .signup-header-bar .logo {
190 float: right;
191 }
192
193 html[promo-version='2'] .signup-header-bar {
194 display: block;
195 }
196
197 .signup-header-bar .signup {
198 float: right;
199 font-weight: bold;
200 margin: 28px 0 0;
201 }
202
203 html[dir='rtl'] .signup-header-bar .signup {
204 float: left;
205 }
206
207 /* Promo graphic / info toggle column. ****************************************/
208
209 #sync-setup-login-promo-column-0 h2 {
210 color: rgb(34, 34, 34);
211 font-size: 18px;
212 font-weight: normal;
213 }
214
215 #sync-setup-login-promo-column-0 p {
216 font-size: 13px;
217 line-height: 20px;
218 }
219
220 #promo-info-pane {
221 height: 186px;
222 position: relative;
223 }
224
225 #promo-info-pane > * {
226 -webkit-transition: opacity 200ms linear;
227 opacity: 1;
228 position: absolute;
229 }
230
231 #promo-info-pane > [hidden] {
232 display: inline-block; /* Override default user-agent styles. */
233 opacity: 0;
234 }
235
236 #promo-infographic {
237 background: url('chrome://theme/IRD_SYNC_PROMO_INFO_GRAPHIC') no-repeat;
238 height: 161px;
239 margin-top: 14px;
240 width: 444px;
241 }
242
243 #promo-infographic-1 {
244 background: url('chrome://theme/IRD_SYNC_PROMO_INFO_GRAPHIC_1') no-repeat;
245 height: 274px;
246 margin-top: 10px;
247 width: 451px;
248 }
249
250 /* Verbose feature list. ******************************************************/
251
252 #sync-setup-login-promo-column-2 h2 {
253 color: rgb(221, 75, 57);
254 font-size: 25px;
255 font-weight: normal;
256 margin: 0 0 15px;
257 }
258
259 .features {
260 line-height: 17px;
261 list-style: none;
262 margin: 2em 0 0;
263 overflow: hidden;
264 padding: 0;
265 }
266
267 .features li {
268 margin: 3px 0 2em;
269 }
270
271 .feature-logo {
272 float: left;
273 margin: -3px 0 0;
274 }
275
276 html[dir='rtl'] .feature-logo {
277 float: right;
278 }
279
280 .features p,
281 .features h3 {
282 -webkit-margin-start: 68px;
283 margin-bottom: 0;
284 margin-top: 0;
285 }
286
287 .features h3 {
288 font-size: 16px;
289 font-weight: normal;
290 margin-bottom: 0.3em;
291 }
292
293 #features-sync-logo {
294 background: url('chrome://resources/images/sync.png') no-repeat;
295 height: 42px;
296 width: 53px;
297 }
298
299 #features-sync-backup-logo {
300 background: url('chrome://resources/images/sync-backup.png') no-repeat;
301 height: 42px;
302 width: 52px;
303 }
304
305 #features-google-mail-logo {
306 background: url('chrome://resources/images/google-mail.png') no-repeat;
307 height: 43px;
308 width: 52px;
309 }
310
311 /* Promo information column. **************************************************/
312
313 #sync-setup-login-promo-column {
314 display: block;
315 }
316
317 html[promo-version='3'] #sync-setup-login-promo-column {
318 display: none;
319 }
320
321 html[promo-version='0'] #sync-setup-login-promo-column-0,
322 html[promo-version='1'] #sync-setup-login-promo-column-1,
323 html[promo-version='2'] #sync-setup-login-promo-column-2 {
324 display: block;
325 }
326
327 #sync-setup-login-promo-column {
328 -webkit-margin-end: 385px;
329 }
OLDNEW
« no previous file with comments | « chrome/browser/resources/shared_resources.grd ('k') | chrome/browser/resources/sync_promo/sync_promo.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698