Resolve #6858

locales/ja-JP.yml

@@ -649,6 +649,7 @@ pageLikesCount: "Pageにいいねした数"
 pageLikedCount: "Pageにいいねされた数"
 reversiCount: "リバーシの対局数"
 contact: "連絡先"
+useSystemFont: "システムのデフォルトのフォントを使う"
 
 _aboutMisskey:
   about: "Misskeyはsyuiloによって2014年から開発されている、オープンソースのソフトウェアです。"

src/client/pages/settings/general.vue

@@ -33,11 +33,12 @@
 		<FormSwitch v-model:value="disableAnimatedMfm">{{ $t('disableAnimatedMfm') }}</FormSwitch>
 		<FormSwitch v-model:value="reduceAnimation">{{ $t('reduceUiAnimation') }}</FormSwitch>
 		<FormSwitch v-model:value="useBlurEffectForModal">{{ $t('useBlurEffectForModal') }}</FormSwitch>
+		<FormSwitch v-model:value="loadRawImages">{{ $t('loadRawImages') }}</FormSwitch>
+		<FormSwitch v-model:value="disableShowingAnimatedImages">{{ $t('disableShowingAnimatedImages') }}</FormSwitch>
+		<FormSwitch v-model:value="useSystemFont">{{ $t('useSystemFont') }}</FormSwitch>
 		<FormSwitch v-model:value="useOsNativeEmojis">{{ $t('useOsNativeEmojis') }}
 			<div><Mfm text="🍮🍦🍭🍩🍰🍫🍬🥞🍪"/></div>
 		</FormSwitch>
-		<FormSwitch v-model:value="loadRawImages">{{ $t('loadRawImages') }}</FormSwitch>
-		<FormSwitch v-model:value="disableShowingAnimatedImages">{{ $t('disableShowingAnimatedImages') }}</FormSwitch>
 	</FormGroup>
 
 	<FormRadios v-model="fontSize">
@@ -118,6 +119,7 @@ export default defineComponent({
 			langs,
 			lang: localStorage.getItem('lang'),
 			fontSize: localStorage.getItem('fontSize'),
+			useSystemFont: localStorage.getItem('useSystemFont') != null,
 			faImage, faCog, faColumns
 		}
 	},
@@ -221,6 +223,15 @@ export default defineComponent({
 			location.reload();
 		},
 
+		useSystemFont() {
+			if (this.useSystemFont) {
+				localStorage.setItem('useSystemFont', 't');
+			} else {
+				localStorage.removeItem('useSystemFont');
+			}
+			location.reload();
+		},
+
 		enableInfiniteScroll() {
 			location.reload()
 		},

src/client/style.scss

@@ -27,7 +27,7 @@ html {
 	color: var(--fg);
 	overflow: auto;
 	font-family: "BIZ UDPGothic", Roboto, HelveticaNeue, Arial, sans-serif;
-	line-height: 1.3em;
+	line-height: 1.35em;
 	text-size-adjust: 100%;
 
 	&, * {
@@ -75,6 +75,10 @@ html {
 	&.f-veryLarge {
 		font-size: 1.2em;
 	}
+
+	&.useSystemFont {
+		font-family: sans-serif;
+	}
 }
 
 html.changing-theme {

src/server/web/views/base.pug

@@ -94,6 +94,11 @@ html
 				document.documentElement.classList.add('f-' + fontSize);
 			}
 
+			const useSystemFont = localStorage.getItem('useSystemFont');
+			if (useSystemFont) {
+				document.documentElement.classList.add('useSystemFont');
+			}
+
 			const wallpaper = localStorage.getItem('wallpaper');
 			if (wallpaper) {
 				document.documentElement.style.backgroundImage = `url(${wallpaper})`;