OLD | NEW |
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 * { |
| 6 box-sizing: border-box; |
| 7 } |
| 8 |
5 body { | 9 body { |
6 color: rgb(48, 57, 66); | 10 color: rgb(48, 57, 66); |
7 font-size: 13px; | 11 font-size: 13px; |
8 margin: 0; | 12 margin: 0; |
9 min-width: 47em; | 13 min-width: 47em; |
10 padding: 20px 20px 65px 0; | |
11 } | 14 } |
12 | 15 |
13 .hidden { | 16 .hidden { |
14 display: none !important; | 17 display: none !important; |
15 } | 18 } |
16 | 19 |
17 img { | 20 img { |
18 flex-shrink: 0; | 21 flex-shrink: 0; |
19 height: 16px; | 22 height: 16px; |
20 padding-left: 2px; | 23 padding-left: 2px; |
21 padding-right: 5px; | 24 padding-right: 5px; |
22 vertical-align: top; | 25 vertical-align: top; |
23 width: 16px; | 26 width: 23px; |
24 } | 27 } |
25 | 28 |
26 #container { | 29 #container { |
27 -webkit-flex-direction: row; | 30 -webkit-flex-direction: row; |
28 display: -webkit-flex; | 31 display: -webkit-flex; |
29 } | 32 } |
30 | 33 |
31 #navigation { | 34 #navigation { |
| 35 max-height: 100vh; |
| 36 overflow: auto; |
| 37 padding-top: 20px; |
32 width: 150px; | 38 width: 150px; |
33 } | 39 } |
34 | 40 |
35 #content { | 41 #content { |
36 -webkit-flex: 1; | 42 -webkit-flex: 1; |
| 43 max-height: 100vh; |
| 44 overflow: auto; |
37 } | 45 } |
38 | 46 |
39 #caption { | 47 #caption { |
40 color: rgb(92, 97, 102); | 48 color: rgb(92, 97, 102); |
41 font-size: 150%; | 49 font-size: 150%; |
42 padding-bottom: 10px; | 50 padding-bottom: 10px; |
43 padding-left: 20px; | 51 padding-left: 20px; |
44 } | 52 } |
45 | 53 |
46 #serviceworker-internals { | 54 #serviceworker-internals { |
(...skipping 16 matching lines...) Expand all Loading... |
63 font: inherit; | 71 font: inherit; |
64 line-height: 17px; | 72 line-height: 17px; |
65 margin: 6px 0; | 73 margin: 6px 0; |
66 padding: 0 2px; | 74 padding: 0 2px; |
67 } | 75 } |
68 | 76 |
69 .tab-header:not(.selected) > button { | 77 .tab-header:not(.selected) > button { |
70 color: #999; | 78 color: #999; |
71 } | 79 } |
72 | 80 |
| 81 #content > div { |
| 82 padding: 54px 20px 65px 0; |
| 83 } |
73 #content > div:not(.selected) { | 84 #content > div:not(.selected) { |
74 display: none; | 85 display: none; |
75 } | 86 } |
76 | 87 |
77 .content-header { | 88 .content-header { |
| 89 background: linear-gradient(white, white 40%, rgba(255, 255, 255, 0.92)); |
78 border-bottom: 1px solid #eee; | 90 border-bottom: 1px solid #eee; |
79 font-size: 150%; | 91 font-size: 150%; |
80 padding-bottom: 10px; | 92 left: 150px; |
| 93 padding: 20px 0 10px 0; |
| 94 position: fixed; |
| 95 right: 20px; |
| 96 top: 0; |
| 97 z-index: 1; |
81 } | 98 } |
82 | 99 |
83 #devices-help { | 100 #devices-help { |
84 margin-top: 10px; | 101 margin-top: 10px; |
85 } | 102 } |
86 | 103 |
87 .device-header { | 104 .device-header { |
88 -webkit-box-align: baseline; | 105 -webkit-box-align: baseline; |
89 -webkit-box-orient: horizontal; | 106 -webkit-box-orient: horizontal; |
90 display: -webkit-box; | 107 display: -webkit-box; |
(...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
133 | 150 |
134 .port-number { | 151 .port-number { |
135 height: 16px; | 152 height: 16px; |
136 margin-right: 5px; | 153 margin-right: 5px; |
137 } | 154 } |
138 | 155 |
139 .browser-header { | 156 .browser-header { |
140 align-items: center; | 157 align-items: center; |
141 display: flex; | 158 display: flex; |
142 flex-flow: row wrap; | 159 flex-flow: row wrap; |
143 min-height: 23px; | 160 min-height: 33px; |
144 padding-top: 10px; | 161 padding-top: 10px; |
145 } | 162 } |
146 | 163 |
147 .browser-header > .browser-name { | 164 .browser-header > .browser-name { |
148 font-size: 110%; | 165 font-size: 110%; |
149 font-weight: bold; | 166 font-weight: bold; |
150 } | 167 } |
151 | 168 |
152 .browser-header > .browser-user { | 169 .browser-header > .browser-user { |
153 color: #999; | 170 color: #999; |
(...skipping 248 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
402 } | 419 } |
403 | 420 |
404 #port-forwarding-config-buttons { | 421 #port-forwarding-config-buttons { |
405 align-items: center; | 422 align-items: center; |
406 display: flex; | 423 display: flex; |
407 } | 424 } |
408 | 425 |
409 #port-forwarding-config-buttons > label { | 426 #port-forwarding-config-buttons > label { |
410 flex-grow: 1 | 427 flex-grow: 1 |
411 } | 428 } |
OLD | NEW |