clean up leftover CSS refactor styles

index.js

@@ -4,6 +4,34 @@ import BaseView from "/ui/base_view.js";
 import InfoView from "/ui/info_view.js";
 import Layout from "/ui/layout.js";
 
+navigator.storage.persisted().then((persistent) => {
+  if (!persistent && navigator.vendor === "Apple Computer, Inc.") {
+    const question =
+      "S'schaut so aus als würdest du an Safari-Browser benutzn. S'isch " +
+      "leida aba so, dass dea manchmoi selbstständig oanfach Datn löscht, " +
+      "wenn ma a Seitn z'lang nit heanimmt. Des is füa an Watterblock " +
+      "natürlich eha schlecht.\n" +
+      "\n" +
+      "Wennst magst kannt ma aba probian ob ma des Löschn fian Block " +
+      "ausschaltn kenna. Wennst magst klick oanfach auf \"Ok\"!\n" +
+      "\n" +
+      "Wenns gangen is kimsch danach glei zum Block, und falls nit bekommst " +
+      "dazu no a extra Nachricht.";
+
+    const failure =
+      "S'isch leida nit gangen. #JustSafariThings. Du kansch entweda an "
+      "andern Browser heanemmen, oder halt damit Leben wenn Safari deine " +
+      "Datn löscht.";
+
+    if (window.confirm(question)) {
+      navigator.storage.persist().then((persistent) => {
+        if (!persistent)
+          window.alert(failure);
+      });
+    }
+  }
+});
+
 m.route.prefix = "";
 m.route(document.body, "/", {
   "/": {

ui/session-list.css

@@ -25,64 +25,11 @@
     border-radius: 5px;
     margin: 1em;
 
-    >.theirname {
-      font-weight: bold;
-      grid-area: their-name;
-      text-align: right;
+    &.-text {
+      display: block;
+      text-align: center;
     }
 
-    >.ourname {
-      font-weight: bold;
-      grid-area: our-name;
-      text-align: left;
-    }
-
-    >.theirpoints {
-      grid-area: their-points;
-      text-align: right;
-    }
-
-    >.ourpoints {
-      grid-area: our-points;
-      text-align: left;
-    }
-
-    >.actions {
-      grid-area: actions;
-      display: flex;
-      justify-content: space-between;
-      gap: 1em;
-
-      >* {
-        flex-grow: 1;
-      }
-    }
-  }
-}
-
-.none {
-  display: flex;
-  flex-direction: column;
-  list-style: none;
-  padding: 1em 1em 0;
-  margin: 0;
-  min-height: 100%;
-  justify-content: end;
-
-  >.item {
-    display: grid;
-    grid-template-areas:
-      "their-name our-name"
-      "their-points our-points"
-      "actions actions";
-    grid-template-columns: repeat(2, 1fr);
-    grid-template-rows: repeat(3, min-content);
-    gap: 1em 2em;
-
-    padding: 1em;
-    border-radius: 5px;
-    margin-bottom: 1em;
-
     >.theirname {
       font-weight: bold;
       grid-area: their-name;

ui/session_list.js

@@ -7,6 +7,9 @@ export default class SessionList {
   view({attrs: { models, onSelect, onDelete } }) {
     return m("section.wb-session-list", [
       m("ol", [
+        models.length === 0
+          ? m("li.item.-text._alternate._apply", "Du hast no koane Sätz…")
+          : null,
         models.map((s, i) => m("li.item._alternate._apply", [
           m("span.theirname", s.theirTeam !== "" ? s.theirTeam : "Se"),
           m("span.ourname", s.ourTeam !== "" ? s.ourTeam : "Mia"),