kbenestad/mdcms
1
0
Fork 0
mirror of https://github.com/kbenestad/mdcms.git synced 2026-06-18 15:24:32 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix category font not reverting when switching to a no-font category (#23)

Browse source 
* Fix category picker and hamburger using page colours instead of nav colours

Both elements render against --bg-nav but were using --font-colour (the page
text colour). Switch to --nav-link-colour / --nav-section-heading-colour /
--nav-link-active-colour so they remain legible when nav-background is set to
a colour that contrasts with the page text colour (e.g. dark blue nav with
white nav-link text).

https://claude.ai/code/session_01MA8V1FvCmxjkCYyTxseaxB

* Fix category font not reverting when switching to a no-font category

maybeLoadCategoryFont applied a font-family to document.body but never
cleared it when switching to a category with no font defined. The inline
style overrides the CSS --font-body variable, so the category font
persisted indefinitely.

Fix: reset document.body.style.fontFamily to '' when the target category
has no font (letting --font-body take effect), and re-apply the family
string when switching back to an already-loaded font category.

https://claude.ai/code/session_01MA8V1FvCmxjkCYyTxseaxB

---------

Co-authored-by: Claude <noreply@anthropic.com>
This commit is contained in:
Kristian Benestad 2026-05-19 13:28:51 +07:00 committed by GitHub
parent c1d83b4bd6
commit cd02f43e82
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 10 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
app/index.html
View file

@ -1094,9 +1094,16 @@ body {
async function maybeLoadCategoryFont(code) { async function maybeLoadCategoryFont(code) {
const cat = categoriesByCode[code]; const cat = categoriesByCode[code];
if (!cat || !cat.font || loadedFonts.has(cat.font)) return; if (!cat || !cat.font) {
showFontLoadingBanner(); document.body.style.fontFamily = '';
return;
}
const family = 'mdcms-cat-' + code; const family = 'mdcms-cat-' + code;
if (loadedFonts.has(cat.font)) {
document.body.style.fontFamily = `"${family}", ${getComputedStyle(document.documentElement).getPropertyValue('--font-body').trim()}`;
return;
}
showFontLoadingBanner();
const css = `@font-face { font-family: "${family}"; src: url("assets/fonts/${cat.font}"); }`; const css = `@font-face { font-family: "${family}"; src: url("assets/fonts/${cat.font}"); }`;
const style = document.createElement('style'); const style = document.createElement('style');
style.textContent = css; style.textContent = css;
@ -1106,8 +1113,7 @@ body {
await face.load(); await face.load();
document.fonts.add(face); document.fonts.add(face);
loadedFonts.add(cat.font); loadedFonts.add(cat.font);
// Apply font to body for this session document.body.style.fontFamily = `"${family}", ${getComputedStyle(document.documentElement).getPropertyValue('--font-body').trim()}`;
document.body.style.fontFamily = `"${family}", ${getComputedStyle(document.body).fontFamily}`;
} catch (e) { } catch (e) {
console.warn('Font load failed:', e); console.warn('Font load failed:', e);
} }