Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(568)

Unified Diff: ui/file_manager/audio_player/elements/track_list.css

Issue 1458733003: Reland MD Audio Player. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: forcePlay -> forceToPlay Created 5 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: ui/file_manager/audio_player/elements/track_list.css
diff --git a/ui/file_manager/audio_player/elements/track_list.css b/ui/file_manager/audio_player/elements/track_list.css
index 1b3f3d55c4e4d3d1f2250b3d04a38a2c2ff2c455..a2f31a29a061606a3c91f251ac529e6c3d22ec6a 100644
--- a/ui/file_manager/audio_player/elements/track_list.css
+++ b/ui/file_manager/audio_player/elements/track_list.css
@@ -4,9 +4,9 @@
:host {
align-items: center;
- background: #f5f5f5;
+ background: rgb(245, 245, 245);
bottom: 72px; /* Room for the controls bar. */
- color: #3d3d3d;
+ color: rgb(51, 51, 51);
cursor: default;
display: flex;
flex-direction: column;
@@ -26,9 +26,8 @@
display: flex;
flex: 0 0 auto;
flex-direction: row;
- height: 44px;
+ height: 48px;
justify-content: flex-start;
- padding-left: 20px;
width: 100%;
}
@@ -36,9 +35,32 @@
display: none;
}
-/* In the expanded mode the selected track is highlighted. */
-.track[active] {
- background-color: rgb(66, 129, 244);
+:host([expanded]) > .track:hover {
+ background-color: rgba(0, 0, 0, 0.08);
+}
+
+/* Track icon. */
+.track .icon {
+ background-position: center;
+ background-repeat: no-repeat;
+ flex: none;
+ height: 32px;
+ margin: 8px;
+ pointer-events: none;
+ width: 32px;
+}
+
+.track:hover .icon {
+ background-image: -webkit-image-set(
+ url(../assets/100/playlist_play.png) 1x,
+ url(../assets/200/playlist_play.png) 2x);
+ pointer-events: auto;
+}
+
+.track[active] .icon {
+ background-image: -webkit-image-set(
+ url(../assets/100/playlist_now_playing.png) 1x,
+ url(../assets/200/playlist_now_playing.png) 2x);
}
/* Track data. */
@@ -54,22 +76,18 @@
.track .data .data-title,
.track .data .data-artist {
- font-size: 12px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.track .data .data-title {
- color: #343434;
- font-weight: bold;
+ color: rgb(51, 51, 51);
+ font-size: 13px;
+ font-weight: 500;
}
.track .data .data-artist {
- color: #969696;
-}
-
-.track[active] .data .data-title,
-.track[active] .data .data-artist {
- color: #fff;
+ color: rgb(100, 100, 100);
+ font-size: 12px;
}
« no previous file with comments | « ui/file_manager/audio_player/elements/control_panel.js ('k') | ui/file_manager/audio_player/elements/track_list.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698