Home | History | Annotate | Download | only in css
      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 /* Small icons for file types, used in lists and menus. */
      6 [file-type-icon] {
      7   background-image: -webkit-image-set(
      8       url('../images/files/file_types/100/generic.png') 1x,
      9       url('../images/files/file_types/200/generic.png') 2x);
     10   background-position: center;
     11   background-repeat: no-repeat;
     12 }
     13 
     14 tree:focus .tree-item[selected] > .tree-row > [file-type-icon],
     15 list:focus [selected] [file-type-icon],
     16 list.autocomplete-suggestions [selected] [file-type-icon] {
     17   background-image: -webkit-image-set(
     18     url('../images/files/file_types/100/generic_white.png') 1x,
     19     url('../images/files/file_types/200/generic_white.png') 2x);
     20 }
     21 
     22 [file-type-icon='archive'] {
     23   background-image: -webkit-image-set(
     24     url('../images/files/file_types/100/archive.png') 1x,
     25     url('../images/files/file_types/200/archive.png') 2x);
     26 }
     27 
     28 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='archive'],
     29 list:focus [selected] [file-type-icon='archive'],
     30 list.autocomplete-suggestions [selected] [file-type-icon='archive'] {
     31   background-image: -webkit-image-set(
     32     url('../images/files/file_types/100/archive_white.png') 1x,
     33     url('../images/files/file_types/200/archive_white.png') 2x);
     34 }
     35 
     36 [file-type-icon='audio'] {
     37   background-image: -webkit-image-set(
     38     url('../images/files/file_types/100/audio.png') 1x,
     39     url('../images/files/file_types/200/audio.png') 2x);
     40 }
     41 
     42 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='audio'],
     43 list:focus [selected] [file-type-icon='audio'],
     44 list.autocomplete-suggestions [selected] [file-type-icon='audio'] {
     45   background-image: -webkit-image-set(
     46     url('../images/files/file_types/100/audio_white.png') 1x,
     47     url('../images/files/file_types/200/audio_white.png') 2x);
     48 }
     49 
     50 [file-type-icon='excel'] {
     51   background-image: -webkit-image-set(
     52     url('../images/files/file_types/100/excel.png') 1x,
     53     url('../images/files/file_types/200/excel.png') 2x);
     54 }
     55 
     56 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='excel'],
     57 list:focus [selected] [file-type-icon='excel'],
     58 list.autocomplete-suggestions [selected] [file-type-icon='excel'] {
     59   background-image: -webkit-image-set(
     60     url('../images/files/file_types/100/excel_white.png') 1x,
     61     url('../images/files/file_types/200/excel_white.png') 2x);
     62 }
     63 
     64 [file-type-icon='folder'] {
     65   background-image: -webkit-image-set(
     66     url('../images/files/file_types/100/folder.png') 1x,
     67     url('../images/files/file_types/200/folder.png') 2x);
     68 }
     69 
     70 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='folder'],
     71 list:focus [selected] [file-type-icon='folder'],
     72 list.autocomplete-suggestions [selected] [file-type-icon='folder'] {
     73   background-image: -webkit-image-set(
     74     url('../images/files/file_types/100/folder_white.png') 1x,
     75     url('../images/files/file_types/200/folder_white.png') 2x);
     76 }
     77 
     78 [file-type-icon='form'] {
     79   background-image: -webkit-image-set(
     80     url('../images/files/file_types/100/form.png') 1x,
     81     url('../images/files/file_types/200/form.png') 2x);
     82 }
     83 
     84 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='form'],
     85 list:focus [selected] [file-type-icon='form'],
     86 list.autocomplete-suggestions [selected] [file-type-icon='form'] {
     87   background-image: -webkit-image-set(
     88     url('../images/files/file_types/100/form_white.png') 1x,
     89     url('../images/files/file_types/200/form_white.png') 2x);
     90 }
     91 
     92 [file-type-icon='gdoc'] {
     93   background-image: -webkit-image-set(
     94     url('../images/files/file_types/100/gdoc.png') 1x,
     95     url('../images/files/file_types/200/gdoc.png') 2x);
     96 }
     97 
     98 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='gdoc'],
     99 list:focus [selected] [file-type-icon='gdoc'],
    100 list.autocomplete-suggestions [selected] [file-type-icon='gdoc'] {
    101   background-image: -webkit-image-set(
    102     url('../images/files/file_types/100/gdoc_white.png') 1x,
    103     url('../images/files/file_types/200/gdoc_white.png') 2x);
    104 }
    105 
    106 [file-type-icon='gdraw'] {
    107   background-image: -webkit-image-set(
    108     url('../images/files/file_types/100/gdraw.png') 1x,
    109     url('../images/files/file_types/200/gdraw.png') 2x);
    110 }
    111 
    112 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='gdraw'],
    113 list:focus [selected] [file-type-icon='gdraw'],
    114 list.autocomplete-suggestions [selected] [file-type-icon='gdraw'] {
    115   background-image: -webkit-image-set(
    116     url('../images/files/file_types/100/gdraw_white.png') 1x,
    117     url('../images/files/file_types/200/gdraw_white.png') 2x);
    118 }
    119 
    120 [file-type-icon='glink'] {
    121   background-image: -webkit-image-set(
    122     url('../images/files/file_types/100/glink.png') 1x,
    123     url('../images/files/file_types/200/glink.png') 2x);
    124 }
    125 
    126 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='glink'],
    127 list:focus [selected] [file-type-icon='glink'],
    128 list.autocomplete-suggestions [selected] [file-type-icon='glink'] {
    129   background-image: -webkit-image-set(
    130     url('../images/files/file_types/100/glink_white.png') 1x,
    131     url('../images/files/file_types/200/glink_white.png') 2x);
    132 }
    133 
    134 [file-type-icon='gsheet'] {
    135   background-image: -webkit-image-set(
    136     url('../images/files/file_types/100/gsheet.png') 1x,
    137     url('../images/files/file_types/200/gsheet.png') 2x);
    138 }
    139 
    140 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='gsheet'],
    141 list:focus [selected] [file-type-icon='gsheet'],
    142 list.autocomplete-suggestions [selected] [file-type-icon='gsheet'] {
    143   background-image: -webkit-image-set(
    144     url('../images/files/file_types/100/gsheet_white.png') 1x,
    145     url('../images/files/file_types/200/gsheet_white.png') 2x);
    146 }
    147 
    148 [file-type-icon='gslides'] {
    149   background-image: -webkit-image-set(
    150     url('../images/files/file_types/100/gslides.png') 1x,
    151     url('../images/files/file_types/200/gslides.png') 2x);
    152 }
    153 
    154 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='gslides'],
    155 list:focus [selected] [file-type-icon='gslides'],
    156 list.autocomplete-suggestions [selected] [file-type-icon='gslides'] {
    157   background-image: -webkit-image-set(
    158     url('../images/files/file_types/100/gslides_white.png') 1x,
    159     url('../images/files/file_types/200/gslides_white.png') 2x);
    160 }
    161 
    162 [file-type-icon='gtable'] {
    163   background-image: -webkit-image-set(
    164     url('../images/files/file_types/100/gtable.png') 1x,
    165     url('../images/files/file_types/200/gtable.png') 2x);
    166 }
    167 
    168 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='gtable'],
    169 list:focus [selected] [file-type-icon='gtable'],
    170 list.autocomplete-suggestions [selected] [file-type-icon='gtable'] {
    171   background-image: -webkit-image-set(
    172     url('../images/files/file_types/100/gtable_white.png') 1x,
    173     url('../images/files/file_types/200/gtable_white.png') 2x);
    174 }
    175 
    176 [file-type-icon='image'] {
    177   background-image: -webkit-image-set(
    178     url('../images/files/file_types/100/image.png') 1x,
    179     url('../images/files/file_types/200/image.png') 2x);
    180 }
    181 
    182 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='image'],
    183 list:focus [selected] [file-type-icon='image'],
    184 list.autocomplete-suggestions [selected] [file-type-icon='image'] {
    185   background-image: -webkit-image-set(
    186     url('../images/files/file_types/100/image_white.png') 1x,
    187     url('../images/files/file_types/200/image_white.png') 2x);
    188 }
    189 
    190 [file-type-icon='pdf'] {
    191   background-image: -webkit-image-set(
    192     url('../images/files/file_types/100/pdf.png') 1x,
    193     url('../images/files/file_types/200/pdf.png') 2x);
    194 }
    195 
    196 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='pdf'],
    197 list:focus [selected] [file-type-icon='pdf'],
    198 list.autocomplete-suggestions [selected] [file-type-icon='pdf'] {
    199   background-image: -webkit-image-set(
    200     url('../images/files/file_types/100/pdf_white.png') 1x,
    201     url('../images/files/file_types/200/pdf_white.png') 2x);
    202 }
    203 
    204 [file-type-icon='ppt'] {
    205   background-image: -webkit-image-set(
    206     url('../images/files/file_types/100/ppt.png') 1x,
    207     url('../images/files/file_types/200/ppt.png') 2x);
    208 }
    209 
    210 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='ppt'],
    211 list:focus [selected] [file-type-icon='ppt'],
    212 list.autocomplete-suggestions [selected] [file-type-icon='ppt'] {
    213   background-image: -webkit-image-set(
    214     url('../images/files/file_types/100/ppt_white.png') 1x,
    215     url('../images/files/file_types/200/ppt_white.png') 2x);
    216 }
    217 
    218 [file-type-icon='script'] {
    219   background-image: -webkit-image-set(
    220     url('../images/files/file_types/100/script.png') 1x,
    221     url('../images/files/file_types/200/script.png') 2x);
    222 }
    223 
    224 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='script'],
    225 list:focus [selected] [file-type-icon='script'],
    226 list.autocomplete-suggestions [selected] [file-type-icon='script'] {
    227   background-image: -webkit-image-set(
    228     url('../images/files/file_types/100/script_white.png') 1x,
    229     url('../images/files/file_types/200/script_white.png') 2x);
    230 }
    231 
    232 [file-type-icon='sites'] {
    233   background-image: -webkit-image-set(
    234     url('../images/files/file_types/100/sites.png') 1x,
    235     url('../images/files/file_types/200/sites.png') 2x);
    236 }
    237 
    238 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='sites'],
    239 list:focus [selected] [file-type-icon='sites'],
    240 list.autocomplete-suggestions [selected] [file-type-icon='sites'] {
    241   background-image: -webkit-image-set(
    242     url('../images/files/file_types/100/sites_white.png') 1x,
    243     url('../images/files/file_types/200/sites_white.png') 2x);
    244 }
    245 
    246 [file-type-icon='video'] {
    247   background-image: -webkit-image-set(
    248     url('../images/files/file_types/100/video.png') 1x,
    249     url('../images/files/file_types/200/video.png') 2x);
    250 }
    251 
    252 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='video'],
    253 list:focus [selected] [file-type-icon='video'],
    254 list.autocomplete-suggestions [selected] [file-type-icon='video'] {
    255   background-image: -webkit-image-set(
    256     url('../images/files/file_types/100/video_white.png') 1x,
    257     url('../images/files/file_types/200/video_white.png') 2x);
    258 }
    259 
    260 [file-type-icon='word'] {
    261   background-image: -webkit-image-set(
    262     url('../images/files/file_types/100/word.png') 1x,
    263     url('../images/files/file_types/200/word.png') 2x);
    264 }
    265 
    266 tree:focus .tree-item[selected] > .tree-row > [file-type-icon='word'],
    267 list:focus [selected] [file-type-icon='word'],
    268 list.autocomplete-suggestions [selected] [file-type-icon='word'] {
    269   background-image: -webkit-image-set(
    270     url('../images/files/file_types/100/word_white.png') 1x,
    271     url('../images/files/file_types/200/word_white.png') 2x);
    272 }
    273 
    274 [file-type-icon='drive'] {
    275   background-image: -webkit-image-set(
    276     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_DRIVE') 1x,
    277     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_DRIVE@2x') 2x);
    278 }
    279 
    280 /* Large generic thumbnails, used when a file does not have a thumbnail. */
    281 [generic-thumbnail] {
    282   background-image: -webkit-image-set(
    283     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_GENERIC') 1x,
    284     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_GENERIC@2x') 2x);
    285   background-position: center center;
    286   background-repeat: no-repeat;
    287 }
    288 
    289 [generic-thumbnail='audio'] {
    290   background-image: -webkit-image-set(
    291     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_AUDIO') 1x,
    292     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_AUDIO@2x') 2x);
    293 }
    294 
    295 [generic-thumbnail='folder'] {
    296   background-image: -webkit-image-set(
    297     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_FOLDER') 1x,
    298     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_FOLDER@2x') 2x);
    299 }
    300 
    301 [generic-thumbnail='image'] {
    302   background-image: -webkit-image-set(
    303     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_IMAGE') 1x,
    304     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_IMAGE@2x') 2x);
    305 }
    306 
    307 [generic-thumbnail='video'] {
    308   background-image: -webkit-image-set(
    309     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_VIDEO') 1x,
    310     url('chrome://theme/IDR_FILE_MANAGER_IMG_FILETYPE_LARGE_VIDEO@2x') 2x);
    311 }
    312 
    313 /* Icons for volume types. */
    314 
    315 [volume-type-icon='archive'] {
    316   background-image: -webkit-image-set(
    317     url('../images/files/volumes/black_archive.png') 1x,
    318     url('../images/files/volumes/2x/black_archive.png') 2x);
    319 }
    320 
    321 list:focus li[selected] [volume-type-icon='archive'],
    322 tree:focus .tree-item[selected] > .tree-row > [volume-type-icon='archive'] {
    323   background-image: -webkit-image-set(
    324     url('../images/files/volumes/white_archive.png') 1x,
    325     url('../images/files/volumes/2x/white_archive.png') 2x);
    326 }
    327 
    328 [volume-type-icon='downloads'] {
    329   background-image: -webkit-image-set(
    330     url('../images/files/volumes/black_downloads.png') 1x,
    331     url('../images/files/volumes/2x/black_downloads.png') 2x);
    332 }
    333 
    334 list:focus li[selected] [volume-type-icon='downloads'],
    335 tree:focus .tree-item[selected] > .tree-row > [volume-type-icon='downloads'] {
    336   background-image: -webkit-image-set(
    337     url('../images/files/volumes/white_downloads.png') 1x,
    338     url('../images/files/volumes/2x/white_downloads.png') 2x);
    339 }
    340 
    341 [volume-type-icon='drive'] {
    342   background-image: -webkit-image-set(
    343     url('../images/files/volumes/black_drive.png') 1x,
    344     url('../images/files/volumes/2x/black_drive.png') 2x);
    345 }
    346 
    347 list:focus li[selected] [volume-type-icon='drive'],
    348 tree:focus .tree-item[selected] > .tree-row > [volume-type-icon='drive'] {
    349   background-image: -webkit-image-set(
    350     url('../images/files/volumes/white_drive.png') 1x,
    351     url('../images/files/volumes/2x/white_drive.png') 2x);
    352 }
    353 
    354 [volume-type-icon='drive_offline'] {
    355   background-image: -webkit-image-set(
    356     url('../images/files/volumes/black_offline.png') 1x,
    357     url('../images/files/volumes/2x/black_offline.png') 2x);
    358 }
    359 
    360 list:focus li[selected] [volume-type-icon='drive_offline'],
    361 tree:focus .tree-item[selected] > .tree-row >
    362     [volume-type-icon='drive_offline'] {
    363   background-image: -webkit-image-set(
    364     url('../images/files/volumes/white_offline.png') 1x,
    365     url('../images/files/volumes/2x/white_offline.png') 2x);
    366 }
    367 
    368 [volume-type-icon='drive_shared_with_me'] {
    369   background-image: -webkit-image-set(
    370     url('../images/files/volumes/black_shared.png') 1x,
    371     url('../images/files/volumes/2x/black_shared.png') 2x);
    372 }
    373 
    374 list:focus li[selected] [volume-type-icon='drive_shared_with_me'],
    375 tree:focus .tree-item[selected] > .tree-row >
    376     [volume-type-icon='drive_shared_with_me'] {
    377   background-image: -webkit-image-set(
    378     url('../images/files/volumes/white_shared.png') 1x,
    379     url('../images/files/volumes/2x/white_shared.png') 2x);
    380 }
    381 
    382 [volume-type-icon='drive_recent'] {
    383   background-image: -webkit-image-set(
    384     url('../images/files/volumes/black_recent.png') 1x,
    385     url('../images/files/volumes/2x/black_recent.png') 2x);
    386 }
    387 
    388 list:focus li[selected] [volume-type-icon='drive_recent'],
    389 tree:focus .tree-item[selected] > .tree-row >
    390     [volume-type-icon='drive_recent'] {
    391   background-image: -webkit-image-set(
    392     url('../images/files/volumes/white_recent.png') 1x,
    393     url('../images/files/volumes/2x/white_recent.png') 2x);
    394 }
    395 
    396 [volume-type-icon='removable'] {
    397   background-image: -webkit-image-set(
    398     url('../images/files/volumes/black_usb.png') 1x,
    399     url('../images/files/volumes/2x/black_usb.png') 2x);
    400 }
    401 
    402 list:focus li[selected] [volume-type-icon='removable'],
    403 tree:focus .tree-item[selected] > .tree-row >
    404     [volume-type-icon='removable'] {
    405   background-image: -webkit-image-set(
    406     url('../images/files/volumes/white_usb.png') 1x,
    407     url('../images/files/volumes/2x/white_usb.png') 2x);
    408 }
    409 
    410 [volume-type-icon='removable'][volume-subtype='sd'] {
    411   background-image: -webkit-image-set(
    412     url('../images/files/volumes/black_sd.png') 1x,
    413     url('../images/files/volumes/2x/black_sd.png') 2x);
    414 }
    415 
    416 list:focus li[selected] [volume-type-icon='removable'][volume-subtype='sd'],
    417 tree:focus .tree-item[selected] > .tree-row >
    418     [volume-type-icon='removable'][volume-subtype='sd'] {
    419   background-image: -webkit-image-set(
    420     url('../images/files/volumes/white_sd.png') 1x,
    421     url('../images/files/volumes/2x/white_sd.png') 2x);
    422 }
    423 
    424 [volume-type-icon='removable'][volume-subtype='optical'] {
    425   background-image: -webkit-image-set(
    426     url('../images/files/volumes/black_optical.png') 1x,
    427     url('../images/files/volumes/2x/black_optical.png') 2x);
    428 }
    429 
    430 list:focus div[selected]
    431     [volume-type-icon='removable'][volume-subtype='optical'],
    432 tree:focus .tree-item[selected] > .tree-row >
    433     [volume-type-icon='removable'][volume-subtype='optical'] {
    434   background-image: -webkit-image-set(
    435     url('../images/files/volumes/white_optical.png') 1x,
    436     url('../images/files/volumes/2x/white_optical.png') 2x);
    437 }
    438 
    439 list:focus li[selected]
    440     [volume-type-icon='removable'][volume-subtype='optical'],
    441 tree:focus .tree-item[selected] > .tree-row >
    442     [volume-type-icon='removable'][volume-subtype='optical'] {
    443   background-image: -webkit-image-set(
    444     url('../images/files/volumes/white_optical.png') 1x,
    445     url('../images/files/volumes/2x/white_optical.png') 2x);
    446 }
    447 
    448 /* TODO(kaznacheev): consider a better icon for volume-subtype=unknown.
    449    Also find out if we need an icon for volume-subtype=mobile */
    450 [volume-type-icon='removable'][volume-subtype='unknown'] {
    451   background-image: -webkit-image-set(
    452     url('../images/files/volumes/black_hdd.png') 1x,
    453     url('../images/files/volumes/2x/black_hdd.png') 2x);
    454 }
    455 
    456 list:focus li[selected]
    457     [volume-type-icon='removable'][volume-subtype='unknown'],
    458 tree:focus .tree-item[selected] > .tree-row >
    459     [volume-type-icon='removable'][volume-subtype='unknown'] {
    460   background-image: -webkit-image-set(
    461     url('../images/files/volumes/white_hdd.png') 1x,
    462     url('../images/files/volumes/2x/white_hdd.png') 2x);
    463 }
    464