Fix language toggle: use body class instead of inline styles
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
- EN mode no longer shows Russian subtitle under mineral name - RU mode now correctly reveals all lang-ru elements via CSS body.mode-ru rules - Subtitle in RU mode shows English name as reference below Russian heading Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -243,6 +243,9 @@
|
||||
|
||||
/* Language content */
|
||||
.lang-ru { display: none; }
|
||||
body.mode-ru .lang-en { display: none; }
|
||||
body.mode-ru span.lang-ru { display: inline; }
|
||||
body.mode-ru div.lang-ru { display: block; }
|
||||
|
||||
.mineral-name-ru {
|
||||
font-size: 1.1rem;
|
||||
@@ -492,10 +495,7 @@
|
||||
</button>
|
||||
</div>
|
||||
{% if mineral.name_ru %}
|
||||
<div class="mineral-name-ru">
|
||||
<span class="lang-en">{{ mineral.name_ru }}</span>
|
||||
<span class="lang-ru">{{ mineral.name }}</span>
|
||||
</div>
|
||||
<div class="mineral-name-ru lang-ru">{{ mineral.name }}</div>
|
||||
{% endif %}
|
||||
{% if mineral.formula %}<div class="formula">{{ mineral.formula|chem_formula }}</div>{% endif %}
|
||||
<div class="date">{{ today|date:"F j, Y" }}</div>
|
||||
@@ -677,15 +677,12 @@
|
||||
}
|
||||
|
||||
function setLang(lang) {
|
||||
var en = document.querySelectorAll('.lang-en');
|
||||
var ru = document.querySelectorAll('.lang-ru');
|
||||
for (var i = 0; i < en.length; i++) en[i].style.display = lang === 'en' ? '' : 'none';
|
||||
for (var i = 0; i < ru.length; i++) ru[i].style.display = lang === 'ru' ? '' : 'none';
|
||||
document.body.classList.toggle('mode-ru', lang === 'ru');
|
||||
var btns = document.querySelectorAll('.lang-toggle button');
|
||||
for (var i = 0; i < btns.length; i++) {
|
||||
btns[i].classList.toggle('active', btns[i].getAttribute('data-lang') === lang);
|
||||
}
|
||||
document.documentElement.lang = lang;
|
||||
document.documentElement.lang = lang === 'ru' ? 'ru' : 'en';
|
||||
try { localStorage.setItem('dailystone-lang', lang); } catch(e) {}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user