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

Side by Side Diff: chrome/browser/resources/ntp4/new_tab.css

Issue 2535573002: Reduce usage of webkit CSS prefixes in chrome/browser/resources (Closed)
Patch Set: rebase Created 3 years, 10 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
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 html { 5 html {
6 /* It's necessary to put this here instead of in body in order to get the 6 /* It's necessary to put this here instead of in body in order to get the
7 background-size of 100% to work properly */ 7 background-size of 100% to work properly */
8 height: 100%; 8 height: 100%;
9 overflow: hidden; 9 overflow: hidden;
10 } 10 }
(...skipping 115 matching lines...) Expand 10 before | Expand all | Expand 10 after
126 } 126 }
127 127
128 #logo-img { 128 #logo-img {
129 display: inline-block; 129 display: inline-block;
130 margin-top: 4px; 130 margin-top: 4px;
131 overflow: hidden; 131 overflow: hidden;
132 position: relative; 132 position: relative;
133 } 133 }
134 134
135 .starting-up * { 135 .starting-up * {
136 -webkit-transition: none !important; 136 transition: none !important;
137 } 137 }
138 138
139 /* Login Status. **************************************************************/ 139 /* Login Status. **************************************************************/
140 140
141 #login-container { 141 #login-container {
142 background: transparent none; 142 background: transparent none;
143 border: none; 143 border: none;
144 box-shadow: none; 144 box-shadow: none;
145 color: inherit; 145 color: inherit;
146 font: inherit; 146 font: inherit;
(...skipping 57 matching lines...) Expand 10 before | Expand all | Expand 10 after
204 } 204 }
205 205
206 #login-status-dismiss { 206 #login-status-dismiss {
207 min-width: 6em; 207 min-width: 6em;
208 } 208 }
209 209
210 /* Trash. *********************************************************************/ 210 /* Trash. *********************************************************************/
211 211
212 #trash { 212 #trash {
213 -webkit-padding-start: 10px; 213 -webkit-padding-start: 10px;
214 -webkit-transition: top 200ms, opacity 0ms;
215 -webkit-transition-delay: 0ms, 200ms;
216 color: #222; 214 color: #222;
217 height: 100%; 215 height: 100%;
218 opacity: 0; 216 opacity: 0;
219 position: absolute; 217 position: absolute;
220 right: 0; 218 right: 0;
221 top: 50px; 219 top: 50px;
220 transition: top 200ms, opacity 0ms;
221 transition-delay: 0ms, 200ms;
222 width: auto; 222 width: auto;
223 } 223 }
224 224
225 html[dir='rtl'] #trash { 225 html[dir='rtl'] #trash {
226 left: 0; 226 left: 0;
227 right: auto; 227 right: auto;
228 } 228 }
229 229
230 #footer.showing-trash-mode #trash { 230 #footer.showing-trash-mode #trash {
231 -webkit-transition-delay: 0ms, 0ms;
232 -webkit-transition-duration: 0ms, 200ms;
233 opacity: 0.75; 231 opacity: 0.75;
234 top: 0; 232 top: 0;
233 transition-delay: 0ms, 0ms;
234 transition-duration: 0ms, 200ms;
235 } 235 }
236 236
237 #footer.showing-trash-mode #trash.drag-target { 237 #footer.showing-trash-mode #trash.drag-target {
238 opacity: 1; 238 opacity: 1;
239 } 239 }
240 240
241 #trash > .trash-text { 241 #trash > .trash-text {
242 -webkit-padding-end: 7px; 242 -webkit-padding-end: 7px;
243 -webkit-padding-start: 30px; 243 -webkit-padding-start: 30px;
244 border: 1px dashed #7f7f7f; 244 border: 1px dashed #7f7f7f;
(...skipping 10 matching lines...) Expand all
255 left: 18px; 255 left: 18px;
256 top: 18px; 256 top: 18px;
257 } 257 }
258 258
259 html[dir='rtl'] #trash > .lid, 259 html[dir='rtl'] #trash > .lid,
260 html[dir='rtl'] #trash > .can { 260 html[dir='rtl'] #trash > .can {
261 right: 18px; 261 right: 18px;
262 } 262 }
263 263
264 #footer.showing-trash-mode #trash.drag-target .lid { 264 #footer.showing-trash-mode #trash.drag-target .lid {
265 -webkit-transform: rotate(-45deg); 265 transform: rotate(-45deg);
266 } 266 }
267 267
268 html[dir='rtl'] #footer.showing-trash-mode #trash.drag-target .lid { 268 html[dir='rtl'] #footer.showing-trash-mode #trash.drag-target .lid {
269 -webkit-transform: rotate(45deg); 269 transform: rotate(45deg);
270 } 270 }
271 271
272 #fontMeasuringDiv { 272 #fontMeasuringDiv {
273 /* The font attributes match the nav inputs. */ 273 /* The font attributes match the nav inputs. */
274 font-size: 0.9em; 274 font-size: 0.9em;
275 font-weight: bold; 275 font-weight: bold;
276 pointer-events: none; 276 pointer-events: none;
277 position: absolute; 277 position: absolute;
278 visibility: hidden; 278 visibility: hidden;
279 } 279 }
280 280
281 /* Page switcher buttons. *****************************************************/ 281 /* Page switcher buttons. *****************************************************/
282 282
283 .page-switcher { 283 .page-switcher {
284 -webkit-transition: width 150ms, right 150ms, background-color 150ms;
285 background-color: transparent; 284 background-color: transparent;
286 border: none; 285 border: none;
287 bottom: 0; 286 bottom: 0;
288 font-size: 40px; 287 font-size: 40px;
289 margin: 0; 288 margin: 0;
290 max-width: 150px; 289 max-width: 150px;
291 min-width: 90px; 290 min-width: 90px;
292 outline: none; 291 outline: none;
293 padding: 0; 292 padding: 0;
294 position: absolute; 293 position: absolute;
295 top: 0; 294 top: 0;
295 transition: width 150ms, right 150ms, background-color 150ms;
296 z-index: 5; 296 z-index: 5;
297 } 297 }
298 298
299 /* Footer buttons. ************************************************************/ 299 /* Footer buttons. ************************************************************/
300 300
301 #chrome-web-store-link { 301 #chrome-web-store-link {
302 -webkit-order: 3; 302 -webkit-order: 3;
303 -webkit-padding-end: 12px; 303 -webkit-padding-end: 12px;
304 -webkit-transition-delay: 100ms;
305 color: inherit; 304 color: inherit;
306 cursor: pointer; 305 cursor: pointer;
307 display: inline-block; 306 display: inline-block;
308 margin: 0; 307 margin: 0;
309 text-decoration: none; 308 text-decoration: none;
309 transition-delay: 100ms;
310 white-space: nowrap; 310 white-space: nowrap;
311 } 311 }
312 312
313 #chrome-web-store-title { 313 #chrome-web-store-title {
314 -webkit-padding-end: 36px; 314 -webkit-padding-end: 36px;
315 -webkit-padding-start: 15px; 315 -webkit-padding-start: 15px;
316 background: url(chrome://theme/IDR_WEBSTORE_ICON_24) right 50% no-repeat; 316 background: url(chrome://theme/IDR_WEBSTORE_ICON_24) right 50% no-repeat;
317 display: inline-block; 317 display: inline-block;
318 line-height: 49px; 318 line-height: 49px;
319 } 319 }
320 320
321 #chrome-web-store-link:hover { 321 #chrome-web-store-link:hover {
322 color: #666; 322 color: #666;
323 } 323 }
324 324
325 html[dir='rtl'] #chrome-web-store-title { 325 html[dir='rtl'] #chrome-web-store-title {
326 background-position-x: left; 326 background-position-x: left;
327 } 327 }
328 328
329 /* In trash mode, hide the menus and web store link. */ 329 /* In trash mode, hide the menus and web store link. */
330 #footer.showing-trash-mode .menu-container { 330 #footer.showing-trash-mode .menu-container {
331 -webkit-transition-delay: 0ms;
332 opacity: 0; 331 opacity: 0;
332 transition-delay: 0ms;
333 visibility: hidden; 333 visibility: hidden;
334 } 334 }
335 335
336 #footer .menu-container { 336 #footer .menu-container {
337 -webkit-align-items: center; 337 -webkit-align-items: center;
338 -webkit-flex-direction: row; 338 -webkit-flex-direction: row;
339 -webkit-justify-content: flex-end; 339 -webkit-justify-content: flex-end;
340 /* Put menus in a box so the order can easily be swapped. */ 340 /* Put menus in a box so the order can easily be swapped. */
341 display: -webkit-flex; 341 display: -webkit-flex;
342 height: 100%; 342 height: 100%;
(...skipping 10 matching lines...) Expand all
353 padding: 0; 353 padding: 0;
354 } 354 }
355 355
356 .other-sessions-promo-message:only-child { 356 .other-sessions-promo-message:only-child {
357 display: block; 357 display: block;
358 } 358 }
359 359
360 .other-sessions-promo-message p { 360 .other-sessions-promo-message p {
361 margin: 0; 361 margin: 0;
362 } 362 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698