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
6body {
7  background-color: rgba(0, 0, 0, 0.05);
8  font-family: sans-serif;
9  font-size: 14px;
10  margin: 20px;
11}
12
13#fileSystems,
14#requestEvents,
15#requestTimeline {
16  background-color: white;
17  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
18  margin-bottom: 20px;
19}
20
21#fileSystems table,
22#requestEvents table {
23  border-collapse: collapse;
24  width: 100%;
25}
26
27#fileSystems th,
28#requestEvents th {
29  height: 30px;
30}
31
32#fileSystems .message {
33  border-top: 1px solid #eee;
34}
35
36#fileSystems td {
37  border-top: 1px solid #eee;
38  height: 40px;
39  line-height: 24px;
40  text-align: center;
41}
42
43#fileSystems td .icon {
44  display: inline-block;
45  height: 24px;
46  vertical-align: middle;
47  width: 24px;
48}
49
50#fileSystems tbody tr {
51  cursor: pointer;
52}
53
54#fileSystems tbody tr:active td {
55  background-color: #eee;
56}
57
58#requestEvents {
59  font-size: 12px;
60}
61
62#requestEvents td {
63  padding: 8px;
64  text-align: center;
65  vertical-align: top;
66}
67
68#requestEvents td {
69  border-top: 1px solid #eee;
70}
71
72#requestEvents td span {
73  border-radius: 5px;
74  padding: 3px;
75}
76
77#requestTimeline {
78  min-height: 30px;
79  position: relative;
80  width: 100%;
81}
82
83#requestTimeline .request-timeline-scroller {
84  overflow-x: auto;
85  overflow-y: hidden;
86  width: 100%;
87}
88
89#requestTimeline .request-timeline-padding {
90  margin: 20px 10px;
91  position: relative;
92}
93
94#requestTimeline .request-timeline-request {
95  border: none;
96  border-radius: 4px;
97  height: 8px;
98  margin: 3px 0;
99  min-width: 1px;
100  padding: 0;
101  position: absolute;
102  text-align: start;
103}
104
105#requestTimeline .request-timeline-request.selected {
106  box-shadow: 0 0 3px 1px deepskyblue;
107}
108
109#requestTimeline .request-timeline-request-overhead {
110  background-image: -webkit-canvas(dashedPattern);
111  border-radius: 4px;
112  height: 100%;
113  width: 50%;
114}
115
116#requestTimeline .request-timeline-request-value-size {
117  background-color: ivory;
118  box-shadow: 0 1px 1px 0 silver;
119  color: black;
120  display: inline-block;
121  font-size: 10px;
122  padding: 2px;
123  position: relative;
124  top: -30px;
125  z-index: 2;
126}
127
128#requestTimeline .request-timeline-toolbar {
129  display: flex;
130  justify-content: flex-end;
131  left: 0;
132  opacity: 0.75;
133  padding: 5px;
134  pointer-events: none;
135  position: absolute;
136  right: 0;
137  z-index: 3;
138}
139
140#requestTimeline .request-timeline-toolbar button {
141  background-color: #aaa;
142  border: none;
143  border-radius: 100%;
144  color: white;
145  min-height: 20px;
146  min-width: 20px;
147  pointer-events: auto;
148}
149
150#requestTimeline [data-request-type='REQUEST_UNMOUNT'],
151#requestEvents [data-request-type='REQUEST_UNMOUNT'] span {
152  background-color: cadetblue;
153  color: white;
154}
155
156#requestTimeline [data-request-type='GET_METADATA'],
157#requestEvents [data-request-type='GET_METADATA'] span {
158  background-color: orange;
159  color: white;
160}
161
162#requestTimeline [data-request-type='READ_DIRECTORY'],
163#requestEvents [data-request-type='READ_DIRECTORY'] span {
164  background-color: hotpink;
165  color: white;
166}
167
168#requestTimeline [data-request-type='OPEN_FILE'],
169#requestEvents [data-request-type='OPEN_FILE'] span {
170  background-color: darkturquoise;
171  color: white;
172}
173
174#requestTimeline [data-request-type='CLOSE_FILE'],
175#requestEvents [data-request-type='CLOSE_FILE'] span {
176  background-color: mediumspringgreen;
177}
178
179#requestTimeline [data-request-type='READ_FILE'],
180#requestEvents [data-request-type='READ_FILE'] span {
181  background-color: royalblue;
182  color: white;
183}
184
185#requestTimeline [data-state='rejected'],
186#requestEvents [data-error]:not([data-error='']) span {
187  background-color: tomato;
188  color: white;
189}
190