This commit is contained in:
Lev 2026-03-14 23:03:33 +03:00
parent 60226aea76
commit c3a5446239
2 changed files with 15 additions and 22 deletions

View file

@ -207,17 +207,13 @@ document.getElementById("closeModal").onclick = hideModal;
tryAutoLogin(); tryAutoLogin();
// Переключение инструкций по платформам
document.querySelectorAll('.tab-btn').forEach(btn => { document.querySelectorAll('.tab-btn').forEach(btn => {
btn.addEventListener('click', () => { btn.addEventListener('click', () => {
// Убираем active у всех кнопок
document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active')); document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
btn.classList.add('active'); btn.classList.add('active');
// Скрываем все инструкции
document.querySelectorAll('.instructions').forEach(el => el.classList.add('hidden')); document.querySelectorAll('.instructions').forEach(el => el.classList.add('hidden'));
// Показываем нужную
const platform = btn.dataset.platform; const platform = btn.dataset.platform;
const target = document.getElementById(`${platform}-instructions`); const target = document.getElementById(`${platform}-instructions`);
if (target) { if (target) {
@ -226,7 +222,4 @@ document.querySelectorAll('.tab-btn').forEach(btn => {
}); });
}); });
// Показываем Android по умолчанию при загрузке (если нужно) document.addEventListener('DOMContentLoaded', () => {});
document.addEventListener('DOMContentLoaded', () => {
// можно оставить как есть — первая вкладка уже active в HTML
});

View file

@ -191,11 +191,11 @@ h1{
color: #aaa; color: #aaa;
} }
.how-to-connect { .how-to-connect{
margin-bottom: 60px; margin-bottom: 60px;
} }
.platform-tabs { .platform-tabs{
display: flex; display: flex;
justify-content: center; justify-content: center;
gap: 12px; gap: 12px;
@ -203,7 +203,7 @@ h1{
flex-wrap: wrap; flex-wrap: wrap;
} }
.tab-btn { .tab-btn{
background: #1a1a1a; background: #1a1a1a;
border: 1px solid #444; border: 1px solid #444;
color: #aaa; color: #aaa;
@ -215,13 +215,13 @@ h1{
transition: all 0.22s ease; transition: all 0.22s ease;
} }
.tab-btn:hover { .tab-btn:hover{
border-color: #666; border-color: #666;
color: #ddd; color: #ddd;
background: #222; background: #222;
} }
.tab-btn.active { .tab-btn.active{
background: var(--accent); background: var(--accent);
color: #000; color: #000;
border-color: var(--accent); border-color: var(--accent);
@ -229,7 +229,7 @@ h1{
font-weight: 600; font-weight: 600;
} }
.instructions { .instructions{
background: var(--card); background: var(--card);
border: 1px solid #333; border: 1px solid #333;
border-radius: 16px; border-radius: 16px;
@ -237,20 +237,20 @@ h1{
transition: all 0.3s ease; transition: all 0.3s ease;
} }
.instructions ol { .instructions ol{
counter-reset: step; counter-reset: step;
list-style: none; list-style: none;
font-size: 15.5px; font-size: 15.5px;
line-height: 1.65; line-height: 1.65;
} }
.instructions li { .instructions li{
position: relative; position: relative;
padding-left: 38px; padding-left: 38px;
margin-bottom: 18px; margin-bottom: 18px;
} }
.instructions li::before { .instructions li::before{
content: counter(step); content: counter(step);
counter-increment: step; counter-increment: step;
position: absolute; position: absolute;
@ -269,19 +269,19 @@ h1{
font-weight: 600; font-weight: 600;
} }
.instructions a { .instructions a{
color: var(--accent); color: var(--accent);
text-decoration: none; text-decoration: none;
border-bottom: 1px solid rgba(0,255,255,0.3); border-bottom: 1px solid rgba(0,255,255,0.3);
transition: all 0.2s; transition: all 0.2s;
} }
.instructions a:hover { .instructions a:hover{
border-bottom-color: var(--accent); border-bottom-color: var(--accent);
color: #00ffff; color: #00ffff;
} }
.instructions kbd { .instructions kbd{
background: #1e1e1e; background: #1e1e1e;
border: 1px solid #444; border: 1px solid #444;
border-radius: 5px; border-radius: 5px;
@ -290,12 +290,12 @@ h1{
color: #aaa; color: #aaa;
} }
.instructions ul { .instructions ul{
margin: 12px 0 12px 24px; margin: 12px 0 12px 24px;
list-style: disc; list-style: disc;
color: #bbb; color: #bbb;
} }
.hidden { .hidden{
display: none !important; display: none !important;
} }