| OLD | NEW |
| 1 /* Copyright 2016 The Chromium Authors. All rights reserved. | 1 /* Copyright 2016 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 :root { | 6 :root { |
| 7 --fade-duration: 225ms; | 7 --fade-duration: 225ms; |
| 8 --header-height: 48px; |
| 8 --md-timing-function: cubic-bezier(.4, 0, .6, 1); | 9 --md-timing-function: cubic-bezier(.4, 0, .6, 1); |
| 9 --sidebar-width: 155px; | 10 --sidebar-width: 155px; |
| 10 --sidebar-neg-width: calc(var(--sidebar-width) * -1); | 11 --sidebar-neg-width: calc(var(--sidebar-width) * -1); |
| 11 } | 12 } |
| 12 | 13 |
| 13 html, | 14 html, |
| 14 body { | 15 body { |
| 15 margin: 0; | 16 margin: 0; |
| 16 padding: 0; | 17 padding: 0; |
| 17 } | 18 } |
| (...skipping 11 matching lines...) Expand all Loading... |
| 29 #page-container { | 30 #page-container { |
| 30 -webkit-margin-start: 0; | 31 -webkit-margin-start: 0; |
| 31 } | 32 } |
| 32 } | 33 } |
| 33 | 34 |
| 34 /* Page content */ | 35 /* Page content */ |
| 35 #page-container section { | 36 #page-container section { |
| 36 padding: 24px 16px; | 37 padding: 24px 16px; |
| 37 } | 38 } |
| 38 | 39 |
| 40 #page-container .header-extras { |
| 41 -webkit-margin-end: 16px; |
| 42 -webkit-margin-start: var(--sidebar-width); |
| 43 align-items: flex-end; |
| 44 display: flex; |
| 45 height: var(--header-height); |
| 46 justify-content: flex-end; |
| 47 left: 0; |
| 48 position: fixed; |
| 49 right: 0; |
| 50 top: 0; |
| 51 } |
| 52 |
| 39 /* Page header */ | 53 /* Page header */ |
| 40 .page-header { | 54 .page-header { |
| 41 align-items: center; | 55 align-items: center; |
| 42 background-color: white; | 56 background-color: white; |
| 43 border-bottom: 1px solid #eee; | 57 border-bottom: 1px solid #eee; |
| 44 display: flex; | 58 display: flex; |
| 45 height: 48px; | 59 height: var(--header-height); |
| 46 padding-top: 8px; | 60 padding-top: 8px; |
| 47 position: sticky; | 61 position: sticky; |
| 48 top: 0; | 62 top: 0; |
| 49 } | 63 } |
| 50 | 64 |
| 51 .page-header > h1 { | 65 .page-header > h1 { |
| 52 margin: 13px 0; | 66 margin: 13px 0; |
| 53 } | 67 } |
| 54 | 68 |
| 55 #menu-btn { | 69 #menu-btn { |
| (...skipping 221 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 277 | 291 |
| 278 .snackbar.error { | 292 .snackbar.error { |
| 279 background-color: rgb(244, 67, 54); | 293 background-color: rgb(244, 67, 54); |
| 280 } | 294 } |
| 281 | 295 |
| 282 .snackbar.open { | 296 .snackbar.open { |
| 283 opacity: 1; | 297 opacity: 1; |
| 284 transform: translate3d(0, 0, 0); | 298 transform: translate3d(0, 0, 0); |
| 285 visibility: visible; | 299 visibility: visible; |
| 286 } | 300 } |
| OLD | NEW |