1* {
2  margin: 0;
3  padding: 0;
4  box-sizing: border-box;
5}
6html, body {
7  height: 100%;
8}
9body {
10  font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
11  font-size: 13px;
12  line-height: 1.4;
13  display: flex;
14  flex-direction: column;
15}
16a {
17  color: #2a66d9;
18}
19.header {
20  display: flex;
21  align-items: center;
22  height: 44px;
23  min-height: 44px;
24  background-color: #eee;
25  color: #212121;
26  padding: 0 1rem;
27}
28.header > div {
29  margin: 0 0.125em;
30}
31.header .title h1 {
32  font-size: 1.75em;
33  margin-right: 1rem;
34  margin-bottom: 4px;
35}
36.header .title a {
37  color: #212121;
38  text-decoration: none;
39}
40.header .title a:hover {
41  text-decoration: underline;
42}
43.header .description {
44  width: 100%;
45  text-align: right;
46  white-space: nowrap;
47}
48@media screen and (max-width: 799px) {
49  .header input {
50    display: none;
51  }
52}
53#detailsbox {
54  display: none;
55  z-index: 1;
56  position: fixed;
57  top: 40px;
58  right: 20px;
59  background-color: #ffffff;
60  box-shadow: 0 1px 5px rgba(0,0,0,.3);
61  line-height: 24px;
62  padding: 1em;
63  text-align: left;
64}
65.header input {
66  background: white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' style='pointer-events:none;display:block;width:100%25;height:100%25;fill:%23757575'%3E%3Cpath d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61.0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E") no-repeat 4px center/20px 20px;
67  border: 1px solid #d1d2d3;
68  border-radius: 2px 0 0 2px;
69  padding: 0.25em;
70  padding-left: 28px;
71  margin-left: 1em;
72  font-family: 'Roboto', 'Noto', sans-serif;
73  font-size: 1em;
74  line-height: 24px;
75  color: #212121;
76}
77.downArrow {
78  border-top: .36em solid #ccc;
79  border-left: .36em solid transparent;
80  border-right: .36em solid transparent;
81  margin-bottom: .05em;
82  margin-left: .5em;
83  transition: border-top-color 200ms;
84}
85.menu-item {
86  height: 100%;
87  text-transform: uppercase;
88  font-family: 'Roboto Medium', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
89  position: relative;
90}
91.menu-item .menu-name:hover {
92  opacity: 0.75;
93}
94.menu-item .menu-name:hover .downArrow {
95  border-top-color: #666;
96}
97.menu-name {
98  height: 100%;
99  padding: 0 0.5em;
100  display: flex;
101  align-items: center;
102  justify-content: center;
103}
104.menu-name a {
105  text-decoration: none;
106  color: #212121;
107}
108.submenu {
109  display: none;
110  z-index: 1;
111  margin-top: -4px;
112  min-width: 10em;
113  position: absolute;
114  left: 0px;
115  background-color: white;
116  box-shadow: 0 1px 5px rgba(0,0,0,.3);
117  font-size: 100%;
118  text-transform: none;
119  white-space: nowrap;
120}
121.menu-item, .submenu {
122  user-select: none;
123  -moz-user-select: none;
124  -ms-user-select: none;
125  -webkit-user-select: none;
126}
127.submenu hr {
128  border: 0;
129  border-top: 2px solid #eee;
130}
131.submenu a {
132  display: block;
133  padding: .5em 1em;
134  text-decoration: none;
135}
136.submenu a:hover, .submenu a.active {
137  color: white;
138  background-color: #6b82d6;
139}
140.submenu a.disabled {
141  color: gray;
142  pointer-events: none;
143}
144.menu-check-mark {
145  position: absolute;
146  left: 2px;
147}
148.menu-delete-btn {
149  position: absolute;
150  right: 2px;
151}
152
153{{/* Used to disable events when a modal dialog is displayed */}}
154#dialog-overlay {
155  display: none;
156  position: fixed;
157  left: 0px;
158  top: 0px;
159  width: 100%;
160  height: 100%;
161  background-color: rgba(1,1,1,0.1);
162}
163
164.dialog {
165  {{/* Displayed centered horizontally near the top */}}
166  display: none;
167  position: fixed;
168  margin: 0px;
169  top: 60px;
170  left: 50%;
171  transform: translateX(-50%);
172
173  z-index: 3;
174  font-size: 125%;
175  background-color: #ffffff;
176  box-shadow: 0 1px 5px rgba(0,0,0,.3);
177}
178.dialog-header {
179  font-size: 120%;
180  border-bottom: 1px solid #CCCCCC;
181  width: 100%;
182  text-align: center;
183  background: #EEEEEE;
184  user-select: none;
185}
186.dialog-footer {
187  border-top: 1px solid #CCCCCC;
188  width: 100%;
189  text-align: right;
190  padding: 10px;
191}
192.dialog-error {
193  margin: 10px;
194  color: red;
195}
196.dialog input {
197  margin: 10px;
198  font-size: inherit;
199}
200.dialog button {
201  margin-left: 10px;
202  font-size: inherit;
203}
204#save-dialog, #delete-dialog {
205  width: 50%;
206  max-width: 20em;
207}
208#delete-prompt {
209  padding: 10px;
210}
211
212#content {
213  overflow-y: scroll;
214  padding: 1em;
215}
216#top {
217  overflow-y: scroll;
218}
219#graph {
220  overflow: hidden;
221}
222#graph svg {
223  width: 100%;
224  height: auto;
225  padding: 10px;
226}
227#content.source .filename {
228  margin-top: 0;
229  margin-bottom: 1em;
230  font-size: 120%;
231}
232#content.source pre {
233  margin-bottom: 3em;
234}
235table {
236  border-spacing: 0px;
237  width: 100%;
238  padding-bottom: 1em;
239  white-space: nowrap;
240}
241table thead {
242  font-family: 'Roboto Medium', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
243}
244table tr th {
245  position: sticky;
246  top: 0;
247  background-color: #ddd;
248  text-align: right;
249  padding: .3em .5em;
250}
251table tr td {
252  padding: .3em .5em;
253  text-align: right;
254}
255#top table tr th:nth-child(6),
256#top table tr th:nth-child(7),
257#top table tr td:nth-child(6),
258#top table tr td:nth-child(7) {
259  text-align: left;
260}
261#top table tr td:nth-child(6) {
262  width: 100%;
263  text-overflow: ellipsis;
264  overflow: hidden;
265  white-space: nowrap;
266}
267#flathdr1, #flathdr2, #cumhdr1, #cumhdr2, #namehdr {
268  cursor: ns-resize;
269}
270.hilite {
271  background-color: #ebf5fb;
272  font-weight: bold;
273}
274