1/* Copyright (c) 2013 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#outer,
6#empty,
7#open-folder,
8.file-url,
9.time-left,
10.more-left {
11  display: inline-block;
12}
13
14#q-outer {
15  display:inline-block;
16  height:1.7em;
17  overflow:hidden;
18}
19
20#q {
21  margin-right: 2em;
22}
23
24#head {
25  position: fixed;
26  z-index: 2;
27  width: 100%;
28  left: 0;
29  top: 0;
30  background: white;
31  border-bottom: 1px solid grey;
32}
33
34#search-zero,
35#items {
36  margin-top: 2em;
37}
38
39#head,
40#empty,
41#searching,
42#search-zero,
43.item,
44.start-time,
45.complete-size,
46.error,
47.file-url-head,
48.removed,
49.open-filename,
50.progress,
51.time-left,
52.url,
53#text-width-probe {
54  white-space: nowrap;
55}
56
57#head,
58.item {
59  text-align: left;
60}
61
62#empty {
63  vertical-align: bottom;
64  height: 2em;
65}
66
67#q {
68  margin-left: 3%;
69}
70
71.by-ext img,
72svg {
73  width: 2em;
74  height: 2em;
75}
76
77svg rect.border {
78  fill-opacity: 0;
79  stroke-width: 6;
80}
81
82#open-folder svg,
83.show-folder svg {
84  stroke: brown;
85  fill: white;
86  stroke-width: 3;
87}
88
89#clear-all svg {
90  fill: white;
91  stroke-width: 3;
92}
93
94#clear-all svg,
95.remove-file svg,
96.erase svg {
97  stroke: black;
98}
99
100#older,
101#loading-older,
102.item {
103  margin-top: 1em;
104}
105
106.more {
107  position: absolute;
108  border: 1px solid grey;
109  background: white;
110  z-index: 3;
111}
112
113.complete-size,
114.error,
115.removed,
116.open-filename,
117.progress,
118.time-left {
119  margin-right: 0.4em;
120}
121
122.error {
123  color: darkred;
124}
125
126.referrer svg {
127  stroke: blue;
128  fill-opacity: 0;
129  stroke-width: 7;
130}
131
132.removed,
133.open-filename {
134  max-width: 400px;
135  overflow: hidden;
136  display: inline-block;
137}
138
139.remove-file svg {
140  fill-opacity: 0;
141  stroke-width: 5;
142}
143
144.remove-file svg line {
145  stroke-width: 7;
146  stroke: red;
147}
148
149.erase svg ellipse,
150.erase svg line {
151  fill-opacity: 0;
152  stroke-width: 5;
153}
154
155.pause svg {
156  stroke: #333;
157}
158
159.resume svg {
160  stroke: rgb(68, 187, 68);
161  fill: rgb(68, 187, 68);
162}
163
164.cancel svg line {
165  stroke-width: 7;
166}
167
168.cancel svg {
169  stroke: rgb(204, 68, 68);
170}
171
172.meter {
173  height: 0.5em;
174  position: relative;
175  background: grey;
176}
177
178.meter > span {
179  display: block;
180  height: 100%;
181  background-color: rgb(43, 194, 83);
182  background-image: -webkit-gradient(
183    linear, left bottom, left top,
184    color-stop(0, rgb(43,194,83)),
185    color-stop(1, rgb(84,240,84)));
186  position: relative;
187  overflow: hidden;
188}
189
190.meter > span:after {
191  content: '';
192  position: absolute;
193  top: 0; left: 0; bottom: 0; right: 0;
194  background-image: -webkit-gradient(
195    linear, 0 0, 100% 100%,
196    color-stop(.25, rgba(255, 255, 255, .2)),
197    color-stop(.25, transparent),
198    color-stop(.5, transparent),
199    color-stop(.5, rgba(255, 255, 255, .2)),
200    color-stop(.75, rgba(255, 255, 255, .2)),
201    color-stop(.75, transparent),
202    to(transparent));
203  z-index: 1;
204  -webkit-background-size: 50px 50px;
205  background-size: 50px 50px;
206  -webkit-animation: move 2s linear infinite;
207  overflow: hidden;
208}
209
210@-webkit-keyframes move {
211  0% { background-position: 0 0; }
212  100% { background-position: 50px 50px; }
213}
214
215.url {
216  color: grey;
217  max-width: 700px;
218  overflow: hidden;
219  display: block;
220}
221
222#text-width-probe {
223  position: absolute;
224  top: -100px;
225  left: 0;
226}
227