adjust player to display current podcast

diff --git a/panikweb_esperanzah/static/css/_specifics.scss b/panikweb_esperanzah/static/css/_specifics.scss
index ddbed4c42168f95f16914272f732004ea3d051c9..d381a17aab8177f0794ebbc21417a8822286171d 100644 (file)
--- a/panikweb_esperanzah/static/css/_specifics.scss
+++ b/panikweb_esperanzah/static/css/_specifics.scss
@@ -615,7 +615,7 @@ h1.top#frequence {
        padding: 0 0 0 0;
        width: 300px;
        margin-left: -125px;
-       margin-top: 50px;
+       margin-top: 52px;
        text-align: center;
        a {
                display: block;
@@ -690,34 +690,7 @@ h1.top#frequence {
    -o-animation: loading 1s infinite linear;
    animation: loading 1s infinite linear;
 }
-#Playlist .playlistControls button,#Playlist .playlistControls .button{
-       margin:0 0.1em 0 0.1em;
-}
-#Playlist li{
-       clear:right;
-}
-#Playlist .soundControls button{}
 
-#player-container #Playlist ol li{
-       line-height:1.3em;
-       padding:0;
-       margin:0;
-}
-#Playlist ol li .soundControls{
-       margin-left: 1ex;
-       position: relative;
-       float: right;
-       visibility: hidden;
-}
-#Playlist ol li.active .soundControls {
-       visibility: visible;
-}
-#Playlist ol li .title{
-       display:inline-block;
-       white-space: nowrap;
-       text-overflow: ellipsis;
-       overflow: hidden;
-}
 
 /****************************************************/
 /**** #Changing #Footer ... ****/
@@ -2261,21 +2234,40 @@ p.archives-sorry {
 div#Playlist {
        position: relative;
        div.label {
-               position: absolute;
-               left: 66px;
-               top: -10px;
-               @media screen and (max-width: $size_m) {
-                       top: 0;
-               }
                display: none;
        }
        ol {
-               display: none;
-               padding-top: 12px;
-               margin-left: 29px;
+               color: $red;
+               font-weight: bold;
+               width: 300px;
+               margin: 0;
+               padding: 0;
+               padding-top: 50px;
+               margin-left: -125px;
+               color: $red;
                list-style: none;
-               @media screen and (max-width: $size_m) {
-                       margin-left: 36px;
+               text-align: center;
+               li {
+                       display: none;
+               }
+               li.active {
+                       display: flex;
+                       justify-content: center;
+               }
+               li .soundControls {
+                       width: 25px;
+                       position: relative;
+                       color: $red;
+                       button.no-icon-remove::after {
+                               content: "×";
+                               color: $red;
+                       }
+               }
+               #Playlist ol li .title{
+                       display:inline-block;
+                       white-space: nowrap;
+                       text-overflow: ellipsis;
+                       overflow: hidden;
                }
        }
 }

diff --git a/panikweb_esperanzah/static/js/audioPlayer.js b/panikweb_esperanzah/static/js/audioPlayer.js
index 729998d27817f13dd75b2ed57a24a88a4ddcedf3..3c7091b634d1542dc1790ed3a106f28313ba9757 100644 (file)
--- a/panikweb_esperanzah/static/js/audioPlayer.js
+++ b/panikweb_esperanzah/static/js/audioPlayer.js
@@ -175,7 +175,7 @@
                                }
                        }});
                        controls.append(playpause).append(stop).append(remove);
-                       var title = $('<a>',{title:"More information",href:sound.url,'class':"button title",html:sound.title});
+                       var title = $('<a>',{href: sound.url, 'class': 'button title', html:sound.title});
                        container.append(controls).append(title).append(audio);
                        if(sound.focus){thePlaylist.setFocus(container);}
                        return container;