style: increase title size and constrain content text size

Author: zorexsalvo

static/css/app.css

@@ -3824,6 +3824,24 @@
       padding-bottom: 100px;
     }
   }
+  .\[\&_h1\]\:text-lg {
+    & h1 {
+      font-size: var(--text-lg);
+      line-height: var(--tw-leading, var(--text-lg--line-height));
+    }
+  }
+  .\[\&_h2\]\:text-base {
+    & h2 {
+      font-size: var(--text-base);
+      line-height: var(--tw-leading, var(--text-base--line-height));
+    }
+  }
+  .\[\&_p\]\:text-sm {
+    & p {
+      font-size: var(--text-sm);
+      line-height: var(--tw-leading, var(--text-sm--line-height));
+    }
+  }
   .\[\&\>tr\]\:bg-white {
     &>tr {
       background-color: var(--color-white);

templates/includes/announcement_modal.html

@@ -9,8 +9,8 @@
         <form method="dialog" class="absolute right-4 top-4">
             <button class="text-2xl cursor-pointer hover:opacity-70">✕</button>
         </form>
-        <h3 class="font-bold text-lg">📢 {{ latest_announcement.title }}</h3>
-        <div class="py-4">
+        <h3 class="font-bold text-3xl mb-4">📢 {{ latest_announcement.title }}</h3>
+        <div class="py-4 text-sm prose prose-sm max-w-none [&_p]:text-sm [&_h1]:text-lg [&_h2]:text-base">
             {{ latest_announcement.content|safe }}
         </div>
     </div>