[[blog]] fixed font size handling for composition and display

Author: soapdog

ui/packages/blog/BlogCard.js

@@ -2,6 +2,8 @@ const m = require("mithril")
 const Card = require("../../core/components/Card.js")
 const VoteCounter = require("../../core/components/VoteCounter.js")
 const { when } = require("../../core/kernel/utils.js")
+const { getPref } = require("../../core/kernel/prefs.js")
+
 
 const BlogCard = {
   oninit: vnode => {
@@ -24,6 +26,12 @@ const BlogCard = {
       vnode.state.liked = ms.includes(ssb.feed)
       m.redraw()
     })
+
+    patchfox.listen(
+      "preferences:changed",
+      () => {
+        m.redraw()
+      })
   },
   view: vnode => {
     console.log("hit")
@@ -193,7 +201,9 @@ const BlogCard = {
       when(title, m("h5.card-title.h5", title)),
       when(vnode.state.toast, m(".toast.toast-error", `Can't load blogpost: ${vnode.state.toastMsg}`)),
       when(vnode.state.hasContentWarning, m(".toast.toast-primary"),m("p", [m("b", "Content warning:"), msg.value.contentWarning])),
-      m("article.prose", vnode.state.showBlogpost ? m.trust(post) : m.trust(summary)),
+      m("article.prose",{
+        class: getPref("textSize", "prose")
+      }, vnode.state.showBlogpost ? m.trust(post) : m.trust(summary)),
     ])
   },
 }

ui/packages/blog/BlogCompose.js

@@ -65,6 +65,12 @@ const BlogCompose = {
     vnode.state.summary = vnode.attrs.summary || ""
     vnode.state.title = vnode.attrs.title || ""
     vnode.state.thumbnail = vnode.attrs.thumbnail || false
+
+    patchfox.listen(
+      "preferences:changed",
+      () => {
+        m.redraw()
+      })
   },
   oncreatee: vnode => {
     drop(document.getElementById("content"), files => readFileAndAttach(vnode, files))

ui/packages/settings/DisplayPreferences.js

@@ -132,9 +132,9 @@ const DisplayPreferences = {
         { class: "prose-xl", value: "prose-xl", label: "Extra Large" },
       ]),
       makeSelect(setComposeSize, "Text size for composing posts", [
-        { class: "prose", value: "prose", label: "Normal" },
-        { class: "prose-lg", value: "prose-lg", label: "Large" },
-        { class: "prose-xl", value: "prose-xl", label: "Extra Large" },
+        { class: "prose", value: "text", label: "Normal" },
+        { class: "prose-lg", value: "text-lg", label: "Large" },
+        { class: "prose-xl", value: "text-xl", label: "Extra Large" },
       ]),
       makeInput(setLimit, "Messages per page", "number", limit),
       m("h2.uppercase.font-medium.text-lg.mt-4", "Message Types"),