aboutsummaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/font_control/font_control.js2
-rw-r--r--src/components/settings_modal/tabs/appearance_tab.js8
-rw-r--r--src/components/settings_modal/tabs/appearance_tab.vue45
3 files changed, 53 insertions, 2 deletions
diff --git a/src/components/font_control/font_control.js b/src/components/font_control/font_control.js
index f6f45c8c..08d0907e 100644
--- a/src/components/font_control/font_control.js
+++ b/src/components/font_control/font_control.js
@@ -30,7 +30,7 @@ export default {
emits: ['update:modelValue'],
data () {
return {
- manualEntry: true,
+ manualEntry: false,
availableOptions: [
this.noInherit ? '' : 'inherit',
'serif',
diff --git a/src/components/settings_modal/tabs/appearance_tab.js b/src/components/settings_modal/tabs/appearance_tab.js
index d9a0429a..3776464a 100644
--- a/src/components/settings_modal/tabs/appearance_tab.js
+++ b/src/components/settings_modal/tabs/appearance_tab.js
@@ -4,6 +4,8 @@ import IntegerSetting from '../helpers/integer_setting.vue'
import FloatSetting from '../helpers/float_setting.vue'
import UnitSetting, { defaultHorizontalUnits } from '../helpers/unit_setting.vue'
+import FontControl from 'src/components/font_control/font_control.vue'
+
import SharedComputedObject from '../helpers/shared_computed_object.js'
import ProfileSettingIndicator from '../helpers/profile_setting_indicator.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
@@ -36,12 +38,16 @@ const AppearanceTab = {
IntegerSetting,
FloatSetting,
UnitSetting,
- ProfileSettingIndicator
+ ProfileSettingIndicator,
+ FontControl
},
computed: {
horizontalUnits () {
return defaultHorizontalUnits
},
+ fontsOverride () {
+ return this.$store.getters.mergedConfig.fontsOverride
+ },
columns () {
const mode = this.$store.getters.mergedConfig.thirdColumnMode
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
@@ -35,6 +35,51 @@
</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"
step="0.1"