fix: space/shift+space scrolls focused panel, revert content font, fix share modal text

Space/Shift+Space now scrolls whichever panel is focused (entry list,
detail panel, or sidebar) instead of only working in the detail panel.
Removed content font setting. Fixed share modal placeholder casing and
ellipsis spacing.

2 files changed, 24 insertions, 24 deletions

diff --git a/apps/web/lib/hooks/use-keyboard-navigation.ts b/apps/web/lib/hooks/use-keyboard-navigation.ts
index 8685396..275db29 100644
--- a/apps/web/lib/hooks/use-keyboard-navigation.ts
+++ b/apps/web/lib/hooks/use-keyboard-navigation.ts
@@ -153,6 +153,28 @@ export function useKeyboardNavigation() {
         return
       }
 
+      if (event.key === " ") {
+        const scrollSelectors: Record<string, string> = {
+          entryList: "[data-entry-list-scroll]",
+          detailPanel: "[data-detail-article]",
+          sidebar: "[data-sidebar-nav]",
+        }
+        const selector = scrollSelectors[focusedPanel]
+        const scrollableElement = selector
+          ? document.querySelector<HTMLElement>(selector)
+          : null
+        if (scrollableElement) {
+          event.preventDefault()
+          const pageScrollAmount = scrollableElement.clientHeight * 0.8
+          if (event.shiftKey) {
+            scrollableElement.scrollTop -= pageScrollAmount
+          } else {
+            scrollableElement.scrollTop += pageScrollAmount
+          }
+        }
+        return
+      }
+
       if (focusedPanel === "sidebar") {
         handleSidebarKeyDown(event)
         return
@@ -368,7 +390,6 @@ export function useKeyboardNavigation() {
 
     function handleDetailPanelKeyDown(event: KeyboardEvent) {
       const SCROLL_AMOUNT = 100
-      const PAGE_SCROLL_FRACTION = 0.8
       const detailArticle = document.querySelector<HTMLElement>(
         "[data-detail-article]"
       )
@@ -386,19 +407,6 @@ export function useKeyboardNavigation() {
           if (detailArticle) detailArticle.scrollTop -= SCROLL_AMOUNT
           break
         }
-        case " ": {
-          event.preventDefault()
-          if (detailArticle) {
-            const pageScrollAmount =
-              detailArticle.clientHeight * PAGE_SCROLL_FRACTION
-            if (event.shiftKey) {
-              detailArticle.scrollTop -= pageScrollAmount
-            } else {
-              detailArticle.scrollTop += pageScrollAmount
-            }
-          }
-          break
-        }
         case "?": {
           event.preventDefault()
           toggleShortcutsDialog()
@@ -517,9 +525,9 @@ export function useKeyboardNavigation() {
       }
     }
 
-    document.addEventListener("keydown", handleKeyDown)
+    document.addEventListener("keydown", handleKeyDown, true)
 
-    return () => document.removeEventListener("keydown", handleKeyDown)
+    return () => document.removeEventListener("keydown", handleKeyDown, true)
   }, [
     selectedEntryIdentifier,
     focusedEntryIdentifier,
diff --git a/apps/web/lib/stores/user-interface-store.ts b/apps/web/lib/stores/user-interface-store.ts
index fdee347..01dceba 100644
--- a/apps/web/lib/stores/user-interface-store.ts
+++ b/apps/web/lib/stores/user-interface-store.ts
@@ -7,8 +7,6 @@ type DisplayDensity = "compact" | "default" | "spacious"
 
 type FontSize = "small" | "default" | "large"
 
-type ContentFont = "sans-serif" | "serif" | "monospace"
-
 type TimeDisplayFormat = "relative" | "absolute"
 
 type FocusedPanel = "sidebar" | "entryList" | "detailPanel"
@@ -40,7 +38,6 @@ interface UserInterfaceState {
   showFeedFavicons: boolean
   focusFollowsInteraction: boolean
   fontSize: FontSize
-  contentFont: ContentFont
   timeDisplayFormat: TimeDisplayFormat
   showEntryImages: boolean
   showReadingTime: boolean
@@ -65,7 +62,6 @@ interface UserInterfaceState {
   setShowFeedFavicons: (show: boolean) => void
   setFocusFollowsInteraction: (enabled: boolean) => void
   setFontSize: (size: FontSize) => void
-  setContentFont: (font: ContentFont) => void
   setTimeDisplayFormat: (format: TimeDisplayFormat) => void
   setShowEntryImages: (show: boolean) => void
   setShowReadingTime: (show: boolean) => void
@@ -94,7 +90,6 @@ export const useUserInterfaceStore = create<UserInterfaceState>()(
       showFeedFavicons: true,
       focusFollowsInteraction: false,
       fontSize: "default",
-      contentFont: "sans-serif",
       timeDisplayFormat: "relative",
       showEntryImages: true,
       showReadingTime: true,
@@ -139,8 +134,6 @@ export const useUserInterfaceStore = create<UserInterfaceState>()(
 
       setFontSize: (size) => set({ fontSize: size }),
 
-      setContentFont: (font) => set({ contentFont: font }),
-
       setTimeDisplayFormat: (format) => set({ timeDisplayFormat: format }),
 
       setShowEntryImages: (show) => set({ showEntryImages: show }),
@@ -194,7 +187,6 @@ export const useUserInterfaceStore = create<UserInterfaceState>()(
         focusFollowsInteraction: state.focusFollowsInteraction,
         expandedFolderIdentifiers: state.expandedFolderIdentifiers,
         fontSize: state.fontSize,
-        contentFont: state.contentFont,
         timeDisplayFormat: state.timeDisplayFormat,
         showEntryImages: state.showEntryImages,
         showReadingTime: state.showReadingTime,