refactor(ui): drop app footer, move author info to About panel

The "Created by Alexei Dolgolyov..." line lived in a global app
footer that took up vertical space on every page. Move the author
+ contact details into the About tab of the global settings modal
(rendered by renderAboutPanel), where they sit next to the version
pill and license. Adds a localized "donation.about_author" key
(en/ru/zh) and matching .about-hero .about-author styles. Removes
the now-unused .app-footer / .footer-content rules.
This commit is contained in:
2026-05-01 10:55:31 +03:00
parent 797b806972
commit 816a27db73
8 changed files with 34 additions and 47 deletions
-32
View File
@@ -888,38 +888,6 @@ h2 {
flex-shrink: 0; flex-shrink: 0;
} }
/* Footer */
.app-footer {
margin-top: 12px;
padding: 6px 0;
text-align: center;
}
.footer-content {
color: var(--text-secondary);
font-size: 0.75rem;
}
.footer-content p {
margin: 0;
}
.footer-content strong {
color: var(--text-color);
}
.footer-content a {
color: var(--primary-text-color);
text-decoration: none;
transition: opacity 0.2s;
}
.footer-content a:hover {
opacity: 0.8;
text-decoration: underline;
}
/* Command Palette */ /* Command Palette */
#command-palette { #command-palette {
position: fixed; position: fixed;
-5
View File
@@ -481,11 +481,6 @@
margin-bottom: 10px; margin-bottom: 10px;
} }
/* Footer */
.app-footer {
margin-bottom: 50px;
}
/* Command palette */ /* Command palette */
#command-palette { #command-palette {
padding-top: 5vh; padding-top: 5vh;
+26
View File
@@ -4601,6 +4601,32 @@ body.composite-layer-dragging .composite-layer-drag-handle {
font-size: 0.78rem; font-size: 0.78rem;
color: var(--lux-ink-dim, var(--text-secondary)); color: var(--lux-ink-dim, var(--text-secondary));
} }
.about-hero .about-author {
margin-top: 10px;
font-size: 0.78rem;
color: var(--lux-ink-dim, var(--text-secondary));
display: inline-flex;
align-items: center;
gap: 6px;
flex-wrap: wrap;
justify-content: center;
}
.about-hero .about-author strong {
color: var(--lux-ink, var(--text-color));
font-weight: 700;
}
.about-hero .about-author a {
color: var(--primary-text-color);
text-decoration: none;
transition: opacity 0.2s;
}
.about-hero .about-author a:hover {
opacity: 0.8;
text-decoration: underline;
}
.about-hero .about-author-sep {
opacity: 0.5;
}
.about-hero .about-links { .about-hero .about-links {
display: flex; display: flex;
gap: 6px; gap: 6px;
@@ -98,6 +98,11 @@ export function renderAboutPanel(): void {
<div class="about-name">${t('donation.about_title')}</div> <div class="about-name">${t('donation.about_title')}</div>
${version ? `<div class="about-version">${version}</div>` : ''} ${version ? `<div class="about-version">${version}</div>` : ''}
<div class="about-tag">${t('donation.about_opensource')}</div> <div class="about-tag">${t('donation.about_opensource')}</div>
<div class="about-author">
${t('donation.about_author')} <strong>Alexei Dolgolyov</strong>
<span class="about-author-sep">·</span>
<a href="mailto:dolgolyov.alexei@gmail.com">dolgolyov.alexei@gmail.com</a>
</div>
${linkButtons.length ? `<div class="about-links">${linkButtons.join('')}</div>` : ''} ${linkButtons.length ? `<div class="about-links">${linkButtons.join('')}</div>` : ''}
<div class="about-license">${t('donation.about_license')}</div> <div class="about-license">${t('donation.about_license')}</div>
</div> </div>
@@ -2475,6 +2475,7 @@
"donation.about_opensource": "LedGrab is open-source software, free to use and modify.", "donation.about_opensource": "LedGrab is open-source software, free to use and modify.",
"donation.about_donate": "Support development", "donation.about_donate": "Support development",
"donation.about_license": "MIT License", "donation.about_license": "MIT License",
"donation.about_author": "Created by",
"streams.group.game": "Game Integration", "streams.group.game": "Game Integration",
"tree.group.game": "Game", "tree.group.game": "Game",
@@ -2190,6 +2190,7 @@
"donation.about_opensource": "LedGrab — программа с открытым исходным кодом, бесплатная для использования и модификации.", "donation.about_opensource": "LedGrab — программа с открытым исходным кодом, бесплатная для использования и модификации.",
"donation.about_donate": "Поддержать разработку", "donation.about_donate": "Поддержать разработку",
"donation.about_license": "Лицензия MIT", "donation.about_license": "Лицензия MIT",
"donation.about_author": "Создатель —",
"streams.group.game": "Игровая интеграция", "streams.group.game": "Игровая интеграция",
"tree.group.game": "Игры", "tree.group.game": "Игры",
@@ -2188,6 +2188,7 @@
"donation.about_opensource": "LedGrab 是开源软件,可免费使用和修改。", "donation.about_opensource": "LedGrab 是开源软件,可免费使用和修改。",
"donation.about_donate": "支持开发", "donation.about_donate": "支持开发",
"donation.about_license": "MIT 许可证", "donation.about_license": "MIT 许可证",
"donation.about_author": "作者:",
"streams.group.game": "游戏集成", "streams.group.game": "游戏集成",
"tree.group.game": "游戏", "tree.group.game": "游戏",
-10
View File
@@ -212,16 +212,6 @@
})(); })();
</script> </script>
</div> </div>
<footer class="app-footer">
<div class="footer-content">
<p>
Created by <strong>Alexei Dolgolyov</strong>
<a href="mailto:dolgolyov.alexei@gmail.com">dolgolyov.alexei@gmail.com</a>
<a href="#" onclick="openSettingsModal();switchSettingsTab('about');return false" data-i18n="donation.about_title">About</a>
</p>
</div>
</footer>
</div> </div>
</main> </main>
</div> </div>