Evilfox/Amnezia-Web-Panel-main
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

Replace emoji UI icons with a shared SVG icon system.

Browse Source 
Add an icons sprite and helpers so nav, actions, and protocol cards use consistent stroke icons.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
orohi
2026-07-26 04:58:06 +03:00
co-authored by Cursor
parent 30ae4d476c
commit 16d14a7256
12 changed files with 398 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/login.html
+19 -17
View File
@@ -76,20 +76,20 @@
</head>
<body>
{% from "macros/icons.html" import icon %}
<button class="theme-toggle" onclick="openModal('langModal')" id="langToggle"
style="position:fixed; top:20px; {% if lang == 'fa' %}left:65px;{% else %}right:65px;{% endif %} z-index:10;"
title="{{ _('select_lang') }}">
{% if lang == 'ru' %}🇷🇺{% elif lang == 'fr' %}🇫🇷{% elif lang == 'zh' %}🇨🇳{% elif lang == 'fa' %}🇮🇷{%
else %}🇺🇸{% endif %}
title="{{ _('select_lang') }}" type="button">
{{ icon('globe') }}
</button>
<button class="theme-toggle" onclick="toggleTheme()" id="themeToggle"
style="position:fixed; top:20px; {% if lang == 'fa' %}left:20px;{% else %}right:20px;{% endif %} z-index:10;"
title="{{ _('toggle_theme') }}">🌙</button>
title="{{ _('toggle_theme') }}" type="button">{{ icon('moon') }}</button>
<div class="login-wrapper">
<div class="login-card">
<div class="login-logo">
<div class="logo-icon">{{ site_settings.logo or '🛡' }}</div>
<div class="logo-icon">{{ icon('shield') }}</div>
<div class="logo-text">{{ site_settings.title or 'Amnezia Panel' }}</div>
<div class="logo-subtitle">{{ site_settings.subtitle or 'Web Panel' }}</div>
</div>
@@ -153,19 +153,19 @@
</div>
<div style="display: flex; flex-direction: column; gap: var(--space-sm);">
{% set langs = [
('en', '🇺🇸', 'lang_en'),
('ru', '🇷🇺', 'lang_ru'),
('fr', '🇫🇷', 'lang_fr'),
('zh', '🇨🇳', 'lang_zh'),
('fa', '🇮🇷', 'lang_fa')
('en', 'EN', 'lang_en'),
('ru', 'RU', 'lang_ru'),
('fr', 'FR', 'lang_fr'),
('zh', 'ZH', 'lang_zh'),
('fa', 'FA', 'lang_fa')
] %}
{% for l_code, l_flag, l_key in langs %}
<a href="/set_lang/{{ l_code }}" class="btn btn-secondary"
style="justify-content: flex-start; gap: var(--space-md); padding: var(--space-md);">
<span style="font-size: 1.4rem;">{{ l_flag }}</span>
<span class="lang-code">{{ l_flag }}</span>
<span style="font-weight: 500;">{{ _(l_key) }}</span>
{% if lang == l_code %}
<span class="lang-check">✓</span>
<span class="lang-check">{{ icon('check') }}</span>
{% endif %}
</a>
{% endfor %}
@@ -177,6 +177,11 @@
window.I18N = {{ translations_json | safe }};
window._ = function (key) { return window.I18N[key] || key; };
window.uiIcon = function (name, className) {
const cls = className ? `ui-icon ${className}` : 'ui-icon';
return `<svg class="${cls}" aria-hidden="true" focusable="false"><use href="/static/icons.svg#${name}"></use></svg>`;
};
/* Theme toggle */
(function () {
const saved = localStorage.getItem('theme') || 'dark';
@@ -184,11 +189,8 @@
const updateUI = () => {
const isLight = document.documentElement.getAttribute('data-theme') === 'light';
document.querySelectorAll('.theme-toggle').forEach(btn => {
if (btn.id === 'themeToggle') {
btn.textContent = isLight ? '☀️' : '🌙';
}
});
const btn = document.getElementById('themeToggle');
if (btn) btn.innerHTML = uiIcon(isLight ? 'sun' : 'moon');
};
if (document.readyState === 'loading') {