1
0
Fork 0
oldhaven/app/assets/stylesheets/player.scss

128 lines
2.4 KiB
SCSS

@import "opacity";
.player {
.now-playing {
text-align: center;
}
.progress {
width: 94%;
margin: 0 0 18px 3%;
height: 5px;
background-color: #f0f0f0;
.loaded {
width: 0;
height: 5px;
background-color: #d0e0e0;
cursor: pointer;
.played {
width: 0;
height: 5px;
background-color: #0090AA;
}
}
}
.buttons {
clear: both;
height: 50px;
.secondary-buttons {
float: left;
width: 20px;
margin: -10px 0 0 20px;
text-align: center;
a {
display: block;
margin: -5px 0 0 0;
@include opacity(0.3);
cursor: pointer;
&.do_empty {
margin-top: -2px;
}
&:hover {
@include opacity(0.6);
}
&.on {
@include opacity(0.9);
}
}
}
.primary-buttons {
float: left;
width: 200px;
margin: 10px 0 0 0;
text-align: center;
height: 36px;
.play {
border-radius: 21px !important;
padding: 11px 11px 11px 15px !important;
margin-top: -10px !important;
}
.pause {
font-weight: bold;
border-radius: 21px !important;
padding: 11px 16px 11px 16px !important;
display: none;
}
}
.quality-buttons {
float: left;
width: 20px;
a {
display: block;
@include opacity(0.4);
cursor: pointer;
&:hover {
@include opacity(0.8);
}
}
}
}
}
.playlist {
margin: 20px 0 0 0;
padding-bottom: 200px;
li {
list-style: none;
background-color: #ffffff;
border-bottom: #DDD 1px solid;
.artist-name {
font-size: 11px;
margin: 0 0 0 5px;
padding: 5px 0 0 0;
}
.song-title {
margin: 0 0 5px 5px;
}
.song-duration {
float: right;
margin: 15px 5px 0 0;
}
.remove {
display: none;
float: right;
margin: 13px 5px 0 0;
cursor: pointer;
}
&.unavailable {
background-color: #FFF0F0;
}
&.now {
background-color: #EAF5FF;
}
&:hover {
.remove {
display: block;
}
.song-duration {
display: none;
}
}
}
tr.track {
display: block !important;
background-color: #fff;
width: 280px;
height: 47px;
visibility: hidden !important;
}
}