Last active
November 7, 2024 02:03
-
-
Save zozovo/8a76915acf197a873304dd23f2cfd49c to your computer and use it in GitHub Desktop.
Replace the font with Sarasa Gothic (CJK) and the corresponding monospaced one.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ==UserScript== | |
// @name Sarasa-Gothic-Font-Substitution-Tool | |
// @name:en-US Sarasa Gothic Font Substitution Tool | |
// @name:zh-CN 更纱黑体字体替换工具 | |
// @name:zh-TW 更紗黑體字型替換工具 | |
// @name:zh-HK 更紗黑體字型替換工具 | |
// @name:ja-JP 更紗ゴシックフォント置換ツール | |
// @name:ko-KR 사라사고딕 폰트 대체 도구 | |
// @namespace https://gist.github.com/zozovo/8a76915acf197a873304dd23f2cfd49c | |
// @version 8.9 | |
// @author zozovo | |
// @description Replace the font with Sarasa Gothic (CJK) and the corresponding monospaced one. | |
// @description:en-US Replace the font with Sarasa Gothic (CJK) and the corresponding monospaced one. | |
// @description:zh-CN 将字体替换为更纱黑体(中日韩)和对应的等宽字体。 | |
// @description:zh-TW 將字體替換為更紗黑體(中日韓)和對應的等寬字體。 | |
// @description:zh-HK 將字體替換為更紗黑體(中日韓)和對應的等寬字體。 | |
// @description:ja-JP フォントを更紗ゴシック(中日韓)および対応する等幅フォントに置き換えます。 | |
// @description:ko-KR 글꼴을사라사고딕 (중일한) 및해당등폭글꼴로대체합니다. | |
// @match *://*/* | |
// @run-at document-start | |
// @grant GM_addStyle | |
// @license MIT | |
// @supportURL https://gist.github.com/zozovo/8a76915acf197a873304dd23f2cfd49c | |
// ==/UserScript== | |
const LANG_CODE_OBJ = { | |
"zh-CN": "SC", | |
"zh-SG": "SC", | |
"zh-TW": "TC", | |
"zh-HK": "HC", | |
"ja": "J", | |
"ko": "K", | |
"ko-KR": "K", | |
"ko-KP": "K", | |
}; | |
const lang_code = LANG_CODE_OBJ[navigator.language] || "SC"; // Default to SC if not found | |
const FONT_FAMILY_TYPE = { | |
generic: "var(--icon-font-family), var(--generic-font-family), system-ui;", | |
code: "var(--icon-font-family), var(--code-font-family), monospace;", | |
}; | |
const EMOJIS_UNICODE_RANGE = // Unicode CLDR: check https://unicode.org/emoji/charts/emoji-style.txt | |
// "U+00A9, U+00AE" + // BMP: Latin-1 Supplement: copyright and registered | |
"U+200C, U+200D, U+203C, U+2049, " + // BMP: General Punctuation: ZWNJ and ZWJ, double exclamation mark, exclamation question mark | |
"U+20E3, " + // BMP: Combining Diacritical Marks for Symbols: combining enclosing keycap | |
// "U+2122, " + // BMP: Letterlike Symbols: trade mark | |
"U+2139, " + // BMP: Letterlike Symbols: information | |
"U+2190-21FF, " + // BMP: Arrows | |
"U+23??, " + // BMP: Miscellaneous Technical | |
"U+24C2, " + // BMP: Enclosed Alphanumerics: circled M | |
"U+25A0-27BF, " + // BMP: Geometric Shapes, Miscellaneous Symbols, Dingbats | |
"U+2B??, " + // BMP: Miscellaneous Symbols and Arrows | |
"U+2934, U+2935, " + // BMP: Supplemental Arrows-B: right arrow curving up, right arrow curving down | |
"U+3030, U+303D, " + // BMP: CJK Symbols and Punctuation: wavy dash, part alternation mark | |
"U+3297, U+3299, " + // BMP: Enclosed CJK Letters and Months: Japanese “congratulations” button, Japanese “secret” button | |
"U+FE0E, U+FE0F, " + // BMP: Variation Selectors: VS15, VS16 | |
"U+1F???"; // SMP | |
GM_addStyle(` | |
@font-face { | |
font-family: "Color Emoji"; | |
src: local("Apple Color Emoji"), local("Noto Color Emoji"), | |
local("Segoe UI Emoji"); | |
unicode-range: ${EMOJIS_UNICODE_RANGE}; | |
} | |
@font-face { | |
font-family: "Monochrome Emoji"; | |
src: local("Apple Monochrome Emoji"), local("Noto Emoji"), | |
local("Segoe Fluent Icons"), local("Segoe MDL2 Assets"); | |
unicode-range: ${EMOJIS_UNICODE_RANGE}; | |
} | |
@font-face { | |
font-family: "Consolas"; | |
src: local("Sarasa Fixed ${lang_code}"); | |
} | |
@font-face { | |
font-family: "Courier New"; | |
src: local("Sarasa Fixed ${lang_code}"); | |
} | |
:root { | |
--icon-font-family: "Color Emoji", "Monochrome Emoji"; | |
--generic-font-family: "Sarasa UI ${lang_code}"; | |
--code-font-family: "Sarasa Fixed ${lang_code}"; | |
} | |
:is([lang$="TW"], [lang$="Hant"]) { | |
--generic-font-family: "Sarasa UI TC"; | |
--code-font-family: "Sarasa Fixed TC"; | |
} | |
:is([lang$="HK"], [lang$="MO"]) { | |
--generic-font-family: "Sarasa UI HC"; | |
--code-font-family: "Sarasa Fixed HC"; | |
} | |
:lang(ja) { | |
--generic-font-family: "Sarasa UI J"; | |
--code-font-family: "Sarasa Fixed J"; | |
} | |
:lang(ko) { | |
--generic-font-family: "Sarasa UI K"; | |
--code-font-family: "Sarasa Fixed K"; | |
} | |
:not(#_#_) { | |
/** google-symbols https://fonts.google.com/icons, | |
* font-awesome https://fontawesome.com/iconsother, | |
* other icons | |
*/ | |
:not([class*="-symbols"], [class*="fa-"], [class*="icon"]) { | |
/* generic fonts, except mathjax, <i> <s> for icons, <a> <span> for inherited */ | |
&:not(a, i, s, span, textarea, button *):not( | |
math, | |
math *, | |
mjx-container, | |
mjx-container *, | |
[aria-hidden="true"], | |
[role="presentation"], | |
[role="none"], | |
[aria-hidden="true"] *, | |
[role="presentation"] *, | |
[role="none"] * | |
) { | |
font-family: ${FONT_FAMILY_TYPE.generic} | |
/** mono fonts and code editors: | |
* Ace https://ace.c9.io/, | |
* CodeMirror https://codemirror.net/ https://codemirror.net/5/, | |
* Monaco https://microsoft.github.io/monaco-editor/, | |
* TailwindCSS https://tailwindcss.com/docs/font-family | |
*/ | |
&:where(code, kbd, pre, samp, var), | |
&:where([class*="ace_editor"], [class*="cm-"], [class*="monaco-editor"], [class*="font-mono"]) { | |
font-family: ${FONT_FAMILY_TYPE.code} | |
/* <i> for icon, <a> <span> for inherited */ | |
& :not(a, i, span) { | |
font-family: ${FONT_FAMILY_TYPE.code} | |
} | |
} | |
/* for github readme*/ | |
&:where([class*="code"]:not(#readme, .readme)) { | |
font-family: ${FONT_FAMILY_TYPE.code} | |
} | |
} | |
} | |
/* discuz */ | |
:is(a[class*="xst"]) { | |
font-family: ${FONT_FAMILY_TYPE.generic} | |
} | |
} | |
`); |
在電腦顯示是沒問題的,它就是標楷體。但是到chrome book 同一個google slides 它顯示的就不是標楷體。已在「語言」中選「中文(台湾)」但是chrome book的字型中沒有出現標楷體,它唯一出現的中文字型是「新細明體」。
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Google Slides 顯示標楷體的字體
我对这个问题的理解:
由于网络环境或者操作系统的变化,Google Slide 字体下拉菜单中,无法找到「标楷体」选项
解决方案:
CTRL + SHIFT + F
,显示菜单文件
语言
中文(台湾)
标楷体
将网页中的字体替换为标楷体,用于屏幕显示
我对这个问题的理解:
之前可以注入
@font-face {}
,将family
为DFKai-SB
的字体资源,重新映射为kaiu.ttf
。Google Slides 前端某次更新后,
<svg>
内的<text>
的变为内联样式,优先级更高,导致脚本失效。可能的解决方案:
!important
标记,但幻灯片中将只有这一种字体。改变默认字体的映射,将一个不常用的字体(比如:
Comic Sans MS
)映射成为标楷体,使用这种字体。讓 chrome 瀏覽器直接讀自己設備(chromebook)的標楷體
解决方案是:
local()
和url()
的使用方法,可以参考 https://drafts.csswg.org/css-fonts/#local-font-fallback