From d1fbeef5ea0e97ac850ad47efb8bee7b49639f8f Mon Sep 17 00:00:00 2001 From: jcass Date: Sun, 24 Jan 2016 18:29:02 +0200 Subject: [PATCH] Remove pause/play images in favor of standardising on fontawesome icons. Ensure proper alignment of 'normalFooter' and 'nowPlayingFooter' when switching layouts. --- .../static/css/webclient.css | 88 +++++++----------- .../static/images/icons/pause_32x32.png | Bin 179 -> 0 bytes .../static/images/icons/play_alt_12x12.png | Bin 275 -> 0 bytes .../static/images/icons/play_alt_16x16.png | Bin 283 -> 0 bytes .../static/images/icons/play_alt_32x32.png | Bin 461 -> 0 bytes mopidy_musicbox_webclient/static/index.html | 49 +++++----- .../static/js/controls.js | 8 +- mopidy_musicbox_webclient/static/mb.manifest | 4 - 8 files changed, 62 insertions(+), 87 deletions(-) delete mode 100644 mopidy_musicbox_webclient/static/images/icons/pause_32x32.png delete mode 100644 mopidy_musicbox_webclient/static/images/icons/play_alt_12x12.png delete mode 100644 mopidy_musicbox_webclient/static/images/icons/play_alt_16x16.png delete mode 100644 mopidy_musicbox_webclient/static/images/icons/play_alt_32x32.png diff --git a/mopidy_musicbox_webclient/static/css/webclient.css b/mopidy_musicbox_webclient/static/css/webclient.css index d3b2a2a..0a2297c 100644 --- a/mopidy_musicbox_webclient/static/css/webclient.css +++ b/mopidy_musicbox_webclient/static/css/webclient.css @@ -121,12 +121,6 @@ } /**headers and controls**/ - - -#playimg { - margin-top: 2px; -} - #nextimg, #previmg, #backimg, #controlsimg { margin-top: 6px; } @@ -339,24 +333,30 @@ /******************* * Now Playing area *******************/ -.nowPlayingControls { - font-size: 25px; + +#nowPlayingFooter{ + height: 50px; line-height: 48px; - padding-left: 10px; + text-align: center; +} + +.footerControls { + height: 100%; + font-size: 25px; padding-right: 10px; } -.nowPlayingControls span span { +.footerControls div span { padding-left: 3px; padding-right: 3px; height=100%; vertical-align: middle; } -.nowPlayingControls #btplayNowPlaying { - font-size: 190%; - margin-left: 15px; - margin-right: 15px; +.footerControls #btplayNowPlaying { + font-size: 42px; + margin-left: 10px; + margin-right: 10px; } @@ -398,10 +398,6 @@ margin-bottom: 15px; } -#btplayNowPlaying { - padding-top: 15px; -} - #popupTracksLv li, #popupQueueLv li { border-bottom: 1px solid #aaa; } @@ -460,14 +456,14 @@ a { .ui-footer{ border: 0px; } + #normalFooter{ - height: 48px; -} -#nowPlayingFooter{ - height: 48px; + height: 50px; + line-height: 48px; text-align: center; color: white; } + #infoname { overflow: hidden; white-space: nowrap; @@ -482,52 +478,35 @@ a { } #infocover { - height: 48px; - width: 48px; + height: 50px; + width: 50px; position: absolute; } +#btplay { + color: white; +} -.songinfo-text{ +.songinfo { + height: 100%; +} + +.songinfo-text { + text-align: left; + line-height: 22px; display:inline-block; padding: 6px; color: white; position: absolute; - padding-left: 50px; - padding-right: 50px; + padding-left: 55px; + padding-right: 55px; } -.playPausebtn{ - padding-right: 10px; - position: absolute; - right: 0px; -} - -#controldiv{ - background: none repeat scroll 0% 0% rgb(44, 62, 80); - height: 48px; - padding: 8px 8px 8px 8px; - -} - -#controldiv img { - margin-left: auto; - margin-right: auto; - display: block; -} - #nowPlayingpane{ text-align: center; } -.footer { - position: fixed; - z-index: 1000; - bottom: 0; - width: 100%; -} - /*helper*/ .hidden{ @@ -597,7 +576,8 @@ a { .nowPlayingControls{ font-size: 1.3em; - line-height: 50px; + height: 50px; + line-height: 48px; } } diff --git a/mopidy_musicbox_webclient/static/images/icons/pause_32x32.png b/mopidy_musicbox_webclient/static/images/icons/pause_32x32.png deleted file mode 100644 index 575176970132599f9a5a01e86cd7e89d83a2b9ba..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 179 zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE1|*BCs=fdz$r9IylHmNblJdl&R0hYC{G?O` z&)mfH)S%SFl*+=BsWw1Gp`I>|Ar-gYTtCQrK!Kw*F+(Qc@-@ZP$MQVH72*tE{_i{R z(ECBtteGy)COly9Se+)lzFOg{)~l=Y?e6~kedZL%0WfewY{8$l{p>YNJPh%neAaLN RdU}AQJYD@<);T3K0RY9_J{14} diff --git a/mopidy_musicbox_webclient/static/images/icons/play_alt_12x12.png b/mopidy_musicbox_webclient/static/images/icons/play_alt_12x12.png deleted file mode 100644 index 4d23adaf331802ba8fbdac4e68bc68290f1683b8..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 275 zcmeAS@N?(olHy`uVBq!ia0vp^JRr=$1|-8uW1a&k$r9IylHmNblJdl&R0hYC{G?O` z&)mfH)S%SFl*+=BsWw1GTRmMILn>}1r8G2!W?$20SXrgO$B@Lh;sd+FJ%%H_iHeQ< z4op1(N7)>*>?b*uFkE`UaiyeDFzZvLP1i(INh8O(jKMXGDYhX(vJF?R7(3qOF=x%l zWu6drWT9aL=j`BySp}IQ2}ufq8yrd(-(ce55ZKSq@%iEtI|IkVlJ5)`Buxl@x0scU zCnuqCm!McATR@L?g!Ie>hA%plH7+W@V-z+Cad?=|afJJVNnJyiq|;Rc1{Mhhg+z-U U*#&B>Ko2l@y85}Sb4q9e0Ame6t3(I0e8UZa6b|8#1Y6Eok_)n~H^(x3{ajbP0l+XkKjuKZS diff --git a/mopidy_musicbox_webclient/static/images/icons/play_alt_32x32.png b/mopidy_musicbox_webclient/static/images/icons/play_alt_32x32.png deleted file mode 100644 index ae4412f5fc18ce6012b0c44da46573b521c261ae..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 461 zcmV;;0W$uHP)d-;DXM`Ndvwl=fEeO`~dj-e1F_&#l-i|VU9#{%^+Uku|}J#ey9cPP{@9e03@E_Q9O7p7qwRm3OTU_AbC#Y zZ%PJd5@CY^$mNBK1Je$P?s)k@#l_P1gl@&W5_J2caHK9L!26(>fLsyBEyUo(J(TSR z?Ia{3BhH%#)}de2$%FPTDCEkisl!za0lK4FHfXaEB2u9C+8aV1$$@(NV2l*90D)FJ zMo0$IHP%-M#42{K5KvD>66<1anI_L7_63v@l`ya|l?lyo*~G*S$6A1;3#KG?u$nHb zLPMwfFAyTW4y|}+>XL958p8yMmB-nbh<>HoGAH@)^&jm -
- - -
-
-
+
+
+
+
+
+
+
+
+
+
-
-
- Play
- -
- - - - - - - - - - - - -
+
+
+ + + +
+
+ + + + + +
+
diff --git a/mopidy_musicbox_webclient/static/js/controls.js b/mopidy_musicbox_webclient/static/js/controls.js index 266e041..c0c279c 100644 --- a/mopidy_musicbox_webclient/static/js/controls.js +++ b/mopidy_musicbox_webclient/static/js/controls.js @@ -260,15 +260,15 @@ function doShuffle() { /* Toggle state of play button */ function setPlayState(nwplay) { if (nwplay) { - $("#playimg").attr('src', 'images/icons/pause_32x32.png'); - $("#playimg").attr('title', 'Pause'); $("#btplayNowPlaying >i").removeClass('fa-play').addClass('fa-pause'); $("#btplayNowPlaying").attr('title', 'Pause'); + $("#btplay >i").removeClass('fa-play').addClass('fa-pause'); + $("#btplay").attr('title', 'Pause'); } else { - $("#playimg").attr('src', 'images/icons/play_alt_32x32.png'); - $("#playimg").attr('title', 'Play'); $("#btplayNowPlaying >i").removeClass('fa-pause').addClass('fa-play'); $("#btplayNowPlaying").attr('title', 'Play'); + $("#btplay >i").removeClass('fa-pause').addClass('fa-play'); + $("#btplay").attr('title', 'Play'); } play = nwplay; } diff --git a/mopidy_musicbox_webclient/static/mb.manifest b/mopidy_musicbox_webclient/static/mb.manifest index 3b5f42a..7d2862d 100644 --- a/mopidy_musicbox_webclient/static/mb.manifest +++ b/mopidy_musicbox_webclient/static/mb.manifest @@ -41,10 +41,6 @@ images/icons/musicbox32.png images/icons/musicbox57.png images/icons/musicbox72.png images/icons/musicbox114.png -images/icons/pause_32x32.png -images/icons/play_alt_12x12.png -images/icons/play_alt_16x16.png -images/icons/play_alt_32x32.png images/default_cover.png images/empty.png