[WIP] GUI improvements

docker-compose.yml

@@ -12,3 +12,19 @@ services:
             - redis
     redis:
         image: redis
+
+    navidrome:
+        image: deluan/navidrome:latest
+#        user: 1000:1000 # should be owner of volumes
+        ports:
+            - "4533:4533"
+        restart: unless-stopped
+        environment:
+            # Optional: put your config options customization here. Examples:
+            ND_SCANSCHEDULE: 1h
+            ND_LOGLEVEL: info
+            ND_SESSIONTIMEOUT: 24h
+#            ND_BASEURL: ""
+        volumes:
+            - "./navidrome:/data:Z"
+            - "/home/stonesoft/Music:/music:ro"

static/css/style.css

@@ -18,6 +18,15 @@ body {
     transform: translate(-50%, -50%) !important;
 }
 
+#disk {
+    width: 66vw;
+    border-radius: 1200px;
+    aspect-ratio: 1 / 1 !important;
+    background-image: url('/static/img/vinyl.png');
+    background-position: center;
+    background-size: cover;
+}
+
 .card {
     box-shadow: 0 0 36px 0px rgba(128,128,128,0.128);
     background-color: white;

templates/base.html

@@ -29,7 +29,9 @@
             <div class="page-content">
                 <div class="container">
                     <div class="row">
-                        <div class="card centered w-75">
+                        <div id="disk" class="card centered">
+
+                            <div class="disk-content centered">
                                 <!-- LOGO -->
                                 <div class="logo-home mx-auto">
                                     <a id="logo" class="text-black btn-modal" href="#" data-action="main_menu">
@@ -51,16 +53,14 @@
                                     </div>
                                 </div>
 
-                            <t t-if="user">
-                                <!-- Quick Action Menu -->
-                                <div id="actions-container-home" class="mt-4">
-                        <span>
-                            <a id="download_btn" class="btn btn-outline-secondary action-item-home btn-modal" href="#download"
+                                <a id="download_btn" class="btn btn-outline-secondary action-item-home btn-modal"
+                                   href="#download"
                                    data-action="download">
                                     <i class="las la-download"></i>
                                     Download
                                 </a>
-                        </span>
+                            </div>
+
                         </div>
                     </div>
                 </div>