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, 72 svg { 73 width: 2em; 74 height: 2em; 75 } 76 77 svg 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