fix and simplify font settings

src/components/font_control/font_control.vue

@@ -23,7 +23,7 @@
     </div>
     {{ ' ' }}
     <div
-      v-if="modelValue?.family"
+      v-if="modelValue"
       class="font-input setting-item"
     >
       <label
@@ -67,10 +67,10 @@
         </button>
         <input
           :id="name"
-          :model-value="modelValue.family"
+          :model-value="modelValue"
           class="input custom-font"
           type="text"
-          @update:modelValue="$emit('update:modelValue', { ...(modelValue || {}), family: $event.target.value })"
+          @update:modelValue="$emit('update:modelValue', $event.target.value)"
         >
       </span>
       <span
@@ -89,9 +89,9 @@
         </button>
         <Select
           :id="name + '-local-font-switcher'"
-          :model-value="modelValue?.family"
+          :model-value="modelValue"
           class="custom-font"
-          @update:model-value="v => $emit('update:modelValue', { ...(modelValue || {}), family: v })"
+          @update:model-value="v => $emit('update:modelValue', v)"
         >
           <optgroup
             :label="$t('settings.style.themes3.font.group-builtin')"

src/modules/default_config_state.js

@@ -635,22 +635,22 @@ export const LOCAL_DEFAULT_CONFIG_DEFINITIONS = {
   },
   fontInterface: {
     description: 'Interface font override',
-    type: 'object',
+    type: 'string',
     default: null,
   },
   fontInput: {
     description: 'Input font override',
-    type: 'object',
+    type: 'string',
     default: null,
   },
   fontPosts: {
     description: 'Post font override',
-    type: 'object',
+    type: 'string',
     default: null,
   },
   fontMonospace: {
     description: 'Monospace font override',
-    type: 'object',
+    type: 'string',
     default: null,
   },
   themeDebug: {

src/services/theme_data/theme2_to_theme3.js

@@ -262,7 +262,7 @@ export const convertTheme2To3 = (data) => {
     Object.keys(data.fonts || {}).forEach((key) => {
       if (!fontsKeys.has(key)) return
       if (!data.fonts[key]) return
-      const originalFont = data.fonts[key].family
+      const originalFont = data.fonts[key]
       const rule = { source: '2to3' }
 
       switch (key) {

src/services/theme_data/theme_data.service.js

@@ -619,7 +619,7 @@ export const generateFonts = (input) => {
     rules: {
       fonts: Object.entries(fonts)
         .filter(([, v]) => v)
-        .map(([k, v]) => `--${k}Font: ${v.family}`)
+        .map(([k, v]) => `--${k}Font: ${v}`)
         .join(';'),
     },
     theme: {

src/stores/interface.js

@@ -196,7 +196,7 @@ export const useInterfaceStore = defineStore('interface', {
       }
     },
     setFontsList(value) {
-      this.localFonts = [...new Set(value.map((font) => font.family)).values()]
+      this.localFonts = [...new Set(value.map((font) => font)).values()]
     },
     queryLocalFonts() {
       if (this.localFonts !== null) return
@@ -654,7 +654,7 @@ export const useInterfaceStore = defineStore('interface', {
         }
 
         Object.entries(fontMap).forEach(([font, component]) => {
-          const family = mergedConfig[`font${font}`]?.family
+          const family = mergedConfig[`font${font}`]
           const variable = font === 'Monospace' ? '--monoFont' : '--font'
           if (family) {
             hacks.push({

test/unit/specs/stores/sync_config.spec.js

@@ -238,8 +238,8 @@ describe('The SyncConfig store', () => {
         store.pushSyncConfig = () => {
           /* no-op */
         }
-        store.setPreference({ path: 'simple.fontInput.family', value: 'test' })
+        store.setPreference({ path: 'simple.fontInput', value: 'test' })
-        store.unsetPreference({ path: 'simple.fontInput.family' })
+        store.unsetPreference({ path: 'simple.fontInput' })
         store.updateCache(store, { username: 'test' })
         expect(store.prefsStorage.simple.fontInput).to.not.have.property(
           'family',