From 1f6fe23be5d8152e98184f549867ec409d9cedfe Mon Sep 17 00:00:00 2001
From: Xylight <james@xylight.dev>
Date: Sun, 28 Sep 2025 14:52:46 -0700
Subject: [PATCH] impr: add inert property to disclosures for closed

---
 src/lib/feature/comment/Comment.svelte         |  6 +++---
 src/lib/ui/shared/disclosure/Disclosure.svelte | 13 +++++++++----
 src/lib/ui/shared/modal/Modal.svelte           |  2 +-
 src/routes/modlog/item/ModlogItemTable.svelte  | 10 +++++++---
 4 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/src/lib/feature/comment/Comment.svelte b/src/lib/feature/comment/Comment.svelte
index 9f3f6ab3..567cc410 100644
--- a/src/lib/feature/comment/Comment.svelte
+++ b/src/lib/feature/comment/Comment.svelte
@@ -165,7 +165,7 @@
             {#if node.comment_view.creator_is_moderator}
               <Icon
                 src={ShieldCheck}
-                size="14"
+                size="16"
                 micro
                 class="text-green-500"
                 aria-label={$t('class.moderator')}
@@ -242,12 +242,12 @@
     </label>
   {/if}
   <input
-    class="hidden comment-expand"
+    class="appearance-none absolute inset-0 pointer-events-none comment-expand"
     type="checkbox"
     id="comment-expand-{node.comment_view.comment.id}"
     bind:checked={open}
   />
-  <div class={['expand max-w-full', contentClass]}>
+  <div class={['expand max-w-full', contentClass]} inert={!open}>
     <div id="comment-content">
       <div
         class={[
diff --git a/src/lib/ui/shared/disclosure/Disclosure.svelte b/src/lib/ui/shared/disclosure/Disclosure.svelte
index 272e0e09..a5e39c91 100644
--- a/src/lib/ui/shared/disclosure/Disclosure.svelte
+++ b/src/lib/ui/shared/disclosure/Disclosure.svelte
@@ -22,13 +22,18 @@
   const id = $props.id()
 </script>
 
-<div {...rest} class={['w-full', clazz]}>
+<div {...rest} class={['w-full relative', clazz]}>
   <label for={id} class="w-full">
     {@render summary?.({ open })}
   </label>
   {@render extended?.()}
-  <input {id} class="hidden input" type="checkbox" bind:checked={open} />
-  <div class="expand">
+  <input
+    {id}
+    class="appearance-none absolute w-full h-full inset-0 pointer-events-none"
+    type="checkbox"
+    bind:checked={open}
+  />
+  <div class="expand" inert={!open}>
     {@render children?.({ open })}
   </div>
 </div>
@@ -42,7 +47,7 @@
     transition: grid-template-rows 0.5s cubic-bezier(0.19, 1, 0.22, 1);
   }
 
-  .input:checked + .expand {
+  input:checked + .expand {
     grid-template-rows: 1fr;
   }
 
diff --git a/src/lib/ui/shared/modal/Modal.svelte b/src/lib/ui/shared/modal/Modal.svelte
index 7ebeeb3f..58e967f8 100644
--- a/src/lib/ui/shared/modal/Modal.svelte
+++ b/src/lib/ui/shared/modal/Modal.svelte
@@ -94,7 +94,7 @@
     >
       <div
         bind:this={el}
-        use:trapFocus
+        use:trapFocus={true}
         transition:scale|global={{
           start: 0.97,
           easing: backOut,
diff --git a/src/routes/modlog/item/ModlogItemTable.svelte b/src/routes/modlog/item/ModlogItemTable.svelte
index 1628da01..ff24ec06 100644
--- a/src/routes/modlog/item/ModlogItemTable.svelte
+++ b/src/routes/modlog/item/ModlogItemTable.svelte
@@ -15,9 +15,11 @@
 </script>
 
 {#snippet itemInfo()}
-  <Button color="primary" rounding="pill" class="w-max" href={item.link}>
-    {$t('common.jump')}
-  </Button>
+  {#if item.link}
+    <Button color="primary" rounding="pill" class="w-max" href={item.link}>
+      {$t('common.jump')}
+    </Button>
+  {/if}
   {#if item.moderatee}
     <UserLink avatar user={item.moderatee} />
   {/if}
@@ -71,6 +73,8 @@
       >
         {$t('common.info')}
       </Button>
+    {:else if item.moderatee}
+      <UserLink user={item.moderatee} />
     {/if}
   </td>
 </tr>
-- 
2.51.2