add autofocus, update themes, translate 'submit'

src/components/post-form/post-form.tsx

@@ -128,7 +128,6 @@ const PostFormTable = () => {
   useEffect(() => {
     if (typeof replyIndex === 'number') {
       resetContent();
-      window.scrollTo(0, document.body.scrollHeight);
     }
   }, [replyIndex, resetContent]);
 

src/components/reply-modal/reply-modal.tsx

@@ -89,7 +89,15 @@ const ReplyModal = ({ closeModal, parentCid }: ReplyModalProps) => {
           <input type='text' ref={urlRef} placeholder={_.capitalize(t('link'))} onChange={(e) => setContent.link(e.target.value)} />
         </div>
         <div className={styles.content}>
-          <textarea cols={48} rows={4} wrap='soft' ref={textRef} placeholder={_.capitalize(t('comment'))} onChange={(e) => setContent.content(e.target.value)} />
+          <textarea
+            cols={48}
+            rows={4}
+            wrap='soft'
+            ref={textRef}
+            placeholder={_.capitalize(t('comment'))}
+            onChange={(e) => setContent.content(e.target.value)}
+            autoFocus
+          />
         </div>
         <div className={styles.footer}>
           <button onClick={onPublishReply}>{t('reply')}</button>

src/components/subplebbit-description/subplebbit-description.tsx

@@ -2,14 +2,15 @@ import Post from '../post';
 import { useTranslation } from 'react-i18next';
 
 interface DescriptionPostProps {
-  subplebbitAddress: string | undefined;
+  avatarUrl?: string;
   createdAt: number;
   description: string;
-  avatarUrl?: string;
+  shortAddress: string;
+  subplebbitAddress: string | undefined;
   title: string;
 }
 
-const SubplebbitDescription = ({ subplebbitAddress, createdAt, description, avatarUrl, title }: DescriptionPostProps) => {
+const SubplebbitDescription = ({ avatarUrl, createdAt, description, shortAddress, subplebbitAddress, title }: DescriptionPostProps) => {
   const { t } = useTranslation();
   const post = {
     isDescription: true,
@@ -18,7 +19,7 @@ const SubplebbitDescription = ({ subplebbitAddress, createdAt, description, avat
     author: { displayName: '## Board Mods' },
     content: description,
     link: avatarUrl,
-    title: t('welcome_to_board', { board: title }),
+    title: t('welcome_to_board', { board: title || `p/${shortAddress}` }),
     pinned: true,
     locked: true,
   };

src/themes.css

@@ -317,7 +317,7 @@
   --boardnav-desktop-link-text-decoration-hover: underline;
   --boardnav-mobile-background-color: #f0e0d6;
   --boardnav-mobile-border-bottom: 2px solid #d9c5b7;
-  --boardnav-mobile-font-size: 11pt;
+  --boardnav-mobile-font-size: 10pt;
   --boardnav-mobile-button-text-color: #00f;
 
   /* board title */
@@ -440,7 +440,7 @@
   --boardnav-desktop-link-text-decoration-hover: underline;
   --boardnav-mobile-background-color: #d6daf0;
   --boardnav-mobile-border-bottom: 2px solid #b7c5d9;
-  --boardnav-mobile-font-size: 11pt;
+  --boardnav-mobile-font-size: 10pt;
   --boardnav-mobile-button-text-color: #34345c;
 
   /* body */

src/views/board/board.tsx

@@ -67,7 +67,14 @@ const Board = () => {
         <>
           {rules && rules.length > 0 && <SubplebbitRules subplebbitAddress={subplebbitAddress} createdAt={createdAt} rules={rules} />}
           {description && description.length > 0 && (
-            <SubplebbitDescription avatarUrl={suggested?.avatarUrl} subplebbitAddress={subplebbitAddress} createdAt={createdAt} description={description} title={title} />
+            <SubplebbitDescription
+              avatarUrl={suggested?.avatarUrl}
+              subplebbitAddress={subplebbitAddress}
+              createdAt={createdAt}
+              description={description}
+              shortAddress={shortAddress}
+              title={title}
+            />
           )}
         </>
       )}

src/views/catalog/catalog.tsx

@@ -8,6 +8,7 @@ import useWindowWidth from '../../hooks/use-window-width';
 import CatalogRow from '../../components/catalog-row';
 import LoadingEllipsis from '../../components/loading-ellipsis';
 import styles from './catalog.module.css';
+import _ from 'lodash';
 
 const lastVirtuosoStates: { [key: string]: StateSnapshot } = {};
 
@@ -32,7 +33,7 @@ const useFeedRows = (columnCount: number, feed: any, isFeedLoaded: boolean, subp
         author: { displayName: '## Board Mods' },
         content: description,
         link: avatarUrl,
-        title: 'Welcome to ' + (title || `p/${shortAddress}`),
+        title: t('welcome_to_board', { board: title || `p/${shortAddress}` }),
         pinned: true,
         locked: true,
       });
@@ -44,13 +45,13 @@ const useFeedRows = (columnCount: number, feed: any, isFeedLoaded: boolean, subp
         timestamp: createdAt,
         author: { displayName: '## Board Mods' },
         content: rules.map((rule: string, index: number) => `${index + 1}. ${rule}`).join('\n'),
-        title: 'Rules',
+        title: _.capitalize(t('rules')),
         pinned: true,
         locked: true,
       });
     }
     return _feed;
-  }, [feed, description, rules, address, isFeedLoaded, createdAt, title, shortAddress, avatarUrl]);
+  }, [feed, description, rules, address, isFeedLoaded, createdAt, title, shortAddress, avatarUrl, t]);
 
   // Memoize rows calculation, ensuring it updates on changes to the modified feed or column count
   const rows = useMemo(() => {

src/views/post-page/post-page.tsx

@@ -16,7 +16,7 @@ const PostPage = () => {
   const { commentCid, subplebbitAddress } = params;
 
   const subplebbit = useSubplebbit({ subplebbitAddress });
-  const { createdAt, description, rules, suggested, title } = subplebbit;
+  const { createdAt, description, rules, shortAddress, suggested, title } = subplebbit;
 
   const location = useLocation();
   const isInDescriptionView = isDescriptionView(location.pathname, params);
@@ -36,7 +36,14 @@ const PostPage = () => {
     <div className={styles.content}>
       {showReplyModal && activeCid && <ReplyModal closeModal={closeModal} parentCid={activeCid} />}
       {isInDescriptionView ? (
-        <SubplebbitDescription avatarUrl={suggested?.avatarUrl} createdAt={createdAt} description={description} subplebbitAddress={subplebbitAddress} title={title} />
+        <SubplebbitDescription
+          avatarUrl={suggested?.avatarUrl}
+          createdAt={createdAt}
+          description={description}
+          subplebbitAddress={subplebbitAddress}
+          shortAddress={shortAddress}
+          title={title}
+        />
       ) : isInRulesView ? (
         <SubplebbitRules createdAt={createdAt} rules={rules} subplebbitAddress={subplebbitAddress} />
       ) : (