1
0
mirror of https://github.com/danbee/mpd-client synced 2025-03-04 08:39:09 +00:00

Update list styling.

This commit is contained in:
Dan Barber 2013-12-13 16:20:36 +00:00
parent 187b0e0277
commit 7efe3ad366
4 changed files with 44 additions and 37 deletions

View File

@ -17,3 +17,25 @@
float: left
padding: 0.5em 1em 0.5em 0
content: counter(index,decimal-leading-zero)
.song-list
@extend .ordered-list
li
p
margin: 0
.artist
font-size: 0.8em
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
.title
font-weight: bold
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
.length
position: absolute
font-size: 0.75em
padding: 0.8em 0
right: 10px
top: 10px

View File

@ -24,8 +24,10 @@
position: absolute
height: 100%
@include transition(left 0.25s ease-in-out)
ol, ul
ul.root, ol.artists, ol.albums
@extend .list
ol.songs
@extend .song-list
div
position: absolute
width: $interface-width

View File

@ -11,38 +11,19 @@
top: 8px
@include button
ol
@extend .ordered-list
li
&.playing
.title
color: $highlight
&:before
font-weight: bold
&:after
@extend .icon
position: absolute
font-size: 1.25em
right: 10px
top: 10px
padding: 0.3em
content: "playing"
.length
display: none
p
margin: 0
.artist
font-size: 0.8em
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
.title
font-weight: bold
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
.length
position: absolute
font-size: 0.75em
padding: 0.8em 0
right: 10px
top: 10px
@extend .song-list
li.playing
.title
color: $highlight
&:before
font-weight: bold
&:after
@extend .icon
position: absolute
font-size: 1.25em
right: 10px
top: 10px
padding: 0.3em
content: "playing"
.length
display: none

View File

@ -1,7 +1,9 @@
<ol class="songs">
<% list(items, function(song) { %>
<li id="<%= song.attr('id') %>">
<%= song.attr('title') %>
<p class="title"><%= song.attr('title') %></p>
<p class="artist"><%= song.attr('artist') %></p>
<p class="length"><%= formatLength(song.attr('length')) %></p>
</li>
<% }) %>
</ol>