Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-16 13:14:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

allow adding custom font faces in theme

Browse Source
This commit is contained in:
Bruno Windels 2020-06-23 17:54:38 +02:00
parent b3510aa2b4
commit 2f6fc6bba2
1 changed files with 23 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/theme.js
View File

@ -43,8 +43,23 @@ function clearCustomTheme() {
document.body.style.removeProperty(prop);
}
}
const customFontFaceStyle = document.querySelector("head > style[title='custom-theme-font-faces']");
if (customFontFaceStyle) {
customFontFaceStyle.remove();
}
}
function generateCustomFontFaceCSS(faces) {
return Object.entries(faces).map(([fontName, face]) => {
const src = Object.entries(face.src).map(([format, url]) => {
return `url('${url}') format('${format}')`;
}).join(", ");
return `@font-face {` +
` font-family: '${fontName}';` +
` src: ${src};` +
`}`;
}).join("\n");
}
function setCustomThemeVars(customTheme) {
const {style} = document.body;
@ -72,6 +87,14 @@ function setCustomThemeVars(customTheme) {
}
if (customTheme.fonts) {
const {fonts} = customTheme;
if (fonts.faces) {
const css = generateCustomFontFaceCSS(fonts.faces);
const style = document.createElement("style");
style.setAttribute("title", "custom-theme-font-faces");
style.setAttribute("type", "text/css");
style.appendChild(document.createTextNode(css));
document.head.appendChild(style);
}
if (fonts.general) {
style.setProperty("--font-family", fonts.general);
}