Chromium Code Reviews| 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 |