add icons to session list buttons

README.md

@@ -179,8 +179,18 @@ consists of `vendored/normalize-8.0.1.css`. This is it's license:
 ### Material Icons
 
 The **material icons** are, as their name suggests, icons, which are used in place of text. They
-consist of the files `vendored/material-icons.css` and `vendored/material-icons.ttf`. This is their
-license:
+consist of the files `vendored/material-icons.css` and `vendored/material-icons.ttf`.
+
+The former of those has been modified. Originally it was as provided by upstream, except for the
+location of the font file. It has since been modified more. Those changes can easily be viewed via
+[`git log vendored/material-icons.css`][mi-log] and
+[`git blame vendored/material-icons.css`][mi-blame]. A link to a web rendering of both has been
+provided for convenience.
+
+[mi-log]: https://git.tfld.dev/tfld/watterblock/commits/branch/main/vendored/material-icons.css
+[mi-blame]: https://git.tfld.dev/tfld/watterblock/blame/branch/main/vendored/material-icons.css
+
+This is the license:
 
                                      Apache License
                                Version 2.0, January 2004

ui/button.css

@@ -20,4 +20,11 @@
   &.-slim {
     padding: 0.5em;
   }
+
+  &.-icon {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 1ch;
+  }
 }

ui/session_list.js

@@ -17,23 +17,25 @@ export default class SessionList {
           m("span.ourpoints", "•".repeat(s.result.ourPoints)),
           m("div.actions",
             m(
-              "button.wb-button.-slim._positioned",
+              "button.wb-button.-slim.-icon._positioned",
               {
                 onclick: () => {
                   if (window.confirm("Wiillst den Satz wirklich löschn?"))
                     onDelete(s.id, i);
                 }
               },
+              m("span.material-symbols-outlined", "delete"),
               "löschn"
             ),
             m(
               m.route.Link,
               {
                 href: "/",
-                selector: "button.wb-button.-slim._positioned",
+                selector: "button.wb-button.-slim.-icon._positioned",
                 params: { session: s.id },
                 onclick: () => onSelect(s),
               },
+              m("span.material-symbols-outlined", "playing_cards"),
               "spieln",
             ),
           ),

vendored/material-icons.css

@@ -1,3 +1,5 @@
+/* This file has been modified specifically for the watterblock. */
+
 @font-face {
   font-display: swap;
   font-family: 'Material Symbols Outlined';
@@ -10,7 +12,7 @@
   font-family: 'Material Symbols Outlined';
   font-weight: normal;
   font-style: normal;
-  font-size: 24px;
+  font-size: 1em;
   line-height: 1;
   letter-spacing: normal;
   text-transform: none;