improve UI

dist/index.css

@@ -185,6 +185,26 @@ main {
   --subtle-luma-dark: 5%;
 }
 
+/* src/coloredTile.css */
+.colored-tile {
+  position: relative;
+  display: flex;
+  align-items: flex-end !important;
+  justify-content: start;
+  overflow: hidden;
+}
+.colored-tile h2 {
+  margin: 0px;
+}
+.colored-tile .shadow {
+  position: absolute;
+  left: -15px;
+  bottom: -45px;
+  font-size: 7rem;
+  opacity: 0.1;
+  white-space: nowrap;
+}
+
 /* src/View/chatPage.css */
 #chat-page-wrapper {
   display: none;
@@ -491,27 +511,6 @@ body[showing-chat] #chat-page-wrapper {
   text-align: right;
 }
 
-/* src/View/Components/chatEntry.css */
-.chat-entry {
-  position: relative;
-  display: flex;
-  align-items: flex-end !important;
-  justify-content: start;
-  height: 8rem;
-  overflow: hidden;
-}
-.chat-entry h2 {
-  margin: 0px;
-}
-.chat-entry .shadow {
-  position: absolute;
-  left: -15px;
-  bottom: -45px;
-  font-size: 6rem;
-  opacity: 0.1;
-  white-space: nowrap;
-}
-
 /* src/View/Components/fileBrowser.css */
 .file-browser {
   width: 100%;

dist/index.js

@@ -1927,7 +1927,15 @@
 
   // src/View/Components/boardEntry.tsx
   function BoardEntry(boardInfo) {
-    const view = /* @__PURE__ */ createElement("button", { color: boardInfo.color, class: "tile" }, /* @__PURE__ */ createElement("b", null, boardInfo.name));
+    const view = /* @__PURE__ */ createElement(
+      "button",
+      {
+        color: boardInfo.color,
+        class: "tile colored-tile"
+      },
+      /* @__PURE__ */ createElement("span", { class: "shadow" }, boardInfo.name),
+      /* @__PURE__ */ createElement("b", null, boardInfo.name)
+    );
     return view;
   }
   var BoardInfoToEntry = (boardInfo) => {
@@ -2484,7 +2492,8 @@
       "button",
       {
         "set:color": chatViewModel.settingsPageViewModel.color,
-        class: "chat-entry tile",
+        class: "tile colored-tile",
+        style: "height: 8rem",
         "on:click": chatViewModel.open
       },
       /* @__PURE__ */ createElement(