diff options
Diffstat (limited to 'chromium/chrome/browser/resources/file_manager/foreground/css/audio_player.css')
-rw-r--r-- | chromium/chrome/browser/resources/file_manager/foreground/css/audio_player.css | 404 |
1 files changed, 0 insertions, 404 deletions
diff --git a/chromium/chrome/browser/resources/file_manager/foreground/css/audio_player.css b/chromium/chrome/browser/resources/file_manager/foreground/css/audio_player.css deleted file mode 100644 index 1f6b7bbfb91..00000000000 --- a/chromium/chrome/browser/resources/file_manager/foreground/css/audio_player.css +++ /dev/null @@ -1,404 +0,0 @@ -/* Copyright (c) 2012 The Chromium Authors. All rights reserved. - * Use of this source code is governed by a BSD-style license that can be - * found in the LICENSE file. */ - -body { - -webkit-user-select: none; - overflow: hidden; - padding: 0; -} - -.audio-player { - background-color: #1d1d1d; - bottom: 0; - color: white; - cursor: default; - font-family: Open Sans, Droid Sans Fallback, sans-serif; - font-size: 10pt; - left: 0; - position: absolute; - right: 0; - top: 0; -} - -/* Title buttons. - * In the collapsed/single-track mode they overlap the first track. */ - -.title-button { - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - height: 29px; - opacity: 0.4; - position: absolute; - top: 0; - width: 29px; - z-index: 2; -} - -.title-button:hover { - background-color: rgb(60, 126, 255) !important; - opacity: 1; -} - -.audio-player:not(.collapsed):not(.single-track) > .title-button { - background-color: #1f1f1f; -} - -.title-button.close { - background-image: -webkit-image-set( - url('../images/media/media_close.png') 1x, - url('../images/media/2x/media_close.png') 2x); - right: 0; -} - -.title-button.collapse { - background-image: -webkit-image-set( - url('../images/media/media_collapse.png') 1x, - url('../images/media/2x/media_collapse.png') 2x); - right: 0; -} - -.audio-player:not(.frameless) .title-button.close { - display: none; -} - -.audio-player.frameless .title-button.collapse { - right: 29px; -} - -.collapsed .title-button.collapse { - background-image: -webkit-image-set( - url('../images/media/media_expand.png') 1x, - url('../images/media/2x/media_expand.png') 2x); -} - -.single-track .title-button.collapse { - display: none; -} - -/* Common properties for track containers. */ -.audio-player > .track-list, -.audio-player > .track-stack { - bottom: 35px; /* Room for the controls bar. */ - left: 0; - position: absolute; - right: 0; -} - -/* Scrollable list of tracks. - * Displayed in expanded mode if there is more than one track. */ -.audio-player > .track-list { - -webkit-box-align: center; - -webkit-box-orient: vertical; - -webkit-box-pack: start; - display: -webkit-box; - overflow-x: hidden; - overflow-y: auto; - top: 0; -} - -/* A single track container. - * Displayed in the compact mode or when there is only one track. */ -.audio-player > .track-stack { - height: 58px; -} - -.audio-player.collapsed > .track-list, -.audio-player.single_track > .track-list, -.audio-player:not(.collapsed):not(.single-track) > .track-stack { - opacity: 0; - pointer-events: none; -} - -/* Track item. */ -.track { - -webkit-box-align: center; - -webkit-box-orient: horizontal; - -webkit-box-pack: start; - display: -webkit-box; - height: 58px; - width: 100%; -} - -/* In the expanded mode the selected track is highlighted. */ -.track-list .track.selected { - background-color: #2d2d2d; -} - -.track-list .track:hover { - background-color: #272727 !important; -} - -.track-list .track:not(.selected) .data { - opacity: 0.7; -} - -/* In the compact mode all tracks are in the same position, only the selected - is visible.*/ -.track-stack > .track { - position: absolute; - top: 0; -} - -.track-stack > .track.selected { - z-index: 1; -} - -/* Opacity transition is controlled differently for the text and the artwork. - * Text transition looks better if fade-in and fade-out go in parallel. - * For the artwork we start fading out the old icon only after the new one - * is completely opaque (otherwise when transitioning between identical icons - * we see some fading because the background transpires). */ -.track-stack > .track:not(.selected) .data, -.track-stack > .track:not(.visible) .art { - opacity: 0; - transition: opacity 220ms ease-out; -} - -/* Track data. */ - -.track .art { - box-sizing: border-box; - height: 48px; - margin: 4px 0 6px 4px; - position: relative; - width: 48px; -} - -.track .art.blank { - background-color: #111; - border: 1px solid #333; -} - -.track .art img { - height: 100%; - width: 100%; -} - -.track .art.blank img { - display: none; -} - -.track .art.error { - background-image: -webkit-image-set( - url('../images/media/error.png') 1x, - url('../images/media/2x/error.png') 2x); - background-position: center center; - background-repeat: no-repeat; -} - -.noart .track .art { - display: none; -} - -.track .data { - -webkit-box-flex: 1; - -webkit-box-orient: vertical; - -webkit-box-pack: center; - display: -webkit-box; - margin-left: 8px; - margin-right: 4px; -} - -.track .data .data-title, -.track .data .data-artist { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.track .data .data-title { - font-weight: bold; -} - -/* TODO(kaznacheev): Set to 20px when the audio player is title-less. */ -.single-track .data-title { - padding-right: 0; -} - -/* TODO(kaznacheev): Set to 50px when the audio player is title-less. */ -.collapsed:not(.single-track) .data-title { - padding-right: 20px; -} - -/* Controls bar. */ - -.audio-controls { - -webkit-box-align: center; - -webkit-box-orient: horizontal; - -webkit-box-pack: center; - background-color: #2D2D2D; - border-top: 1px solid rgba(255, 255, 255, 0.1); - bottom: 0; - display: -webkit-box; - height: 30px; - left: 0; - padding: 0 0 4px 13px; - position: absolute; - right: 0; -} - -.audio-controls .media-button { - height: 29px; - margin-top: 1px; - width: 29px; -} - -.audio-controls .media-button.play { - margin-left: -10px; - margin-right: -8px; -} - -.audio-controls .media-button.play > .default.normal, -.audio-controls .media-button.play > .ended.normal { - background-image: -webkit-image-set( - url('../images/media/media_play_audio.png') 1x, - url('../images/media/2x/media_play_audio.png') 2x); -} - -.audio-controls .media-button.play > .default.hover, -.audio-controls .media-button.play > .ended.hover { - background-image: -webkit-image-set( - url('../images/media/media_play_audio_hover.png') 1x, - url('../images/media/2x/media_play_audio_hover.png') 2x); -} - -.audio-controls .media-button.play > .default.active, -.audio-controls .media-button.play > .ended.active { - background-image: -webkit-image-set( - url('../images/media/media_play_audio_down.png') 1x, - url('../images/media/2x/media_play_audio_down.png') 2x); -} - -.audio-controls .media-button.play > .playing.normal { - background-image: -webkit-image-set( - url('../images/media/media_pause_audio.png') 1x, - url('../images/media/2x/media_pause_audio.png') 2x); -} - -.audio-controls .media-button.play > .playing.hover { - background-image: -webkit-image-set( - url('../images/media/media_pause_audio_hover.png') 1x, - url('../images/media/2x/media_pause_audio_hover.png') 2x); -} - -.audio-controls .media-button.play > .playing.active { - background-image: -webkit-image-set( - url('../images/media/media_pause_audio_down.png') 1x, - url('../images/media/2x/media_pause_audio_down.png') 2x); -} - -.audio-controls .time-controls { - margin-left: 10px; - margin-right: 9px; -} - -.audio-controls .time-controls .time { - margin-left: 11px; -} - -.media-button.previous { - margin-left: -2px; -} - -.media-button.previous > .normal { - background-image: -webkit-image-set( - url('../images/media/media_previous.png') 1x, - url('../images/media/2x/media_previous.png') 2x); -} - -.media-button.previous > .hover { - background-image: -webkit-image-set( - url('../images/media/media_previous_hover.png') 1x, - url('../images/media/2x/media_previous_hover.png') 2x); -} - -.media-button.previous > .active { - background-image: -webkit-image-set( - url('../images/media/media_previous_down.png') 1x, - url('../images/media/2x/media_previous_down.png') 2x); -} - -.media-button.next { - margin-right: -2px; -} - -.media-button.next > .normal { - background-image: -webkit-image-set( - url('../images/media/media_next.png') 1x, - url('../images/media/2x/media_next.png') 2x); -} - -.media-button.next > .hover { - background-image: -webkit-image-set( - url('../images/media/media_next_hover.png') 1x, - url('../images/media/2x/media_next_hover.png') 2x); -} - -.media-button.next > .active { - background-image: -webkit-image-set( - url('../images/media/media_next_down.png') 1x, - url('../images/media/2x/media_next_down.png') 2x); -} - -.single-track .media-button.next, -.single-track .media-button.previous { - display: none; -} - -/* Customized scrollbar for the playlist. */ - -::-webkit-scrollbar { - height: 16px; - width: 16px; -} - -::-webkit-scrollbar-button { - height: 0; - width: 0; -} - -::-webkit-scrollbar-thumb { - background-clip: padding-box; - background-color: rgba(255, 255, 255, 0.15); - box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.10), - inset 0 -1px 0 rgba(0, 0, 0, 0.07); - min-height: 28px; - padding-top: 100px; -} - -::-webkit-scrollbar-thumb:hover { - background-color: rgba(255,255,255,0.20); - box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.25); -} - -::-webkit-scrollbar-thumb:active { - background-color: rgba(255, 255, 255, 0.25); - box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.35); -} - -::-webkit-scrollbar-thumb:vertical { - border-bottom: 0 solid transparent; - border-left: 5px solid transparent; - border-right: 0 solid transparent; - border-top: 0 solid transparent; -} - -::-webkit-scrollbar-track:hover { - background-color: rgba(0, 0, 0, 0.05); - box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.10); -} - -::-webkit-scrollbar-track:active { - background-color: rgba(0, 0, 0, 0.05); - box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.14), - inset -1px -1px 0 rgba(0, 0, 0, 0.07); -} - -::-webkit-scrollbar-track:vertical { - background-clip: padding-box; - background-color: transparent; - border-left: 5px solid transparent; - border-right: 0 solid transparent; -} |