feat(react/settings): port override theme fonts

apps/client/src/widgets/react/Column.tsx

@@ -1,13 +1,14 @@
 import type { ComponentChildren } from "preact";
 
 interface ColumnProps {
-    md: number;
+    md?: number;
     children: ComponentChildren;
+    className?: string;
 }
 
-export default function Column({ md, children }: ColumnProps) {
+export default function Column({ md, children, className }: ColumnProps) {
     return (
-        <div className={`col-md-${md}`}>
+        <div className={`col-md-${md ?? 6} ${className ?? ""}`}>
             {children}
         </div>
     )

apps/client/src/widgets/react/hooks.tsx

@@ -5,6 +5,7 @@ import SpacedUpdate from "../../services/spaced_update";
 import { OptionNames } from "@triliumnext/commons";
 import options from "../../services/options";
 import utils, { reloadFrontendApp } from "../../services/utils";
+import { __values } from "tslib";
 
 /**
  * Allows a React component to react to Trilium events (e.g. `entitiesReloaded`). When the desired event is triggered, the handler is invoked with the event parameters.
@@ -93,6 +94,14 @@ export function useTriliumOption(name: OptionNames, needsRefresh?: boolean): [st
     ]
 }
 
+export function useTriliumOptionBool(name: OptionNames): [boolean, (newValue: boolean) => Promise<void>] {
+    const [ value, setValue ] = useTriliumOption(name);
+    return [
+        (value === "true"),
+        (newValue) => setValue(newValue ? "true" : "false")
+    ]
+}
+
 /**
  * Generates a unique name via a random alphanumeric string of a fixed length.
  *