Reorganized player buttons
|
@ -97,11 +97,11 @@ GEM
|
|||
thor (~> 0.14.6)
|
||||
rake (0.9.2)
|
||||
rdoc (3.9.4)
|
||||
sass (3.1.7)
|
||||
sprockets (2.0.0)
|
||||
sass (3.1.8)
|
||||
sprockets (2.0.1)
|
||||
hike (~> 1.2)
|
||||
rack (~> 1.0)
|
||||
tilt (!= 1.3.0, ~> 1.1)
|
||||
tilt (~> 1.1, != 1.3.0)
|
||||
therubyracer (0.9.4)
|
||||
libv8 (~> 3.3.10)
|
||||
thor (0.14.6)
|
||||
|
@ -109,7 +109,7 @@ GEM
|
|||
treetop (1.4.10)
|
||||
polyglot
|
||||
polyglot (>= 0.3.1)
|
||||
tzinfo (0.3.29)
|
||||
tzinfo (0.3.30)
|
||||
uglifier (1.0.3)
|
||||
execjs (>= 0.3.0)
|
||||
multi_json (>= 1.0.2)
|
||||
|
|
Before Width: | Height: | Size: 3.1 KiB After Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.7 KiB |
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 3.6 KiB |
After Width: | Height: | Size: 3.6 KiB |
|
@ -1,19 +1,6 @@
|
|||
@import "opacity";
|
||||
|
||||
.player {
|
||||
.buttons {
|
||||
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;
|
||||
}
|
||||
.now-playing {
|
||||
text-align: center;
|
||||
}
|
||||
|
@ -34,21 +21,58 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.secondary-buttons {
|
||||
margin: 10px 0;
|
||||
text-align: center;
|
||||
a {
|
||||
font-size: 11px;
|
||||
color: #cacaca;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: #b0b0b0;
|
||||
.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);
|
||||
}
|
||||
}
|
||||
&.on {
|
||||
color: #606060;
|
||||
}
|
||||
.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);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -57,14 +57,20 @@
|
|||
.loaded
|
||||
.played
|
||||
.buttons
|
||||
%a.btn.small-round.prev «
|
||||
%a.btn.large.play ►
|
||||
%a.btn.large.pause II
|
||||
%a.btn.small-round.next »
|
||||
.secondary-buttons
|
||||
%a.shuffle= (I18n.t 'player.shuffle').upcase
|
||||
%a.repeat= (I18n.t 'player.repeat').upcase
|
||||
%a.do_empty= (I18n.t 'player.do_empty').upcase
|
||||
.secondary-buttons
|
||||
%a.shuffle{ :title => I18n.t('player.shuffle') }= image_tag "icns/shuffle.png"
|
||||
%a.repeat{ :title => I18n.t('player.repeat') }= image_tag "icns/repeat.png"
|
||||
%a.do_empty{ :title => I18n.t('player.do_empty') }= image_tag "icns/empty.png"
|
||||
.primary-buttons
|
||||
%a.btn.small-round.prev «
|
||||
%a.btn.large.play ►
|
||||
%a.btn.large.pause II
|
||||
%a.btn.small-round.next »
|
||||
.quality-buttons
|
||||
%a.q-good{ :title => I18n.t('player.thumbs_up') }= image_tag "icns/thumbs-up.png"
|
||||
%a.q-bad{ :title => I18n.t('player.thumbs_down') }= image_tag "icns/thumbs-down.png"
|
||||
|
||||
|
||||
|
||||
%ul.playlist
|
||||
|
||||
|
|
|
@ -50,3 +50,5 @@ en:
|
|||
repeat: "Repeat"
|
||||
shuffle: "Shuffle"
|
||||
do_empty: "Empty"
|
||||
thumbs_up: "This is exactly the song I was looking for and the quality of sound is good"
|
||||
thumbs_down: "This is not the song I was looking for or the quality of sound is bad"
|
||||
|
|
|
@ -50,3 +50,5 @@ ru:
|
|||
repeat: "Повторять"
|
||||
shuffle: "Перемешать"
|
||||
do_empty: "Очистить"
|
||||
thumbs_up: "Это та самая песня и качество звука хорошее"
|
||||
thumbs_down: "Это не та песня или качество звука плохое"
|
||||
|
|