From 580ac4b61a439cade37fcf3020a1c0011acc9687 Mon Sep 17 00:00:00 2001
From: plebeius <tom@plebbit.com>
Date: Mon, 10 Nov 2025 19:09:02 +0100
Subject: [PATCH] refactor(directory-modal): consolidate sections and improve
 mobile positioning

---
 .../directory-modal.module.css                |  8 +++-
 .../directory-modal/directory-modal.tsx       | 40 ++++---------------
 2 files changed, 14 insertions(+), 34 deletions(-)

diff --git a/src/components/directory-modal/directory-modal.module.css b/src/components/directory-modal/directory-modal.module.css
index 6b30acb1..f088de7e 100644
--- a/src/components/directory-modal/directory-modal.module.css
+++ b/src/components/directory-modal/directory-modal.module.css
@@ -31,9 +31,13 @@
 @media (max-width: 600px) {
   .directoryDialog {
     width: calc(100% - 20px);
-    margin-left: -50%;
-    left: 50%;
     max-width: 500px;
+    left: 50%;
+    top: 50%;
+    margin-left: 0;
+    transform: translate(-50%, -50%);
+    max-height: calc(100vh - 40px);
+    overflow-y: auto;
   }
 }
 
diff --git a/src/components/directory-modal/directory-modal.tsx b/src/components/directory-modal/directory-modal.tsx
index b7784de4..3edada33 100644
--- a/src/components/directory-modal/directory-modal.tsx
+++ b/src/components/directory-modal/directory-modal.tsx
@@ -29,20 +29,10 @@ const DirectoryModal = () => {
             <strong>The board you clicked on doesn&apos;t exist yet, but it can be yours!</strong>
           </p>
 
-          <div className={styles.section}>
-            <h3>Directory vs Regular Board</h3>
-            <p>
-              A &quot;directory board&quot; is assigned to a category on the homepage (like &quot;Anime & Manga&quot; or &quot;Video Games&quot;). Directory assignments
-              are temporary and handpicked by devs until DAO curation is implemented.{' '}
-              <strong>Anyone can create a board and users can access it anytime using its address</strong>—use the search bar, direct links, or the
-              &quot;[Subscribe]&quot; button to access boards regardless of directory assignment.
-            </p>
-          </div>
-
           <div className={styles.section}>
             <h3>Creating Your Board</h3>
             <p>
-              Create a board using the{' '}
+              <strong>Anyone can create a board</strong> using the{' '}
               <a href='https://plebbit.github.io/docs/learn/clients/5chan/create-a-board' target='_blank' rel='noopener noreferrer'>
                 Seedit GUI client
               </a>{' '}
@@ -50,27 +40,21 @@ const DirectoryModal = () => {
               <a href='https://github.com/plebbit/plebbit-cli' target='_blank' rel='noopener noreferrer'>
                 plebbit-cli
               </a>
-              . <strong>Build a following:</strong> Users can subscribe to your board via the &quot;[Subscribe]&quot; button, which adds it to their top bar. You can gain
-              subscribers through direct links, word of mouth, or search—no directory assignment or dev approval needed.
+              . Users can access it anytime via the search bar, direct links, or by subscribing with the &quot;[Subscribe]&quot; button—
+              <strong>no directory assignment or dev approval needed</strong>. Directory boards are simply featured in homepage categories (like &quot;Anime &
+              Manga&quot;) and are handpicked by devs until DAO curation is implemented.
             </p>
           </div>
 
           <div className={styles.section}>
-            <h3>Directory Requirements</h3>
+            <h3>Directory Submission</h3>
             <p>
-              Boards need 99% uptime (they&apos;re P2P nodes), plus be active, well-moderated, and relevant to the category. Devs review and approve/reject based on these
-              criteria.
-            </p>
-          </div>
-
-          <div className={styles.section}>
-            <h3>Submitting to a Directory</h3>
-            <p>
-              Open a PR editing{' '}
+              To submit your board, open a PR editing{' '}
               <a href='https://github.com/plebbit/lists/blob/master/5chan-multisub.json' target='_blank' rel='noopener noreferrer'>
                 5chan-multisub.json
               </a>{' '}
-              with your board&apos;s title, address, and NSFW status. Devs will review and merge if approved. 99% uptime is required.
+              with your board&apos;s title, address, and NSFW status. Requirements: 99% uptime (they&apos;re P2P nodes), active, well-moderated, and relevant to the
+              category. Devs will review and approve/reject based on these criteria.
             </p>
           </div>
 
@@ -85,14 +69,6 @@ const DirectoryModal = () => {
               .
             </p>
           </div>
-
-          <div className={styles.section}>
-            <h3>Decentralization</h3>
-            <p>
-              Devs can change directories via commits in the open-source repo. No centralized servers—anyone can fork, modify, and redeploy to their own domain. 5chan is
-              adminless with no central authority.
-            </p>
-          </div>
         </div>
         <div className={styles.directoryFooter}>
           <button onClick={closeDirectoryModal}>Close</button>