TheCloud/PronounsPage
1
0
Fork 0
mirror of https://gitlab.com/PronounsPage/PronounsPage.git synced 2025-09-22 03:57:47 -04:00
Code Issues Packages Projects Releases Wiki Activity

(nuxt) move scss variables to config.style which then renders them as css custom properties

Browse Source
This commit is contained in:
Valentyne Stigloher 2025-01-12 18:28:53 +01:00
parent 5fa3d0e818
commit 66627a8212
74 changed files with 384 additions and 325 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
app.vue
View File

@ -14,9 +14,16 @@ const colour = '#C71585';
useHead({ useHead({
htmlAttrs: { htmlAttrs: {
dir: config.dir || 'ltr', dir: config.style.dir || 'ltr',
lang: config.locale, lang: config.locale,
}, },
style: [{
textContent:
`:root {
--font-headings: ${config.style.fontHeadings.join(', ')};
--font-text: ${config.style.fontText.join(', ')};
}`,
}],
link: [ link: [
{ rel: 'icon', sizes: '48x48', href: '/favicon.ico' }, { rel: 'icon', sizes: '48x48', href: '/favicon.ico' },
{ rel: 'icon', sizes: 'any', type: 'image/svg', href: '/logo/logo-primary.svg' }, { rel: 'icon', sizes: 'any', type: 'image/svg', href: '/logo/logo-primary.svg' },

419
assets/fonts.scss
View File

@ -1,239 +1,236 @@
@use "sass:list"; @use "sass:list";
@use "./variables";
@import url('https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap');
// We're using google-webfonts-helper https://gwfh.mranftl.com/fonts to self-host fonts // We're using google-webfonts-helper https://gwfh.mranftl.com/fonts to self-host fonts
@if list.index($fonts, 'Quicksand') { /* quicksand-regular - latin-ext_latin */
/* quicksand-regular - latin-ext_latin */ @font-face {
@font-face { font-family: 'Quicksand';
font-family: 'Quicksand'; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 400; src: url('/fonts/quicksand-v21-latin-ext_latin-regular.eot'); /* IE9 Compat Modes */
src: url('/fonts/quicksand-v21-latin-ext_latin-regular.eot'); /* IE9 Compat Modes */ src: local('Quicksand'),
src: local('Quicksand'), url('/fonts/quicksand-v21-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/fonts/quicksand-v21-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/quicksand-v21-latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/quicksand-v21-latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/quicksand-v21-latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */
url('/fonts/quicksand-v21-latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */ url('/fonts/quicksand-v21-latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/quicksand-v21-latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/quicksand-v21-latin-ext_latin-regular.svg#Quicksand') format('svg'); /* Legacy iOS */
url('/fonts/quicksand-v21-latin-ext_latin-regular.svg#Quicksand') format('svg'); /* Legacy iOS */ }
} /* quicksand-700 - latin-ext_latin */
/* quicksand-700 - latin-ext_latin */ @font-face {
@font-face { font-family: 'Quicksand';
font-family: 'Quicksand'; font-style: normal;
font-style: normal; font-weight: 700;
font-weight: 700; src: url('/fonts/quicksand-v21-latin-ext_latin-700.eot'); /* IE9 Compat Modes */
src: url('/fonts/quicksand-v21-latin-ext_latin-700.eot'); /* IE9 Compat Modes */ src: local('Quicksand'),
src: local('Quicksand'), url('/fonts/quicksand-v21-latin-ext_latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/fonts/quicksand-v21-latin-ext_latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/quicksand-v21-latin-ext_latin-700.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/quicksand-v21-latin-ext_latin-700.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/quicksand-v21-latin-ext_latin-700.woff') format('woff'), /* Modern Browsers */
url('/fonts/quicksand-v21-latin-ext_latin-700.woff') format('woff'), /* Modern Browsers */ url('/fonts/quicksand-v21-latin-ext_latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/quicksand-v21-latin-ext_latin-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/quicksand-v21-latin-ext_latin-700.svg#Quicksand') format('svg'); /* Legacy iOS */
url('/fonts/quicksand-v21-latin-ext_latin-700.svg#Quicksand') format('svg'); /* Legacy iOS */
}
} }
@if list.index($fonts, 'Nunito') { /* nunito-regular - latin-ext_latin_cyrillic-ext_cyrillic */
/* nunito-regular - latin-ext_latin_cyrillic-ext_cyrillic */ @font-face {
@font-face { font-family: 'Nunito';
font-family: 'Nunito'; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 400; src: url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.eot'); /* IE9 Compat Modes */
src: url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.eot'); /* IE9 Compat Modes */ src: local(''),
src: local(''), url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff') format('woff'), /* Modern Browsers */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff') format('woff'), /* Modern Browsers */ url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.svg#Nunito') format('svg'); /* Legacy iOS */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-regular.svg#Nunito') format('svg'); /* Legacy iOS */ }
} /* nunito-700 - latin-ext_latin_cyrillic-ext_cyrillic */
/* nunito-700 - latin-ext_latin_cyrillic-ext_cyrillic */ @font-face {
@font-face { font-family: 'Nunito';
font-family: 'Nunito'; font-style: normal;
font-style: normal; font-weight: 700;
font-weight: 700; src: url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.eot'); /* IE9 Compat Modes */
src: url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.eot'); /* IE9 Compat Modes */ src: local(''),
src: local(''), url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.woff') format('woff'), /* Modern Browsers */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.woff') format('woff'), /* Modern Browsers */ url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.svg#Nunito') format('svg'); /* Legacy iOS */
url('/fonts/nunito-v16-latin-ext_latin_cyrillic-ext_cyrillic-700.svg#Nunito') format('svg'); /* Legacy iOS */
}
} }
@if list.index($fonts, 'Zen Maru Gothic') { /* zen-maru-gothic-regular - latin_japanese */
/* zen-maru-gothic-regular - latin_japanese */ @font-face {
@font-face { font-family: 'Zen Maru Gothic';
font-family: 'Zen Maru Gothic'; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 400; src: url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.eot'); /* IE9 Compat Modes */
src: url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.eot'); /* IE9 Compat Modes */ src: local(''),
src: local(''), url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.woff') format('woff'), /* Modern Browsers */
url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.woff') format('woff'), /* Modern Browsers */ url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.svg#ZenMaruGothic') format('svg'); /* Legacy iOS */
url('/fonts/zen-maru-gothic-v4-latin_japanese-regular.svg#ZenMaruGothic') format('svg'); /* Legacy iOS */ }
} /* zen-maru-gothic-700 - latin_japanese */
/* zen-maru-gothic-700 - latin_japanese */ @font-face {
@font-face { font-family: 'Zen Maru Gothic';
font-family: 'Zen Maru Gothic'; font-style: normal;
font-style: normal; font-weight: 700;
font-weight: 700; src: url('/fonts/zen-maru-gothic-v4-latin_japanese-700.eot'); /* IE9 Compat Modes */
src: url('/fonts/zen-maru-gothic-v4-latin_japanese-700.eot'); /* IE9 Compat Modes */ src: local(''),
src: local(''), url('/fonts/zen-maru-gothic-v4-latin_japanese-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/fonts/zen-maru-gothic-v4-latin_japanese-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/zen-maru-gothic-v4-latin_japanese-700.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/zen-maru-gothic-v4-latin_japanese-700.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/zen-maru-gothic-v4-latin_japanese-700.woff') format('woff'), /* Modern Browsers */
url('/fonts/zen-maru-gothic-v4-latin_japanese-700.woff') format('woff'), /* Modern Browsers */ url('/fonts/zen-maru-gothic-v4-latin_japanese-700.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/zen-maru-gothic-v4-latin_japanese-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/zen-maru-gothic-v4-latin_japanese-700.svg#ZenMaruGothic') format('svg'); /* Legacy iOS */
url('/fonts/zen-maru-gothic-v4-latin_japanese-700.svg#ZenMaruGothic') format('svg'); /* Legacy iOS */
}
} }
@if list.index($fonts, 'Nanum Gothic') { /* nanum-gothic-regular - latin_korean */
/* nanum-gothic-regular - latin_korean */ @font-face {
@font-face { font-family: 'Nanum Gothic';
font-family: 'Nanum Gothic'; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 400; src: url('/fonts/nanum-gothic-v17-latin_korean-regular.eot'); /* IE9 Compat Modes */
src: url('/fonts/nanum-gothic-v17-latin_korean-regular.eot'); /* IE9 Compat Modes */ src: local(''),
src: local(''), url('/fonts/nanum-gothic-v17-latin_korean-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/fonts/nanum-gothic-v17-latin_korean-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/nanum-gothic-v17-latin_korean-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/nanum-gothic-v17-latin_korean-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/nanum-gothic-v17-latin_korean-regular.woff') format('woff'), /* Modern Browsers */
url('/fonts/nanum-gothic-v17-latin_korean-regular.woff') format('woff'), /* Modern Browsers */ url('/fonts/nanum-gothic-v17-latin_korean-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/nanum-gothic-v17-latin_korean-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/nanum-gothic-v17-latin_korean-regular.svg#NanumGothic') format('svg'); /* Legacy iOS */
url('/fonts/nanum-gothic-v17-latin_korean-regular.svg#NanumGothic') format('svg'); /* Legacy iOS */ }
} /* nanum-gothic-700 - latin_korean */
/* nanum-gothic-700 - latin_korean */ @font-face {
@font-face { font-family: 'Nanum Gothic';
font-family: 'Nanum Gothic'; font-style: normal;
font-style: normal; font-weight: 700;
font-weight: 700; src: url('/fonts/nanum-gothic-v17-latin_korean-700.eot'); /* IE9 Compat Modes */
src: url('/fonts/nanum-gothic-v17-latin_korean-700.eot'); /* IE9 Compat Modes */ src: local(''),
src: local(''), url('/fonts/nanum-gothic-v17-latin_korean-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/fonts/nanum-gothic-v17-latin_korean-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/nanum-gothic-v17-latin_korean-700.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/nanum-gothic-v17-latin_korean-700.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/nanum-gothic-v17-latin_korean-700.woff') format('woff'), /* Modern Browsers */
url('/fonts/nanum-gothic-v17-latin_korean-700.woff') format('woff'), /* Modern Browsers */ url('/fonts/nanum-gothic-v17-latin_korean-700.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/nanum-gothic-v17-latin_korean-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/nanum-gothic-v17-latin_korean-700.svg#NanumGothic') format('svg'); /* Legacy iOS */
url('/fonts/nanum-gothic-v17-latin_korean-700.svg#NanumGothic') format('svg'); /* Legacy iOS */
}
} }
@if list.index($fonts, 'Noto Sans TC') { /* noto-sans-tc-regular - latin_chinese-traditional */
/* noto-sans-tc-regular - latin_chinese-traditional */ @font-face {
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Noto Sans TC';
font-family: 'Noto Sans TC'; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 400; src: url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.eot'); /* IE9 Compat Modes */
src: url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.eot'); /* IE9 Compat Modes */ src: url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
src: url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.woff') format('woff'), /* Modern Browsers */
url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.woff') format('woff'), /* Modern Browsers */ url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.svg#NotoSansTC') format('svg'); /* Legacy iOS */
url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-regular.svg#NotoSansTC') format('svg'); /* Legacy iOS */ }
} /* noto-sans-tc-700 - latin_chinese-traditional */
/* noto-sans-tc-700 - latin_chinese-traditional */ @font-face {
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Noto Sans TC';
font-family: 'Noto Sans TC'; font-style: normal;
font-style: normal; font-weight: 700;
font-weight: 700; src: url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.eot'); /* IE9 Compat Modes */
src: url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.eot'); /* IE9 Compat Modes */ src: url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
src: url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.woff') format('woff'), /* Modern Browsers */
url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.woff') format('woff'), /* Modern Browsers */ url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.svg#NotoSansTC') format('svg'); /* Legacy iOS */
url('/fonts/noto-sans-tc-v26-latin_chinese-traditional-700.svg#NotoSansTC') format('svg'); /* Legacy iOS */
}
} }
@if list.index($fonts, 'Noto Sans SC') { /* noto-sans-sc-regular - latin_chinese-simplified */
/* noto-sans-sc-regular - latin_chinese-simplified */ @font-face {
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Noto Sans SC';
font-family: 'Noto Sans SC'; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 400; src: url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.eot'); /* IE9 Compat Modes */
src: url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.eot'); /* IE9 Compat Modes */ src: url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
src: url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.woff') format('woff'), /* Modern Browsers */
url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.woff') format('woff'), /* Modern Browsers */ url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.svg#NotoSansSC') format('svg'); /* Legacy iOS */
url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-regular.svg#NotoSansSC') format('svg'); /* Legacy iOS */ }
} /* noto-sans-sc-700 - latin_chinese-simplified */
/* noto-sans-sc-700 - latin_chinese-simplified */ @font-face {
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Noto Sans SC';
font-family: 'Noto Sans SC'; font-style: normal;
font-style: normal; font-weight: 700;
font-weight: 700; src: url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.eot'); /* IE9 Compat Modes */
src: url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.eot'); /* IE9 Compat Modes */ src: url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
src: url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.woff2') format('woff2'), /* Super Modern Browsers */
url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.woff2') format('woff2'), /* Super Modern Browsers */ url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.woff') format('woff'), /* Modern Browsers */
url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.woff') format('woff'), /* Modern Browsers */ url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.ttf') format('truetype'), /* Safari, Android, iOS */
url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.svg#NotoSansSC') format('svg'); /* Legacy iOS */
url('/fonts/noto-sans-sc-v26-latin_chinese-simplified-700.svg#NotoSansSC') format('svg'); /* Legacy iOS */
}
} }
@if list.index($fonts, 'sitelen-pona-pona') { @font-face {
@font-face { font-family: 'sitelen-pona-pona';
font-family: 'sitelen-pona-pona'; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 400; src: url('/fonts/sitelen-pona-pona.otf') format("opentype")
src: url('/fonts/sitelen-pona-pona.otf') format("opentype")
}
} }
@if list.index($fonts, 'linjapimejapona') { @font-face {
@font-face { font-family: 'linjapimejapona';
font-family: 'linjapimejapona'; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 400; src: url('/fonts/linjapimejapona.ttf') format("truetype")
src: url('/fonts/linjapimejapona.ttf') format("truetype")
}
} }
@if list.index($fonts, 'Rubik') { /* rubik-300 - arabic_latin_latin-ext */
/* rubik-300 - arabic_latin_latin-ext */ @font-face {
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Rubik';
font-family: 'Rubik'; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 400; src: url('/fonts/rubik-v28-arabic_latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
src: url('/fonts/rubik-v28-arabic_latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
} /* rubik-700 - arabic_latin_latin-ext */
/* rubik-700 - arabic_latin_latin-ext */ @font-face {
@font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Rubik';
font-family: 'Rubik'; font-style: normal;
font-style: normal; font-weight: 700;
font-weight: 700; src: url('/fonts/rubik-v28-arabic_latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
src: url('/fonts/rubik-v28-arabic_latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
} }
/* baloo-bhaijaan-2-regular - arabic_latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Baloo Bhaijaan 2';
font-style: normal;
font-weight: 400;
src: url('/fonts/baloo-bhaijaan-2-v19-arabic_latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
url('/fonts/baloo-bhaijaan-2-v19-arabic_latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* baloo-bhaijaan-2-700 - arabic_latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Baloo Bhaijaan 2';
font-style: normal;
font-weight: 700;
src: url('/fonts/baloo-bhaijaan-2-v19-arabic_latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
url('/fonts/baloo-bhaijaan-2-v19-arabic_latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
.shavian {
--font-text: 'Noto Sans Shavian';
font-family: list.join(var(--font-text), $font-fallback);
}
@if list.index($fonts, 'Baloo Bhaijaan 2') { .sitelen {
/* baloo-bhaijaan-2-regular - arabic_latin */ --font-text: 'linjapimejapona';
@font-face { font-family: list.join(var(--font-text), $font-fallback);
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ .cartouche {
font-family: 'Baloo Bhaijaan 2'; padding: .1em;
font-style: normal; margin-inline-start: .15em;
font-weight: 400; margin-inline-end: .15em;
src: url('/fonts/baloo-bhaijaan-2-v19-arabic_latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ border: .075em solid #000;
url('/fonts/baloo-bhaijaan-2-v19-arabic_latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ border-radius: .2em;
} font-size: 0.9em;
/* baloo-bhaijaan-2-700 - arabic_latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Baloo Bhaijaan 2';
font-style: normal;
font-weight: 700;
src: url('/fonts/baloo-bhaijaan-2-v19-arabic_latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
url('/fonts/baloo-bhaijaan-2-v19-arabic_latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
} }
} }

9
assets/variables.scss
View File

@ -1,12 +1,9 @@
@use "sass:list"; @use "sass:list";
@use "sass:math"; @use "sass:math";
@import "../data/variables"; $font-fallback: sans-serif, "Noto Color Emoji", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
$fontExtra: null !default; $font-family-sans-serif: list.join(var(--font-text), $font-fallback);
$fonts: list.join(list.join($fontHeadings, $fontText), $fontExtra); $headings-font-family: list.join(var(--font-headings), $font-fallback);
$font-family-sans-serif: list.join($fontText, (sans-serif, "Noto Color Emoji", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol")) !default;
$headings-font-family: list.join($fontHeadings, (sans-serif, $fontText, "Noto Color Emoji", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol")) !default;
$btn-font-family: $font-family-sans-serif; $btn-font-family: $font-family-sans-serif;
$font-family-base: $font-family-sans-serif; $font-family-base: $font-family-sans-serif;

2
components/LanguageVersions.vue
View File

@ -7,7 +7,7 @@
<ul class="list-unstyled" style="column-count: 2;"> <ul class="list-unstyled" style="column-count: 2;">
<li v-for="(options, locale) in otherLocales" :key="locale" class="mb-1"> <li v-for="(options, locale) in otherLocales" :key="locale" class="mb-1">
<a :href="options.url"> <a :href="options.url">
<Icon :v="config.dir === 'rtl' ? 'long-arrow-left' : 'long-arrow-right'" /> <Icon :v="config.style.dir === 'rtl' ? 'long-arrow-left' : 'long-arrow-right'" />
<!-- <LocaleIcon :locale="options" class="me-1"/> --> <!-- <LocaleIcon :locale="options" class="me-1"/> -->
{{ options.name }} {{ options.name }}
<small v-if="options.extra" class="text-muted">({{ options.extra }})</small> <small v-if="options.extra" class="text-muted">({{ options.extra }})</small>

4
locale/_/config.suml
View File

@ -1,5 +1,9 @@
locale: '_' locale: '_'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: false header: false
disableTranslationProposals: true disableTranslationProposals: true

2
locale/_/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

6
locale/_base/config.suml
View File

@ -1,5 +1,9 @@
locale: '<TODO>' locale: '<TODO>'
# dir: 'rtl'
style:
# dir: 'rtl'
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true

2
locale/_base/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

6
locale/ar/config.suml
View File

@ -1,5 +1,9 @@
locale: 'ar' locale: 'ar'
dir: 'rtl'
style:
dir: 'rtl'
fontHeadings: ['Baloo Bhaijaan 2']
fontText: ['Baloo Bhaijaan 2']
header: true header: true

2
locale/ar/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Baloo Bhaijaan 2';
$fontText: 'Baloo Bhaijaan 2';

22
locale/config.ts
View File

@ -14,12 +14,8 @@ export interface Config {
* @default locale * @default locale
*/ */
intlLocale?: string; intlLocale?: string;
style: StyleConfig;
format?: FormatConfig; format?: FormatConfig;
/**
* text direction
* @default "ltr"
*/
dir?: 'ltr' | 'rtl';
/** /**
* age limit for users * age limit for users
* @default 13 * @default 13
@ -133,6 +129,22 @@ interface FormatConfig {
timezone: string; timezone: string;
} }
interface StyleConfig {
/**
* text direction
* @default "ltr"
*/
dir?: 'ltr' | 'rtl';
/**
* fonts used in headings, sorted by priority
*/
fontHeadings: string[];
/**
* fonts used in texts, sorted by priority
*/
fontText: string[];
}
export interface PronounsConfig { export interface PronounsConfig {
/** /**
* route path for the pronouns list page (translated) * route path for the pronouns list page (translated)

4
locale/de/config.suml
View File

@ -1,5 +1,9 @@
locale: 'de' locale: 'de'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/de/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/en/config.suml
View File

@ -1,5 +1,9 @@
locale: 'en' locale: 'en'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
disableTranslationProposals: true disableTranslationProposals: true

7
locale/en/variables.scss
View File

@ -1,7 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';
$fontExtra: 'Noto Sans Shavian';
.shavian {
font-family: $fontExtra, $fontText;
}

4
locale/eo/config.suml
View File

@ -1,5 +1,9 @@
locale: 'eo' locale: 'eo'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/eo/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/es/config.suml
View File

@ -1,5 +1,9 @@
locale: 'es' locale: 'es'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/es/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/et/config.suml
View File

@ -1,5 +1,9 @@
locale: 'et' locale: 'et'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/et/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/fo/config.suml
View File

@ -1,6 +1,10 @@
locale: 'fo' locale: 'fo'
# dir: 'rtl' # dir: 'rtl'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/fo/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/fr/config.suml
View File

@ -1,5 +1,9 @@
locale: 'fr' locale: 'fr'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/fr/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/gl/config.suml
View File

@ -1,5 +1,9 @@
locale: 'gl' locale: 'gl'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/gl/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/hbs/config.suml
View File

@ -1,5 +1,9 @@
locale: 'hbs' locale: 'hbs'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/hbs/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

7
locale/he/config.suml
View File

@ -1,5 +1,10 @@
locale: 'he' locale: 'he'
dir: 'rtl'
style:
dir: 'rtl'
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/he/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/it/config.suml
View File

@ -1,5 +1,9 @@
locale: 'it' locale: 'it'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
format: format:
timezone: 'Europe/Rome' timezone: 'Europe/Rome'

2
locale/it/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/ja/config.suml
View File

@ -1,5 +1,9 @@
locale: 'ja' locale: 'ja'
style:
fontHeadings: ['Zen Maru Gothic']
fontText: ['Zen Maru Gothic']
header: true header: true
pronouns: pronouns:

2
locale/ja/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Zen Maru Gothic';
$fontText: 'Zen Maru Gothic';

4
locale/ko/config.suml
View File

@ -1,5 +1,9 @@
locale: 'ko' locale: 'ko'
style:
fontHeadings: ['Nanum Gothic']
fontText: ['Nanum Gothic']
header: true header: true
pronouns: pronouns:

2
locale/ko/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Nanum Gothic';
$fontText: 'Nanum Gothic';

4
locale/lad/config.suml
View File

@ -1,5 +1,9 @@
locale: 'lad' locale: 'lad'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/lad/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/nb/config.suml
View File

@ -1,5 +1,9 @@
locale: 'nb' locale: 'nb'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/nb/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/nl/config.suml
View File

@ -1,5 +1,9 @@
locale: 'nl' locale: 'nl'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/nl/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/nn/config.suml
View File

@ -1,5 +1,9 @@
locale: 'nn' locale: 'nn'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/nn/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/no/config.suml
View File

@ -1,5 +1,9 @@
locale: 'no' locale: 'no'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
macrolanguage: macrolanguage:
enabled: true enabled: true
languages: languages:

2
locale/no/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/pl/config.suml
View File

@ -1,5 +1,9 @@
locale: 'pl' locale: 'pl'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
format: format:
timezone: 'Europe/Warsaw' timezone: 'Europe/Warsaw'

2
locale/pl/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/pt/config.suml
View File

@ -1,5 +1,9 @@
locale: 'pt' locale: 'pt'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/pt/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/ro/config.suml
View File

@ -1,5 +1,9 @@
locale: 'ro' locale: 'ro'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/ro/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/ru/config.suml
View File

@ -1,5 +1,9 @@
locale: 'ru' locale: 'ru'
style:
fontHeadings: ['Nunito']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/ru/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Nunito';
$fontText: 'Nunito';

4
locale/sv/config.suml
View File

@ -1,5 +1,9 @@
locale: 'sv' locale: 'sv'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/sv/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/tok/config.suml
View File

@ -1,5 +1,9 @@
locale: 'tok' locale: 'tok'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

15
locale/tok/variables.scss
View File

@ -1,15 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';
$fontExtra: 'linjapimejapona';
.sitelen {
font-family: $fontExtra, $fontText;
.cartouche {
padding: .1em;
margin-inline-start: .15em;
margin-inline-end: .15em;
border: .075em solid #000;
border-radius: .2em;
font-size: 0.9em;
}
}

4
locale/tr/config.suml
View File

@ -1,5 +1,9 @@
locale: 'tr' locale: 'tr'
style:
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/tr/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/ua/config.suml
View File

@ -1,6 +1,10 @@
locale: 'ua' locale: 'ua'
intlLocale: 'uk-UA' intlLocale: 'uk-UA'
style:
fontHeadings: ['Nunito']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/ua/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Nunito';
$fontText: 'Nunito';

4
locale/vi/config.suml
View File

@ -1,5 +1,9 @@
locale: 'vi' locale: 'vi'
style:
fontHeadings: ['Nunito']
fontText: ['Nunito']
header: true header: true
pronouns: pronouns:

2
locale/vi/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Nunito';
$fontText: 'Nunito';

6
locale/yi/config.suml
View File

@ -1,5 +1,9 @@
locale: 'yi' locale: 'yi'
dir: 'rtl'
style:
dir: 'rtl'
fontHeadings: ['Quicksand']
fontText: ['Nunito']
header: true header: true

2
locale/yi/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand';
$fontText: 'Nunito';

4
locale/zh/config.suml
View File

@ -1,5 +1,9 @@
locale: 'zh' locale: 'zh'
style:
fontHeadings: ['Quicksand', 'Noto Sans TC', 'Noto Sans SC']
fontText: ['Nunito', 'Noto Sans TC', 'Noto Sans SC']
header: true header: true
pronouns: pronouns:

2
locale/zh/variables.scss
View File

@ -1,2 +0,0 @@
$fontHeadings: 'Quicksand', 'Noto Sans TC', 'Noto Sans SC';
$fontText: 'Nunito', 'Noto Sans TC', 'Noto Sans SC';

2
nuxt.config.ts
View File

@ -61,7 +61,7 @@ const postCssPlugins: Record<string, object> = {
cssnano: {}, cssnano: {},
}; };
if (config.dir === 'rtl') { if (config.style.dir === 'rtl') {
postCssPlugins.rtlcss = {}; postCssPlugins.rtlcss = {};
} }

2
server/express/banner.ts
View File

@ -52,7 +52,7 @@ const imageSize = 200;
const leftRatio = 4; const leftRatio = 4;
const getBannerKey = defineCachedFunction(async (path: string, db: Database) => { const getBannerKey = defineCachedFunction(async (path: string, db: Database) => {
const fontName = registerLocaleFont('fontHeadings', ['regular', 'bold']); const fontName = registerLocaleFont(global.config, 'fontHeadings', ['regular', 'bold']);
const canvas = createCanvas(width, height); const canvas = createCanvas(width, height);
const context = canvas.getContext('2d'); const context = canvas.getContext('2d');

2
server/express/nouns.ts
View File

@ -245,7 +245,7 @@ router.get('/nouns/:id.png', async (req, res) => {
const height = padding * 2.5 + (maxItems + 1) * 48 + padding; const height = padding * 2.5 + (maxItems + 1) * 48 + padding;
const mime = 'image/png'; const mime = 'image/png';
const fontName = registerLocaleFont('fontHeadings', ['regular', 'bold']); const fontName = registerLocaleFont(global.config, 'fontHeadings', ['regular', 'bold']);
registerFont('node_modules/@fortawesome/fontawesome-pro/webfonts/fa-light-300.ttf', { family: 'FontAwesome', weight: 'regular' }); registerFont('node_modules/@fortawesome/fontawesome-pro/webfonts/fa-light-300.ttf', { family: 'FontAwesome', weight: 'regular' });
const canvas = createCanvas(width, height); const canvas = createCanvas(width, height);

19
server/localeFont.ts
View File

@ -1,15 +1,6 @@
import fs from 'fs';
import { registerFont } from 'canvas'; import { registerFont } from 'canvas';
import { rootDir } from './paths.ts'; import type { Config } from '~/locale/config.ts';
const vars: Record<string, string> = {};
for (const [, name, value] of fs.readFileSync(`${rootDir}/data/variables.scss`).toString('utf-8')
.matchAll(/^\$([^:]+): '([^']+)'(?:, '[^']+')*;$/gm)) {
vars[name] = value;
}
const fontSources: Record<string, string> = { const fontSources: Record<string, string> = {
'Baloo Bhaijaan 2': 'baloo-bhaijaan-2-v19-arabic_latin-{weight}.ttf', 'Baloo Bhaijaan 2': 'baloo-bhaijaan-2-v19-arabic_latin-{weight}.ttf',
@ -23,8 +14,12 @@ const weightsValues: Record<string, string> = {
bold: '700', bold: '700',
}; };
export const registerLocaleFont = (v: string, weights: string[] = ['regular']): string => { export const registerLocaleFont = (
const family = vars[v]; config: Config,
variable: 'fontHeadings' | 'fontText',
weights: string[] = ['regular'],
): string => {
const family = config.style[variable][0];
const source = fontSources[family]; const source = fontSources[family];
for (const weight of weights) { for (const weight of weights) {
registerFont(`public/fonts/${source.replace('{weight}', weightsValues[weight] || weight)}`, { family, weight }); registerFont(`public/fonts/${source.replace('{weight}', weightsValues[weight] || weight)}`, { family, weight });

4
test/fixtures/config.ts vendored
View File

@ -2,6 +2,10 @@ import type { ConfigWithEnabled } from '~/locale/config.ts';
export const configWithPronouns: ConfigWithEnabled<'pronouns'> = { export const configWithPronouns: ConfigWithEnabled<'pronouns'> = {
locale: 'en', locale: 'en',
style: {
fontHeadings: ['Quicksand'],
fontText: ['Nunito'],
},
header: true, header: true,
pronouns: { pronouns: {
enabled: true, enabled: true,