balex74/audio-foreign-n3vp8jx5wq
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

about

Browse Source
This commit is contained in:
balex
2026-03-13 19:03:40 +01:00
parent 4b0614fbed
commit 3c20e57ddb
2 changed files with 18 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/public/css/style.css
View File

@@ -46,23 +46,25 @@ body {
.header h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.3px; } .header h1 { font-size: 18px; font-weight: 600; letter-spacing: -0.3px; }
.header h1 span { color: var(--accent); } .header h1 span { color: var(--accent); }
.header-right { display: flex; align-items: center; gap: 10px; } .header-left { display: flex; align-items: center; gap: 8px; }
.level-selector { display: flex; gap: 6px; } .level-selector { display: flex; gap: 6px; }
.about-btn { .about-btn {
width: 26px; height: 26px; width: 22px; height: 22px;
border-radius: 50%; border-radius: 50%;
border: 1px solid var(--border); border: 1.5px solid var(--accent);
background: transparent; background: var(--accent-dim);
color: var(--text-muted); color: var(--accent);
font-size: 13px; font-size: 12px;
font-weight: 600;
cursor: pointer; cursor: pointer;
display: flex; align-items: center; justify-content: center; display: flex; align-items: center; justify-content: center;
transition: all 0.15s; transition: all 0.15s;
flex-shrink: 0; flex-shrink: 0;
opacity: 0.85;
} }
.about-btn:hover { border-color: var(--accent); color: var(--accent); } .about-btn:hover { opacity: 1; background: rgba(108,142,255,0.28); }
/* ── About modal ── */ /* ── About modal ── */
.modal-overlay { .modal-overlay {

18
src/public/index.html
View File

@@ -16,14 +16,14 @@
<!-- Header --> <!-- Header -->
<div class="header"> <div class="header">
<h1>Deutsch <span>üben</span></h1> <div class="header-left">
<div class="header-right"> <h1>Deutsch <span>üben</span></h1>
<div class="level-selector"> <button class="about-btn" id="about-btn" title="Über die App">ℹ</button>
<button class="level-btn" data-level="A2">A2</button> </div>
<button class="level-btn active" data-level="B1">B1</button> <div class="level-selector">
<button class="level-btn" data-level="B2">B2</button> <button class="level-btn" data-level="A2">A2</button>
</div> <button class="level-btn active" data-level="B1">B1</button>
<button class="about-btn" id="about-btn" title="About">ℹ</button> <button class="level-btn" data-level="B2">B2</button>
</div> </div>
</div> </div>
@@ -32,7 +32,7 @@
<div class="modal-card"> <div class="modal-card">
<button class="modal-close" id="about-close">✕</button> <button class="modal-close" id="about-close">✕</button>
<div class="modal-logo">Deutsch <span>üben</span></div> <div class="modal-logo">Deutsch <span>üben</span></div>
<p class="modal-desc">Приложение для устной практики немецкого языка с анализом речи через AI.</p> <p class="modal-desc">Eine App zum Üben des mündlichen Deutschs mit KI-gestützter Sprachanalyse.</p>
<div class="modal-author"> <div class="modal-author">
<div class="modal-author-name">Alex Babrouski</div> <div class="modal-author-name">Alex Babrouski</div>
<a class="modal-email" href="mailto:balexvicx@gmail.com">balexvicx@gmail.com</a> <a class="modal-email" href="mailto:balexvicx@gmail.com">balexvicx@gmail.com</a>