bigger setlist on mobile

2 files changed, 33 insertions, 18 deletions

diff --git a/assets/css/custom.css b/assets/css/custom.css
index d5f4fab..60b93a4 100644
--- a/assets/css/custom.css
+++ b/assets/css/custom.css
@@ -283,7 +283,7 @@ body.hide-chords .chord {
   display: none;
 }
 
-body.hide-chords .key-selector{
+body.hide-chords .key-selector {
   display: none;
 }
 
@@ -465,7 +465,9 @@ button#clear-search svg {
   font-size: 14px;
   cursor: pointer;
   z-index: 9999;
-  transition: opacity 0.2s ease-in-out, background 0.2s;
+  transition:
+    opacity 0.2s ease-in-out,
+    background 0.2s;
   opacity: 0.6;
 }
 
@@ -478,16 +480,17 @@ button#clear-search svg {
   position: fixed;
   bottom: 50px;
   right: 10px;
-  width: 250px;
-  background: #241E1A;
+  width: 80%;
+  max-width: 600px;
+  background: #241e1a;
   border: 2px solid #ccc;
   padding: 12px;
   border-radius: 8px;
-  box-shadow: 0 0 8px rgba(0,0,0,0.2);
+  box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
   z-index: 9998;
 }
 
-#setlist-sidebar h6{
+#setlist-sidebar h6 {
   margin-top: 5px;
 }
 
@@ -507,4 +510,4 @@ button#clear-search svg {
   color: red;
   font-size: 1rem;
   cursor: pointer;
-}
\ No newline at end of file
+}
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 24d9d52..a232ff5 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -15,11 +15,11 @@
 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
 
 <title>
-    {{ if .IsHome}}
-    {{ site.Title }}
-    {{ else }}
-    {{ .Title }}
-    {{ end }}
+  {{ if .IsHome}}
+  {{ site.Title }}
+  {{ else }}
+  {{ .Title }}
+  {{ end }}
 </title>
 
 {{ partialCached "head/css.html" . }}
@@ -27,15 +27,27 @@
 
 <script>
 
-if ('serviceWorker' in navigator) {
-
-navigator.serviceWorker.register('/sw.js');
-
-};
+  if ('serviceWorker' in navigator) {
+
+    navigator.serviceWorker.register('/sw.js').then(reg => {
+      reg.onupdatefound = () => {
+        const installingWorker = reg.installing;
+        installingWorker.onstatechange = () => {
+          if (installingWorker.state === 'installed') {
+            if (navigator.serviceWorker.controller) {
+              // New content is available
+              alert("New version available! Refreshing...");
+              window.location.reload();
+            }
+          }
+        };
+      };
+    });
+  };
 
 </script>
 
 
 {{ if hugo.IsProduction }}
 {{ template "_internal/google_analytics.html" . }}
-{{ end }}
\ No newline at end of file
+{{ end }}