From 1530151598a6429e3297fc9a8e7aadc356bc23b6 Mon Sep 17 00:00:00 2001
From: "N0\\A" <n0va@krzak.org>
Date: Sun, 4 Oct 2026 10:39:11 +0200
Subject: [PATCH] Use icons, like the linked channels list (and fix the no-JS
 save button)

---
 src/web/pug/guild.pug | 39 +++++++++++++++++++++------------------
 1 file changed, 21 insertions(+), 18 deletions(-)

diff --git a/src/web/pug/guild.pug b/src/web/pug/guild.pug
index edbbbc4..9cad912 100644
--- a/src/web/pug/guild.pug
+++ b/src/web/pug/guild.pug
@@ -192,42 +192,44 @@ block body
     - const customPingRooms = linkedChannelsWithDetails.filter(row => row.ping_role_id)
     - const defaultPingRooms = linkedChannelsWithDetails.filter(row => !row.ping_role_id)
     - const pingRoles = [...guild.roles].filter(role => role.id !== guild_id).sort((a, b) => b.position - a.position)
-    h3.mt32.fs-category#room-notifications Room notifications
-    .s-card
-      p.s-description.mt0 Choose which Discord role receives Matrix @room notifications
+    h3.mt32.fs-category#room-notifications Room notifications
+    .s-card.p0
+      p.s-description.m12 Choose which Discord role receives Matrix @room notifications
       if customPingRooms.length
         .s-table-container(style="container-type: inline-size")
           table.s-table.s-table__bx-simple(style="table-layout: fixed")
             thead
               tr
                 th(scope="col" style="width: calc(50cqw - 40px)") Channel
-                th.pr0(scope="col") Notify role
+                th.pr12(scope="col") Notify role
             tbody
               each row in customPingRooms
                 tr
-                  td.va-middle
-                    label.s-label(for="ping-role-" + row.channel.id)= "#" + row.channel.name
-                  td.pr0
-                    .d-flex.ai-start.g16
-                      form.fl-grow1.wmn0(method="post" action=rel("/api/room-ping-role"))
+                  td.va-middle
+                    +discord(row.channel)
+                  td.pr12
+                    .d-flex.ai-start.g8
+                      form.fl-grow1.wmn0.d-flex.ai-stretch.g8(method="post" action=rel("/api/room-ping-role"))
                         input(type="hidden" name="guild_id" value=guild_id)
                         input(type="hidden" name="channel_id" value=row.channel.id)
-                        .s-select
-                          select.w100(name="ping_role_id" id="ping-role-" + row.channel.id onchange="this.form.requestSubmit()" style="height: 32px")
+                        .s-select.fl-grow1.wmn0
+                          select.w100(name="ping_role_id" id="ping-role-" + row.channel.id aria-label="Notify role for #" + row.channel.name onchange="this.form.requestSubmit()" style="height: 32px")
                             if !pingRoles.some(role => role.id === row.ping_role_id)
                               option(value=row.ping_role_id selected disabled) Deleted role (choose a replacement)
                             each role in pingRoles
                               option(value=role.id selected=row.ping_role_id === role.id)= "@" + role.name
-                        noscript
-                          button.s-btn.s-btn__outlined.mt8(type="submit") Save
+                        button.s-btn.s-btn__outlined.py0.box-border(type="submit" data-room-ping-save style="height: 32px; min-height: 0") Save
                       form.d-flex.ai-stretch(method="post" action=rel("/api/room-ping-role"))
                         input(type="hidden" name="guild_id" value=guild_id)
                         input(type="hidden" name="channel_id" value=row.channel.id)
                         input(type="hidden" name="ping_role_id" value="")
                         button.s-btn.s-btn__danger.s-btn__outlined.py0(type="submit" aria-label="Remove custom role for #" + row.channel.name style="height: 32px") Remove
 
-      if defaultPingRooms.length && pingRoles.length
-        details.mt16
+        script.
+          document.querySelectorAll('[data-room-ping-save]').forEach(button => button.remove())
+
+      if defaultPingRooms.length && pingRoles.length
+        details.mt16.mx12.mb12
           summary.s-label.cursor-pointer Add custom role
           form.mt16(method="post" action=rel("/api/room-ping-role"))
             input(type="hidden" name="guild_id" value=guild_id)
@@ -247,9 +249,10 @@ block body
                     option(value="" selected disabled) Choose a role
                     each role in pingRoles
                       option(value=role.id)= "@" + role.name
-              button.s-btn.s-btn__icon.s-btn__filled.d-inline-flex.ai-center.g4.py0(type="submit" style="height: 32px")
-                != icons.Icons.IconPlusSm
-                span Add
+              .d-flex.ai-stretch(style="height: 32px")
+                button.s-btn.s-btn__icon.s-btn__filled.d-inline-flex.ai-center.g4.py0.box-border(type="submit" style="min-height: 0")
+                  != icons.Icons.IconPlusSm
+                  span Add
 
   h3.fs-category.mt32 Auto-create
   .s-card.d-grid.px0