OLD | NEW |
---|---|
(Empty) | |
1 /* Copyright 2014 The Chromium Authors. All rights reserved. | |
2 * Use of this source code is governed by a BSD-style license that can be | |
3 * found in the LICENSE file. */ | |
4 | |
5 * { | |
6 box-sizing: border-box; | |
7 color: rgba(0,0,0,.87); | |
Matt Giuca
2014/08/29 08:49:47
nit: space between commas.
kcarattini
2014/09/01 06:59:07
Done.
| |
8 font-family: Helvetica, sans-serif; | |
9 font-size: 14px; | |
10 margin: 0; | |
11 padding: 0; | |
12 } | |
Matt Giuca
2014/08/29 08:49:47
nit: Blank line between all of these.
kcarattini
2014/09/01 06:59:08
Done.
| |
13 a { | |
14 color: rgb(67, 133, 244); | |
Matt Giuca
2014/08/29 08:49:47
nit: Use #rgb style colour. (Unfortunately, #rgba
kcarattini
2014/09/01 06:59:08
The chromium style guide I found here says to pref
Matt Giuca
2014/09/01 12:35:00
Acknowledged.
| |
15 text-decoration: none; | |
16 } | |
17 body { | |
18 background: #ddd; | |
19 } | |
20 h1 { | |
21 font-size: 34px; | |
22 font-weight: normal; | |
23 line-height: 40px; | |
24 } | |
25 h2 { | |
26 font-size: 16px; | |
27 font-weight: normal; | |
28 } | |
29 h4 { | |
30 font-size: 14px; | |
31 } | |
32 div.container { | |
33 background: #fff; | |
34 box-shadow: 0 0 30px rgba(0,0,0,0.3); | |
35 height: 600px; | |
36 width: 800px; | |
37 } | |
38 div.header { | |
39 background: url(../images/header-optin-1x.png) no-repeat; | |
40 height: 240px; | |
41 vertical-align: bottom; | |
42 } | |
43 div.header-text { | |
44 height: 240px; | |
45 padding: 60px; | |
46 } | |
47 div.header-text h1 { | |
48 color: #fff; | |
49 margin-top: 44px; | |
50 } | |
51 div.header-text h2 { | |
52 color: #fff; | |
53 margin-top: 20px; | |
54 } | |
55 div.content { | |
56 height: 240px; | |
57 margin: 60px 60px auto 60px; | |
58 } | |
59 .x { | |
60 background: url(../images/bt-close-1x.png); | |
61 float: right; | |
62 height: 60px; | |
63 width: 60px; | |
64 } | |
65 | |
66 button.grayed-out { | |
67 color: rgba(0,0,0,.28); | |
68 } | |
69 .col-3 { | |
70 color: rgba(0,0,0,.54); | |
71 line-height: 24px; | |
72 width: 504px; | |
73 } | |
74 .col-3 h4 { | |
75 line-height: 100%; | |
76 margin-bottom: 27px; | |
77 } | |
78 .col-2 { | |
79 color: rgba(0,0,0,.54); | |
80 float: left; | |
81 line-height: 24px; | |
82 width: 332px; | |
83 } | |
84 .col-2 h4 { | |
85 line-height: 100%; | |
86 margin-top: 27px; | |
87 } | |
88 .col-spacing { | |
89 float: left; | |
90 height: 160px; | |
91 width: 16px; | |
92 } | |
93 a.link-button { | |
94 display: inline-block; | |
95 font-size: 14px; | |
96 margin-top: 22px; | |
97 text-decoration: none; | |
98 text-transform: uppercase; | |
99 } | |
100 div.buttonbar { | |
101 background: rgba(0,0,0,.06); | |
102 height: 60px; | |
103 padding: 12px 60px; | |
104 } | |
105 .buttonbar button { | |
106 background: none; | |
107 border: none; | |
108 border-radius: 2px; | |
109 float: right; | |
110 height: 36px; | |
111 margin-left: 8px; | |
112 min-width: 88px; | |
113 padding: 8px; | |
114 text-transform: uppercase; | |
115 } | |
116 button.primary { | |
117 color: rgb(67, 133, 244); | |
118 } | |
119 .v-spacing-for-no-subheading { | |
120 height: 43px; | |
121 } | |
122 .train { | |
123 clear: both; | |
124 margin-bottom: 24px; | |
125 } | |
126 .train .icon { | |
127 display: inline-block; | |
128 height: 24px; | |
129 margin-right: 16px; | |
130 vertical-align: top; | |
131 width: 24px; | |
132 } | |
133 .train .text { | |
134 display: inline-block; | |
135 line-height: 24px; | |
136 vertical-align: top; | |
137 width: 292px; | |
138 } | |
139 .train.listening .text { | |
140 color: rgba(0,0,0,.87); | |
141 } | |
142 .train.not-started .text { | |
143 color: rgba(0,0,0,.54); | |
144 } | |
145 .train.recorded .text { | |
146 color: rgba(66,133,244,1); | |
147 } | |
148 .train.error .text { | |
149 color: rgb(213, 0, 0); | |
150 } | |
151 .train.listening .icon { | |
152 background: url(../images/placeholder-loader-1x.png) no-repeat; | |
153 } | |
154 .train.not-started .icon { | |
155 background: url(../images/ic-check-gray-1x.png) no-repeat; | |
156 } | |
157 .train.recorded .icon { | |
158 background: url(../images/ic-check-blue-1x.png) no-repeat; | |
159 } | |
160 .train.error .icon { | |
161 background: url(../images/placeholder-loader-error-1x.png) no-repeat; | |
162 } | |
163 .mic { | |
164 background: url(../images/mic-1x.png) no-repeat; | |
165 height: 80px; | |
166 left: 666px; | |
167 position: absolute; | |
168 top: 200px; | |
169 width: 80px; | |
170 } | |
171 .check { | |
172 clear: both; | |
173 height: 24px; | |
174 margin-bottom: 24px; | |
175 } | |
176 .check .icon { | |
177 background: url(../images/ic-check-blue-1x.png) no-repeat; | |
178 display: inline-block; | |
179 height: 24px; | |
180 margin-right: 16px; | |
181 vertical-align: top; | |
182 width: 24px; | |
183 } | |
184 .check .text { | |
185 color: rgba(0,0,0,.54); | |
186 display: inline-block; | |
187 height: 24px; | |
188 line-height: 24px; | |
189 vertical-align: top; | |
190 } | |
OLD | NEW |