Tweak: styles

3 files changed, 32 insertions, 10 deletions

diff --git a/explore.lisp b/explore.lisp
index 64d244a..ca9cb8e 100644
--- a/explore.lisp
+++ b/explore.lisp
@@ -9,11 +9,11 @@
 (defun create-playlist-explore-card (parent pl)
   (with-clog-create parent
       (div (:bind card)
-           (img (:bind thumb))
-           (div ()
-                    (a (:link (url-to-playlist pl) :content (playlist-title pl)))
-                    (span (:content " -- "))
-                    (span (:content (secs-to-hms (playlist-duration pl))))))
+           (a (:link (url-to-playlist pl) )
+              (img (:bind thumb))
+              (span (:content (playlist-title pl)))
+              (span (:content " -- "))
+              (span (:content (secs-to-hms (playlist-duration pl))))))
     (setf (maximum-width thumb) "180px"
           (width card) "200px")
     (when-let (track (first (playlist-tracks pl)))
diff --git a/playlist.lisp b/playlist.lisp
index 10ba039..c8c3bc7 100644
--- a/playlist.lisp
+++ b/playlist.lisp
@@ -228,7 +228,7 @@
 
 (defun create-now-playing-display (parent ctl)
   (with-clog-create parent
-      (div ()
+      (div (:class "now-playing")
            (section (:h3 :content "Now Playing"))
            (img (:bind thumb))
            (section (:h4)
@@ -268,12 +268,12 @@
 
 (defun create-track-list-item (list track ctl)
   (with-clog-create list
-      (list-item (:bind container )
+      (list-item (:bind container)
                  (div (:bind edit-controls)
                       (button (:content "delete " :bind delbtn))
                       (button (:content "↓" :bind downbtn))
                       (button (:content "↑" :bind upbtn)))
-                 (div (:bind item )
+                 (div (:bind item :class "track-list-item")
                       (span (:content (track-listing-line track)))
                       (span (:content " -- "))
                       (span (:content (secs-to-hms (or (track-duration track) 0)))))
@@ -300,7 +300,7 @@
 (defun create-track-listing (parent pl)
   (when-let (ctl (cur-playlist-ctl parent))
     (create-section parent :h3 :content "TRACKS")
-    (let ((ol (create-ordered-list parent )))
+    (let ((ol (create-ordered-list parent :class "playlist-tracks")))
       (setf (pl-tracks ctl) ol)
       (dolist (track (playlist-tracks pl))
         (create-track-list-item ol track ctl)))))
diff --git a/static/css/main.css b/static/css/main.css
index 90d383a..fd10b20 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -1,19 +1,36 @@
 
 body {
     background-color: #190a0f;
-    color: #e76ad3;
+    color: #f3f3f3;
 }
 
 a {
     color: #0b9496;
 }
 
+h1,h2,h3,h4 {
+    color: #e76ad3;
+}
+
+button {
+    background: #190a0f;
+    color: #e76ad3;
+    border: 1px solid #e76ad3;
+    margin-left: 2px;
+    margin-right: 2px;
+}
+
+button:hover {
+    cursor: pointer;
+}
+
 .center {
     text-align: center;
 }
 
 .row {
     display: flex;
+    flex-direction: row;
     flex-wrap: wrap;
     justify-content: center;
     align-content: baseline;
@@ -23,3 +40,8 @@ a {
     margin: 30px;
 }
 
+.track-list-item:hover {
+    cursor: pointer;
+    background-color: #454545;
+}
+