nino/manga-reader
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Filtro de luz azul en el lector

Browse Source 
Capa ámbar en modo multiplicar sobre las páginas (también durante las animaciones), bajo las barras.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
nino
2026-11-01 16:58:21 -06:00
co-authored by Claude Opus 5.5
parent 09354f675e
commit 41a87bc5ad
2 changed files with 7 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/public/app.js
+4
View File
@@ -63,6 +63,9 @@ const FILTERS = {
gray: ['Blanco y negro', 'grayscale(1)'], gray: ['Blanco y negro', 'grayscale(1)'],
contrast: ['Alto contraste', 'contrast(1.35) brightness(1.03)'], contrast: ['Alto contraste', 'contrast(1.35) brightness(1.03)'],
vivid: ['Colores vivos', 'saturate(1.45) contrast(1.05)'], vivid: ['Colores vivos', 'saturate(1.45) contrast(1.05)'],
// Sin filtro CSS: una capa ámbar en modo multiplicar sobre todo el lector (.reader.bluelight), que
// quita azul a todo lo que hay en pantalla, también durante las animaciones.
blue: ['Filtro de luz azul', ''],
} }
const DL_ACTIVE = ['queued', 'downloading'] const DL_ACTIVE = ['queued', 'downloading']
const plural = (n, w) => `${n} ${w}${n === 1 ? '' : 's'}` const plural = (n, w) => `${n} ${w}${n === 1 ? '' : 's'}`
@@ -1381,6 +1384,7 @@ async function viewReader(mangaId, chapterId, startPage) {
const applyFilter = () => { const applyFilter = () => {
const f = [FILTERS[settings.filter]?.[1] || '', settings.brightness != 100 ? `brightness(${settings.brightness / 100})` : ''].join(' ').trim() const f = [FILTERS[settings.filter]?.[1] || '', settings.brightness != 100 ? `brightness(${settings.brightness / 100})` : ''].join(' ').trim()
box.style.setProperty('--page-filter', f || 'none') box.style.setProperty('--page-filter', f || 'none')
reader.classList.toggle('bluelight', settings.filter === 'blue')
} }
applyFilter() applyFilter()
if ($('#saver')) $('#saver').checked = settings.saver if ($('#saver')) $('#saver').checked = settings.saver
app/public/style.css
+3
View File
@@ -91,6 +91,9 @@ input:focus, select:focus { border-color: var(--accent); }
/* ---- Lector ---- */ /* ---- Lector ---- */
.reader { min-height: 100vh; background: #000; position: relative; } .reader { min-height: 100vh; background: #000; position: relative; }
/* Filtro de luz azul: tono ámbar multiplicado sobre las páginas (bajo las barras del lector). */
.reader.bluelight::after { content: ''; position: fixed; inset: 0; z-index: 25; pointer-events: none;
background: #ff9a3c; mix-blend-mode: multiply; opacity: .42; }
.rbar { position: fixed; left: 0; right: 0; z-index: 30; display: flex; align-items: center; gap: 8px; padding: 8px 12px; .rbar { position: fixed; left: 0; right: 0; z-index: 30; display: flex; align-items: center; gap: 8px; padding: 8px 12px;
background: rgba(10, 9, 14, .9); backdrop-filter: blur(6px); transition: transform .2s; flex-wrap: wrap; } background: rgba(10, 9, 14, .9); backdrop-filter: blur(6px); transition: transform .2s; flex-wrap: wrap; }
.rbar.top { top: 0; padding-top: max(8px, env(safe-area-inset-top)); } .rbar.top { top: 0; padding-top: max(8px, env(safe-area-inset-top)); }