| OLD | NEW |
| (Empty) |
| 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 | |
| 3 * found in the LICENSE file. */ | |
| 4 | |
| 5 input:focus, | |
| 6 button:focus { | |
| 7 outline-color: rgb(77, 144, 254); | |
| 8 } | |
| 9 | |
| 10 .action-choice { | |
| 11 -webkit-box-align: center; | |
| 12 -webkit-box-pack: center; | |
| 13 -webkit-user-select: none; | |
| 14 background: white; | |
| 15 bottom: 0; | |
| 16 color: black; | |
| 17 display: -webkit-box; | |
| 18 font-family: Open Sans, Droid Sans Fallback, sans-serif; | |
| 19 font-size: 84%; | |
| 20 left: 0; | |
| 21 margin: 0; | |
| 22 overflow: hidden; | |
| 23 padding: 10px; | |
| 24 position: absolute; | |
| 25 right: 0; | |
| 26 top: 0; | |
| 27 } | |
| 28 | |
| 29 .action-choice[loading] .content, | |
| 30 .action-choice:not([loading]) .loading { | |
| 31 display: none; | |
| 32 } | |
| 33 | |
| 34 .action-choice h1 { | |
| 35 font-size: 14px; | |
| 36 font-weight: normal; | |
| 37 line-height: 1.5; | |
| 38 margin: 5px 3px; | |
| 39 } | |
| 40 | |
| 41 /* The loading preview */ | |
| 42 | |
| 43 .loading { | |
| 44 -webkit-box-align: center; | |
| 45 -webkit-box-orient: vertical; | |
| 46 color: #333; | |
| 47 display: -webkit-box; | |
| 48 font-size: 12px; | |
| 49 } | |
| 50 | |
| 51 .spinner { | |
| 52 background-image: url('../images/common/spinner.svg'); | |
| 53 background-size: 100%; | |
| 54 height: 21px; | |
| 55 left: 44px; | |
| 56 margin-left: -10px; | |
| 57 margin-top: -10px; | |
| 58 opacity: 0.5; | |
| 59 position: absolute; | |
| 60 top: 29px; | |
| 61 width: 21px; | |
| 62 } | |
| 63 | |
| 64 .device-type { | |
| 65 height: 64px; | |
| 66 position: relative; | |
| 67 width: 116px; | |
| 68 } | |
| 69 | |
| 70 .device-type[device-type=usb] { | |
| 71 background-image: -webkit-image-set( | |
| 72 url('../images/volumes/device_usb_large.png') 1x, | |
| 73 url('../images/volumes/2x/device_usb_large.png') 2x); | |
| 74 } | |
| 75 | |
| 76 .device-type[device-type=sd] { | |
| 77 -webkit-transform: rotate(-90deg); | |
| 78 background-image: -webkit-image-set( | |
| 79 url('../images/volumes/device_sd_large.png') 1x, | |
| 80 url('../images/volumes/2x/device_sd_large.png') 2x); | |
| 81 bottom: 10px; /* Adjust the rotated image to not overlap with element below */ | |
| 82 } | |
| 83 | |
| 84 /* The action choice content */ | |
| 85 | |
| 86 .content { | |
| 87 -webkit-box-align: start; | |
| 88 -webkit-box-orient: vertical; | |
| 89 display: -webkit-box; | |
| 90 height: 100%; | |
| 91 overflow: hidden; | |
| 92 position: relative; | |
| 93 width: 100%; | |
| 94 } | |
| 95 | |
| 96 .previews { | |
| 97 -webkit-box-orient: horizontal; | |
| 98 -webkit-mask-image: linear-gradient(to left, rgba(0, 0, 0, 0) 0, | |
| 99 rgba(0, 0, 0, 1) 80px); | |
| 100 display: -webkit-box; | |
| 101 position: relative; | |
| 102 width: 100%; | |
| 103 } | |
| 104 | |
| 105 .img-container { | |
| 106 height: 120px; | |
| 107 margin: 0 2px; | |
| 108 overflow: hidden; | |
| 109 position: relative; | |
| 110 width: 120px; | |
| 111 } | |
| 112 | |
| 113 .img-container > img { | |
| 114 -webkit-user-drag: none; | |
| 115 position: absolute; | |
| 116 } | |
| 117 | |
| 118 .counter { | |
| 119 color: #808080; | |
| 120 margin: 5px 3px; | |
| 121 width: 100%; | |
| 122 } | |
| 123 | |
| 124 .choices { | |
| 125 width: 100%; | |
| 126 } | |
| 127 | |
| 128 /* Padding counterweights negative margins of items, thus eliminating scroll | |
| 129 bar when it's not needed. Max height is set to fit 8 items before showing | |
| 130 scroll bar. */ | |
| 131 #actions-list { | |
| 132 display: block; | |
| 133 max-height: 328px; | |
| 134 outline: none; | |
| 135 overflow: auto; | |
| 136 padding: 1px 0; | |
| 137 position: relative; | |
| 138 } | |
| 139 | |
| 140 #actions-list > li { | |
| 141 cursor: default; | |
| 142 list-style-type: none; | |
| 143 } | |
| 144 | |
| 145 #actions-list > li > div { | |
| 146 background-position: 5px center; | |
| 147 background-repeat: no-repeat; | |
| 148 line-height: 39px; | |
| 149 padding-left: 43px; | |
| 150 } | |
| 151 | |
| 152 #actions-list > [selected] { | |
| 153 background-color: #dedede; | |
| 154 } | |
| 155 | |
| 156 #actions-list:focus > [selected] { | |
| 157 background-color: rgb(203, 219, 241); | |
| 158 } | |
| 159 | |
| 160 #actions-list > [selected]:hover { | |
| 161 background-color: rgb(193, 211, 236); | |
| 162 border-color: hsl(214, 91%, 85%); | |
| 163 } | |
| 164 | |
| 165 #actions-list > :hover { | |
| 166 background-color: #f1f1f1; | |
| 167 border-color: hsl(214, 91%, 85%); | |
| 168 } | |
| 169 | |
| 170 #actions-list > li > div.disabled { | |
| 171 opacity: 0.5; | |
| 172 } | |
| OLD | NEW |