diff --git a/locales/en-US.yml b/locales/en-US.yml index d89ff098ac..e7003e1c2a 100644 --- a/locales/en-US.yml +++ b/locales/en-US.yml @@ -1356,6 +1356,13 @@ _nsfw: respect: "Hide NSFW media" ignore: "Don't hide NSFW media" force: "Hide all media" +writingMode: "Writing mode" +_writingMode: + horizontalTB: "Horizontal, top to bottom" + verticalLR: "Vertical, left to right, sideways" + verticalRL: "Vertical, right to left, sideways" + verticalLRUpright: "Vertical, left to right, upright" + verticalRLUpright: "Vertical, right to left, upright" _mfm: play: "Play MFM" stop: "Stop MFM" diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 4e8c4edc57..2f28757337 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -1121,6 +1121,13 @@ _nsfw: respect: "閲覧注意のメディアは隠す" ignore: "閲覧注意のメディアを隠さない" force: "常にメディアを隠す" +writingMode: "組み方向" +_writingMode: + horizontalTB: "横組み、上から下" + verticalLR: "縦組み、左から右、英数字90度回転" + verticalRL: "縦組み、右から左、英数字90度回転" + verticalLRUpright: "縦組み、左から右、英数字1字ずつ配置" + verticalRLUpright: "縦組み、右から左、英数字1字ずつ配置" _mfm: cheatSheet: "MFMチートシート" intro: "MFMは、MisskeyやFirefish、Akkomaなどの様々な場所で使用できるマークアップ言語です。ここでは、MFMで使用可能な構文一覧が確認できます。" diff --git a/locales/zh-CN.yml b/locales/zh-CN.yml index 3d80c0fcfd..1f755fcd74 100644 --- a/locales/zh-CN.yml +++ b/locales/zh-CN.yml @@ -1012,6 +1012,13 @@ _nsfw: respect: "隐藏敏感内容" ignore: "不隐藏敏感内容" force: "总是隐藏内容" +writingMode: "书写方向" +_writingMode: + horizontalTB: "横排,由上向下" + verticalLR: "直排,由左向右,字母旋转90°" + verticalRL: "直排,由右向左,字母旋转90°" + verticalLRUpright: "直排,由左向右,字母逐个排列" + verticalRLUpright: "直排,由右向左,字母逐个排列" _mfm: cheatSheet: "MFM 代码速查表" intro: "MFM 是一种在 Misskey、Firefish、Akkoma 中使用的标记语言,可以在很多地方使用。您可以在此处查看所有可用的 MFM 语法的列表。" diff --git a/locales/zh-TW.yml b/locales/zh-TW.yml index 6c8f1c4727..ba7bedcd7c 100644 --- a/locales/zh-TW.yml +++ b/locales/zh-TW.yml @@ -1004,6 +1004,13 @@ _nsfw: respect: "隱藏敏感內容" ignore: "不隱藏敏感內容" force: "隱藏所有內容" +writingMode: "書寫方向" +_writingMode: + horizontalTB: "橫排,由上而下" + verticalLR: "直排,由左而右,字母旋轉90°" + verticalRL: "直排,由右而左,字母旋轉90°" + verticalLRUpright: "直排,由左而右,字母逐個排列" + verticalRLUpright: "直排,由右而左,字母逐個排列" _mfm: cheatSheet: "MFM代碼小抄" intro: "MFM是Misskey、Firefish、Akkoma等專用的標記語言,可以在各個位置使用。 您可以這裏看到MFM可用語法列表。" diff --git a/packages/client/src/init.ts b/packages/client/src/init.ts index 81a57a1ce4..77b649c8f3 100644 --- a/packages/client/src/init.ts +++ b/packages/client/src/init.ts @@ -116,6 +116,23 @@ function checkForSplash() { const html = document.documentElement; html.setAttribute("lang", lang || "en-US"); html.setAttribute("dir", "auto"); + const writingMode = localStorage.getItem("writingMode"); + switch (writingMode) { + case "vertical-lr-upright": + html.classList.add("vertical-lr"); + html.classList.add("upright"); + break; + case "vertical-lr": + html.classList.add("vertical-lr"); + break; + case "vertical-rl-upright": + html.classList.add("vertical-rl"); + html.classList.add("upright"); + break; + case "vertical-rl": + html.classList.add("vertical-rl"); + break; + } // #endregion // #region loginId diff --git a/packages/client/src/pages/settings/general.vue b/packages/client/src/pages/settings/general.vue index 2e27818e2f..1ef64ac688 100644 --- a/packages/client/src/pages/settings/general.vue +++ b/packages/client/src/pages/settings/general.vue @@ -255,6 +255,15 @@ + + + + + + + + + @@ -445,6 +454,9 @@ const mergeThreadInTimeline = computed( const mergeRenotesInTimeline = computed( defaultStore.makeGetterSetter("mergeRenotesInTimeline"), ); +const writingMode = computed( + defaultStore.makeGetterSetter("writingMode"), +); // This feature (along with injectPromo) is currently disabled // function onChangeInjectFeaturedNote(v) { @@ -480,6 +492,23 @@ watch(translateLang, () => { localStorage.setItem("translateLang", translateLang.value as string); }); +watch(writingMode, () => { + localStorage.setItem("writingMode", writingMode.value as string); + const { classList } = document.documentElement; + classList.remove("vertical-rl"); + classList.remove("vertical-lr"); + classList.remove("upright"); + if (writingMode.value.startsWith("vertical-rl")) { + classList.add("vertical-rl"); + } + if (writingMode.value.startsWith("vertical-lr")) { + classList.add("vertical-lr"); + } + if (writingMode.value.endsWith("upright")) { + classList.add("upright"); + } +}); + watch( [ lang, @@ -499,7 +528,7 @@ watch( useEmojiCdn, enableTimelineStreaming, enablePullToRefresh, - pullToRefreshThreshold, + pullToRefreshThreshold ], async () => { await reloadAsk(); diff --git a/packages/client/src/store.ts b/packages/client/src/store.ts index ca0fb91c5d..6c992a864a 100644 --- a/packages/client/src/store.ts +++ b/packages/client/src/store.ts @@ -469,6 +469,10 @@ export const defaultStore = markRaw( where: "deviceAccount", default: true, }, + writingMode: { + where: "deviceAccount", + default: "horizontal-tb" as "horizontal-tb" | "vertical-rl" | "vertical-lr" | "vertical-rl-upright" | "vertical-lr-upright", + } }), ); diff --git a/packages/client/src/style.scss b/packages/client/src/style.scss index d0f7936745..ebbd2f69f6 100644 --- a/packages/client/src/style.scss +++ b/packages/client/src/style.scss @@ -126,6 +126,11 @@ html { --gradient-to-block-end: to left; } + &.upright { + text-orientation: upright; + text-transform: full-width; + } + &.useCJKFont { font-family: "Hiragino Maru Gothic Pro", "BIZ UDGothic", "Atkinson Hyperlegible", Roboto, HelveticaNeue, Arial, sans-serif;