Permalink
Browse files

styling playback controls consistently

  • Loading branch information...
1 parent 0c9e225 commit 397e39aab700f99ee99c9a1a7a67f80d37deb7f5 @arnorhs arnorhs committed Feb 25, 2012
Deleted file not rendered
@@ -8,6 +8,26 @@ border-radius(a)
-webkit-border-radius: a
-moz-border-radius: a
+border-top-left-radius(a)
+ border-top-left-radius: a
+ -webkit-border-top-left-radius: a
+ -moz-border-top-left-radius: a
+
+border-top-right-radius(a)
+ border-top-right-radius: a
+ -webkit-border-top-right-radius: a
+ -moz-border-top-right-radius: a
+
+border-bottom-left-radius(a)
+ border-bottom-left-radius: a
+ -webkit-border-bottom-left-radius: a
+ -moz-border-bottom-left-radius: a
+
+border-bottom-right-radius(a)
+ border-bottom-right-radius: a
+ -webkit-border-bottom-right-radius: a
+ -moz-border-bottom-right-radius: a
+
gradient(a,b,c)
background-image: -webkit-gradient(a,b,c);
background-image: -webkit-linear-gradient(a,b,c);
@@ -40,25 +40,15 @@
color: #ccc
display: inline-block
margin-right: 5px
- #playback-next
- cursor: pointer
- background: transparent url(/images/playback-next.png) no-repeat 0px 0px
- text-indent: -10000px
- overflow: hidden
- width: 26px
- height: 26px
- right: 20px
- top: 10px
- display: block
- position: absolute
- &:hover
- opacity: 0.8
- #volume_buttons
+ #playback_controls
position: absolute
top: 10px
- right: 56px
+ right: 20px
width: auto
- button.volume
+ .group
+ margin-left: 10px
+ float: left
+ button
cursor: pointer
display: block
float: left
@@ -67,17 +57,18 @@
border: none
background: #444
margin: 0
- color: #000
color: #888
text-shadow: 0px -1px 0px #333
padding: 0 7px
border-left: 1px solid #444
gradient(top, #555, #333)
&:first-child
border-left: none
- border-radius(3px 0 0 3px)
+ border-top-left-radius(3px)
+ border-bottom-left-radius(3px)
&:last-child
- border-radius(0 3px 3px 0)
+ border-top-right-radius(3px)
+ border-bottom-right-radius(3px)
&.active, &.active:hover
gradient(top, #333, #444)
color: #000
View
@@ -19,11 +19,13 @@ html
.queue-chrome
.queue-inner
h4.now-playing Now playing...
- span#playback-next(title="Skip this song") next
- #volume_buttons
- button.volume(data-volume=20, title="Volume to 20") 20
- button.volume.active(data-volume=70, title="Volume to 70") 70
- button.volume(data-volume=100, title="Volume to 100") 100
+ #playback_controls
+ .group
+ button.volume(data-volume=20, title="Volume to 20") 2
+ button.volume.active(data-volume=70, title="Volume to 70") 7
+ button.volume(data-volume=100, title="Volume to 100") 10
+ .group
+ button.playback-next(title="Skip this song") »
#song-queue
ul
.main-wrapper

0 comments on commit 397e39a

Please sign in to comment.