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 |