mrwnslz/diora-web
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

EPUB reader: add 'Kein Fett' toggle to suppress book bold
All checks were successful
Build and push Docker image / build (push) Successful in 12s
Details
Test / test (push) Successful in 13s
Details

Browse source 
Publisher EPUBs often set font-weight via <b>/<strong> tags or inline
style attributes. A new toggle in the settings panel adds the
.reader-no-bold class which overrides all font weights to normal.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
marwin 2026-04-29 11:52:45 +02:00
parent 2d488fd542
commit d64f159044
2 changed files with 12 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
static/css/app.css
View file

@ -1725,6 +1725,7 @@ body.reader-immersive.reader-show-bottom .reader-overlay { bottom: var(--bar-h)
.hl-note-btn { background:none; border:1px solid var(--border); color:var(--fg); padding:2px 6px; border-radius:var(--radius); cursor:pointer; } .hl-note-btn { background:none; border:1px solid var(--border); color:var(--fg); padding:2px 6px; border-radius:var(--radius); cursor:pointer; }
/* Highlight marks */ /* Highlight marks */
.reader-no-bold * { font-weight: normal !important; }
.epub-highlight { border-radius:2px; cursor:pointer; } .epub-highlight { border-radius:2px; cursor:pointer; }
.epub-highlight[data-color="yellow"] { background:rgba(241,196,15,.4); } .epub-highlight[data-color="yellow"] { background:rgba(241,196,15,.4); }
.epub-highlight[data-color="green"] { background:rgba(46,204,113,.35); } .epub-highlight[data-color="green"] { background:rgba(46,204,113,.35); }

13
static/js/app.js
View file

@ -2743,7 +2743,7 @@ async function _evictBookCache(bookList) {
// Reader settings // Reader settings
let readerSettings = { fontSize: 16, lineHeight: 1.8, maxWidth: 65, theme: 'dark', let readerSettings = { fontSize: 16, lineHeight: 1.8, maxWidth: 65, theme: 'dark',
fontFamily: 'serif', fontFamily: 'serif', noBold: false,
pdfZoom: 100, pdfInverted: false, pdfPaginated: false, pdfSpread: false }; pdfZoom: 100, pdfInverted: false, pdfPaginated: false, pdfSpread: false };
let readerSettingsPanelOpen = false; let readerSettingsPanelOpen = false;
let currentPdfDoc = null; let currentPdfDoc = null;
@ -3580,7 +3580,7 @@ function jumpToTocEntry(href) {
function loadReaderSettings(bookId) { function loadReaderSettings(bookId) {
// Reset to defaults, then apply per-book overrides // Reset to defaults, then apply per-book overrides
Object.assign(readerSettings, { fontSize: 16, lineHeight: 1.8, maxWidth: 65, theme: 'dark', Object.assign(readerSettings, { fontSize: 16, lineHeight: 1.8, maxWidth: 65, theme: 'dark',
fontFamily: 'serif', fontFamily: 'serif', noBold: false,
pdfZoom: 100, pdfInverted: false, pdfPaginated: false, pdfSpread: false }); pdfZoom: 100, pdfInverted: false, pdfPaginated: false, pdfSpread: false });
try { try {
const saved = JSON.parse(localStorage.getItem(`diora_reader_settings_${bookId}`) || '{}'); const saved = JSON.parse(localStorage.getItem(`diora_reader_settings_${bookId}`) || '{}');
@ -3613,6 +3613,7 @@ function applyReaderSettings(isPdf) {
mono: "'Courier New', monospace", mono: "'Courier New', monospace",
}; };
contentEl.style.fontFamily = fontMap[readerSettings.fontFamily] || fontMap.serif; contentEl.style.fontFamily = fontMap[readerSettings.fontFamily] || fontMap.serif;
contentEl.classList.toggle('reader-no-bold', !!readerSettings.noBold);
if (_currentPositionAnchor && currentBookId) { if (_currentPositionAnchor && currentBookId) {
requestAnimationFrame(() => restoreFromAnchor($('reader-content'), _currentPositionAnchor)); requestAnimationFrame(() => restoreFromAnchor($('reader-content'), _currentPositionAnchor));
} }
@ -3657,6 +3658,7 @@ function toggleSettingsPanel() {
<button class="btn btn-sm ${readerSettings.fontFamily === 'sans' ? 'active' : ''}" data-rs-font="sans">Sans</button> <button class="btn btn-sm ${readerSettings.fontFamily === 'sans' ? 'active' : ''}" data-rs-font="sans">Sans</button>
<button class="btn btn-sm ${readerSettings.fontFamily === 'humanist' ? 'active' : ''}" data-rs-font="humanist">Verdana</button> <button class="btn btn-sm ${readerSettings.fontFamily === 'humanist' ? 'active' : ''}" data-rs-font="humanist">Verdana</button>
<button class="btn btn-sm ${readerSettings.fontFamily === 'mono' ? 'active' : ''}" data-rs-font="mono">Mono</button> <button class="btn btn-sm ${readerSettings.fontFamily === 'mono' ? 'active' : ''}" data-rs-font="mono">Mono</button>
<button class="btn btn-sm ${readerSettings.noBold ? 'active' : ''}" id="rs-no-bold">Kein Fett</button>
<button class="btn btn-sm ${readerSettings.theme === 'dark' ? 'active' : ''}" data-rs-theme="dark">Dark</button> <button class="btn btn-sm ${readerSettings.theme === 'dark' ? 'active' : ''}" data-rs-theme="dark">Dark</button>
<button class="btn btn-sm ${readerSettings.theme === 'sepia' ? 'active' : ''}" data-rs-theme="sepia">Sepia</button> <button class="btn btn-sm ${readerSettings.theme === 'sepia' ? 'active' : ''}" data-rs-theme="sepia">Sepia</button>
<button class="btn btn-sm ${readerSettings.theme === 'bright' ? 'active' : ''}" data-rs-theme="bright">Bright</button> <button class="btn btn-sm ${readerSettings.theme === 'bright' ? 'active' : ''}" data-rs-theme="bright">Bright</button>
@ -3716,6 +3718,13 @@ function toggleSettingsPanel() {
}); });
}); });
panel.querySelector('#rs-no-bold').addEventListener('click', function () {
readerSettings.noBold = !readerSettings.noBold;
this.classList.toggle('active', readerSettings.noBold);
applyReaderSettings(false);
saveReaderSettings();
});
panel.querySelectorAll('[data-rs-theme]').forEach(btn => { panel.querySelectorAll('[data-rs-theme]').forEach(btn => {
btn.addEventListener('click', () => { btn.addEventListener('click', () => {
readerSettings.theme = btn.dataset.rsTheme; readerSettings.theme = btn.dataset.rsTheme;