From 80cbf29bdf7c6cd3695d1e4cf49a8e38bff847ed Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 27 Jun 2024 00:59:24 +0300
Subject: fields for user font overrides

---
 .../settings_modal/tabs/appearance_tab.vue         | 45 ++++++++++++++++++++++
 1 file changed, 45 insertions(+)

(limited to 'src/components/settings_modal/tabs/appearance_tab.vue')

diff --git a/src/components/settings_modal/tabs/appearance_tab.vue b/src/components/settings_modal/tabs/appearance_tab.vue
index 5356292e..fb24cc6b 100644
--- a/src/components/settings_modal/tabs/appearance_tab.vue
+++ b/src/components/settings_modal/tabs/appearance_tab.vue
@@ -34,6 +34,51 @@
             </small>
           </div>
         </li>
+        <li>
+          <h3>{{ $t('settings.style.interface_font_user_override') }}</h3>
+          <ul class="setting-list">
+            <li>
+              <FontControl
+                :model-value="fontsOverride.interface"
+                name="ui"
+                :label="$t('settings.style.fonts.components.interface')"
+                :fallback="{ family: 'sans-serif' }"
+                no-inherit="1"
+                @update:modelValue="v => $store.dispatch('setOption', { name: 'fontsOverride', value: { ...fontsOverride, interface: v } })"
+              />
+            </li>
+            <li>
+              <FontControl
+                v-if="expertLevel > 0"
+                :model-value="fontsOverride.input"
+                name="input"
+                :fallback="{ family: 'inherit' }"
+                :label="$t('settings.style.fonts.components.input')"
+                @update:modelValue="v => $store.dispatch('setOption', { name: 'fontsOverride', value: { ...fontsOverride, input: v } })"
+              />
+            </li>
+            <li>
+              <FontControl
+                v-if="expertLevel > 0"
+                :model-value="fontsOverride.post"
+                name="post"
+                :fallback="{ family: 'inherit' }"
+                :label="$t('settings.style.fonts.components.post')"
+                @update:modelValue="v => $store.dispatch('setOption', { name: 'fontsOverride', value: { ...fontsOverride, post: v } })"
+              />
+            </li>
+            <li>
+              <FontControl
+                v-if="expertLevel > 0"
+                :model-value="fontsOverride.postCode"
+                name="postCode"
+                :fallback="{ family: 'monospace' }"
+                :label="$t('settings.style.fonts.components.postCode')"
+                @update:modelValue="v => $store.dispatch('setOption', { name: 'fontsOverride', value: { ...fontsOverride, postCode: v } })"
+              />
+            </li>
+          </ul>
+        </li>
         <li>
           <UnitSetting
             path="emojiSize"
-- 
cgit v1.2.3-70-g09d2