yume/paricafe
1
0
Fork 0
mirror of https://github.com/paricafe/misskey.git synced 2025-04-09 08:29:34 -05:00
Code Issues Projects Releases Packages Wiki Activity

frontend: dynamic import fonts css

Browse source
This commit is contained in:
fly_mc 2024-11-19 21:30:50 +08:00
parent 1f4638b547
commit 966f8197eb
2 changed files with 13 additions and 13 deletions
packages/frontend/src
scripts
font-settings.ts
style.scss

14
packages/frontend/src/scripts/font-settings.ts
View file

@ -52,13 +52,21 @@ function getFontId(name: string, option: string) {
}
}
async function loadFontStyle(fontId: string) {
try {
await import(`@/styles-font/${fontId}.scss`);
} catch (e) {
console.warn(`Failed to load font style: ${fontId}`, e);
}
}
export function getDefaultFontSettings() {
const def_arr = miLocalStorage.getItem('defaultFontFace')?.split('_');
const fontFace = ref(def_arr?.[0] ?? 'system-ui');
const fontFaceType = ref(def_arr?.[1] ?? '');
const availableTypes = computed(() => getFontOptionsList(fontFace.value));
function setDafaultFont() {
async function setDafaultFont() {
for (const klass of [...document.documentElement.classList.values()]) {
if (klass.startsWith('default-font-')) {
document.documentElement.classList.remove(klass);
@ -67,6 +75,10 @@ export function getDefaultFontSettings() {
const newFontId = getFontId(fontFace.value, fontFaceType.value);
miLocalStorage.setItem('defaultFontFace', newFontId);
document.documentElement.classList.add(`default-font-${newFontId}`);
if (fontFace.value !== 'system-ui') {
await loadFontStyle(fontFace.value);
}
console.log(newFontId);
}

12
packages/frontend/src/style.scss
View file

@ -113,18 +113,6 @@ html {
}
}
@import "./styles-font/usual.scss";
@import "./styles-font/maokentangyuan.scss";
@import "./styles-font/chillroundgothic.scss";
@import "./styles-font/clearsans.scss";
@import "./styles-font/lgtw-wenkai.scss";
@import "./styles-font/lgtw-marker-gothic.scss";
@import "./styles-font/genryomin2.scss";
@import "./styles-font/genwanmin2.scss";
@import "./styles-font/jinghualaosong.scss";
@import "./styles-font/fusion-pixel.scss";
@import "./styles-font/zhuanti.scss";
html._themeChanging_ {
&, * {
transition: background 1s ease, border 1s ease !important;