fix(web): тему Medium нельзя было выбрать, хотя она полностью реализована
Брендбук требует три темы, причём Medium — отдельная, а не осветлённая Dark:
тёмно-зелёный холст #1A2A1F со светлыми кремовыми карточками #F7F1E3.
В style.css она описана целиком и отрисовывается верно — проверено
подстановкой data-theme вручную. Но в список выбора не попала, а applyTheme
знал только light и dark, поэтому любое другое значение сбрасывало тему в
системную. Выбрать Medium было невозможно.
После правки все три переключаются:
dark фон #101510 карточки #1A2A1F
medium фон #1A2A1F карточки #F7F1E3
light фон #F7F1E3 карточки белые
Цвета совпадают с палитрой брендбука. 486 passed, ruff чисто.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
parent
6e6d912a50
commit
0ed8fc0a29
2 changed files with 20 additions and 6 deletions
|
|
@ -1814,13 +1814,19 @@ function formatIsoDate(isoStr) {
|
||||||
|
|
||||||
// ── THEME SWITCHER ──
|
// ── THEME SWITCHER ──
|
||||||
function applyTheme(theme) {
|
function applyTheme(theme) {
|
||||||
if (theme === 'light') {
|
// Тем три, а не две.
|
||||||
document.body.setAttribute('data-theme', 'light');
|
//
|
||||||
document.body.classList.add('theme-light');
|
// Medium была полностью описана в style.css, но здесь не обрабатывалась и в
|
||||||
} else if (theme === 'dark') {
|
// список выбора не попадала — выбрать её было нельзя. По брендбуку это
|
||||||
document.body.setAttribute('data-theme', 'dark');
|
// отдельная тема, а не осветлённая Dark: тёмно-зелёный холст #1A2A1F со
|
||||||
document.body.classList.remove('theme-light');
|
// светлыми кремовыми карточками #F7F1E3. Проверено подстановкой атрибута
|
||||||
|
// вручную — отрисовывается верно и отличается от Dark и фоном, и карточками.
|
||||||
|
const known = ['light', 'medium', 'dark'];
|
||||||
|
if (known.includes(theme)) {
|
||||||
|
document.body.setAttribute('data-theme', theme);
|
||||||
|
document.body.classList.toggle('theme-light', theme === 'light');
|
||||||
} else {
|
} else {
|
||||||
|
// Системная: отдаём выбор prefers-color-scheme.
|
||||||
document.body.removeAttribute('data-theme');
|
document.body.removeAttribute('data-theme');
|
||||||
document.body.classList.remove('theme-light');
|
document.body.classList.remove('theme-light');
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -445,6 +445,14 @@
|
||||||
<select id="setting-theme" class="select-filter">
|
<select id="setting-theme" class="select-filter">
|
||||||
<option value="system">Системная (по умолчанию)</option>
|
<option value="system">Системная (по умолчанию)</option>
|
||||||
<option value="dark">Тёмная (Dark)</option>
|
<option value="dark">Тёмная (Dark)</option>
|
||||||
|
<!-- Medium была полностью реализована в style.css, но в этот
|
||||||
|
список не попала, и выбрать её было нельзя. Брендбук
|
||||||
|
требует три темы, причём Medium — отдельная, а не
|
||||||
|
осветлённая Dark: тёмно-зелёный холст #1A2A1F со
|
||||||
|
светлыми кремовыми карточками #F7F1E3. Проверено
|
||||||
|
подстановкой data-theme вручную: тема отрисовывается
|
||||||
|
верно и отличается от Dark и по фону, и по карточкам. -->
|
||||||
|
<option value="medium">Средняя (Medium)</option>
|
||||||
<option value="light">Светлая (Light)</option>
|
<option value="light">Светлая (Light)</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue