From fd90df0559d57f1f16417db2d26d23d1c476458b Mon Sep 17 00:00:00 2001
From: Sebastien <seb6596@gmail.com>
Date: Sat, 15 Jun 2019 14:40:23 +0200
Subject: [PATCH] Correct playlist graphical glitch

---
 src/main/resources/templates/music.html | 35 ++++++++++++++++---------
 1 file changed, 22 insertions(+), 13 deletions(-)

diff --git a/src/main/resources/templates/music.html b/src/main/resources/templates/music.html
index 260261c..7a09f8c 100644
--- a/src/main/resources/templates/music.html
+++ b/src/main/resources/templates/music.html
@@ -27,12 +27,21 @@
             }
         }
         @media only screen and (min-width: 993px) {
-            #playlist_list {
-                max-height: 74vh;
+            #card-playlist {
+                max-height: 75vh;
                 overflow-y: scroll;
             }
         }
 
+        #card-playlist {
+            margin: 0;
+            padding: 0;
+        }
+
+        #card-playlist li:not(.active){
+            margin: 0;
+        }
+
         #modalAdd {
             height: 85% !important;
             max-height: 100% !important;
@@ -53,16 +62,16 @@
             padding-right: 75px;
         }
 
-        .scroll4::-webkit-scrollbar {
+        .scroll::-webkit-scrollbar {
             width: 10px;
         }
 
-        .scroll4::-webkit-scrollbar-thumb {
+        .scroll::-webkit-scrollbar-thumb {
             background: #666;
             border-radius: 20px;
         }
 
-        .scroll4::-webkit-scrollbar-track {
+        .scroll::-webkit-scrollbar-track {
             background: #ddd;
             border-radius: 20px;
         }
@@ -178,10 +187,15 @@
                     <tbody>
                     <tr>
                         <td>
-                            <ul id="playlist_list" class="collapsible popout scroll4" data-collapsible="accordion"
-                                style="margin: 0px">
+                            <div class="row card-panel scroll" id="card-playlist">
+                                <div class="col s12" style="padding: 0">
+                                    <ul id="playlist_list" class="collapsible" data-collapsible="accordion"
+                                        style="margin: 0px">
+
+                                    </ul>
+                                </div>
+                            </div>
 
-                            </ul>
                         </td>
                     </tr>
 
@@ -399,11 +413,6 @@
 </main>
 
 
-<footer class="page-footer" style="padding: 0">
-    <div th:replace="footer :: footer">...</div>
-</footer>
-
-
 <!--  Scripts-->
 <script th:src="@{/js/jquery-3.3.1.min.js}"></script>
 <script th:src="@{/js/materialize.js}"></script>