feat(branding): logo and system name on share and report pages, drop logo border-radius

This commit is contained in:
dev
2026-09-23 16:25:13 +03:00
parent f2d465e0c4
commit 30cf04b0cf
7 changed files with 57 additions and 5 deletions
+2 -2
View File
@@ -5,7 +5,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;b
.layout{display:flex;min-height:100dvh}
.sidebar{width:var(--sidebar);background:var(--card);border-right:1px solid var(--border);padding:24px 0;position:fixed;top:0;left:0;height:100dvh;display:flex;flex-direction:column}
.sidebar .logo{font-size:1.1rem;font-weight:700;padding:0 20px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;min-width:0}
.sidebar .logo-ic{height:28px;width:auto;min-width:28px;border-radius:8px;background:var(--bg);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.sidebar .logo-ic{height:28px;width:auto;min-width:28px;background:var(--bg);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.sidebar .logo-ic img{max-width:100%;max-height:100%;object-fit:contain}
.sidebar #sidebarName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.user-box{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:2px}
@@ -304,7 +304,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;b
@media(max-width:640px){.save-bar{left:16px;right:16px}}
.logo-picker{display:flex;align-items:flex-start;gap:20px;flex-wrap:wrap}
.logo-preview{min-width:96px;min-height:72px;max-height:96px;height:auto;border:1px dashed var(--border);border-radius:14px;background:var(--bg);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;font-size:1.4rem;font-weight:700;color:var(--muted)}
.logo-preview{min-width:96px;min-height:72px;max-height:96px;height:auto;border:1px dashed var(--border);background:var(--bg);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;font-size:1.4rem;font-weight:700;color:var(--muted)}
.logo-preview img{max-width:100%;max-height:100%;object-fit:contain;display:none}
.logo-picker-actions{display:flex;flex-direction:column;gap:10px;align-items:flex-start;min-width:0}
.logo-picker-btns{display:flex;gap:10px;flex-wrap:wrap}
+14 -1
View File
@@ -4,7 +4,20 @@ function loadBrand(){
return fetch('/api/public-settings').then(function(res){
return res.ok?res.json():null;
}).then(function(s){
if(s&&(s.system_name||'').trim())state.systemName=s.system_name;
if(!s)return;
if((s.system_name||'').trim())state.systemName=s.system_name;
var logo=document.getElementById('brandLogo');
if(logo&&s.system_logo){
logo.src=s.system_logo;
logo.hidden=false;
var mark=document.getElementById('brandMark');
if(mark)mark.style.display='none';
}
var name=document.getElementById('brandName');
if(name&&(s.system_name||'').trim()){
name.textContent=s.system_name;
name.hidden=false;
}
}).catch(function(){});
}
+24
View File
@@ -309,3 +309,27 @@ document.addEventListener('click', e => {
notice.classList.add('hidden');
});
})();
(async function(){
try {
const res = await fetch('/api/public-settings');
if (!res.ok) return;
const s = await res.json();
const head = document.getElementById('brandHead');
if (!head) return;
const logo = document.getElementById('brandLogo');
const name = document.getElementById('brandName');
let any = false;
if (name && (s.system_name || '').trim()) {
name.textContent = s.system_name;
name.hidden = false;
any = true;
}
if (logo && s.system_logo) {
logo.src = s.system_logo;
logo.hidden = false;
any = true;
}
if (any) head.hidden = false;
} catch (e) {}
})();
+1 -1
View File
@@ -10,7 +10,7 @@
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);min-height:100dvh;display:flex;align-items:center;justify-content:center}
.login{max-width:320px;width:100%;text-align:center;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:40px 32px}
.login .brand{display:flex;flex-direction:column;align-items:center;gap:14px;margin-bottom:24px}
.login .brand .logo{height:48px;width:auto;min-width:48px;border-radius:14px;background:var(--bg);border:1px solid var(--border);display:none;align-items:center;justify-content:center;overflow:hidden}
.login .brand .logo{height:48px;width:auto;min-width:48px;background:var(--bg);border:1px solid var(--border);display:none;align-items:center;justify-content:center;overflow:hidden}
.login .brand .logo img{max-width:100%;max-height:100%;object-fit:contain}
.login h1{font-size:1.3rem;font-weight:600;margin:0}
.login input{width:100%;background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:var(--radius);padding:14px 16px;font-size:.95rem;outline:none;margin-bottom:12px;text-align:center}
+3
View File
@@ -50,6 +50,9 @@ button,a{-webkit-tap-highlight-color:transparent}
.rep-logo-box{width:auto;min-width:44px;height:40px;align-items:center;justify-content:center;overflow:visible}
.rep-logo{font-size:20px;font-weight:500;letter-spacing:-.05em;line-height:1;color:rgb(21,21,21);white-space:nowrap}
.rep-brand-logo{height:40px;width:auto;max-width:min(30vw,200px);object-fit:contain;display:block}
.rep-brand-name{font-size:18px;font-weight:500;letter-spacing:-.05em;line-height:1;color:rgb(21,21,21);white-space:nowrap;max-width:min(26vw,180px);overflow:hidden;text-overflow:ellipsis}
.rep-nav .link-block--u-ij7yf5mm2{column-gap:12px}
.rep-logo-box--footer{height:20px;min-width:0}
.rep-logo--white{font-size:18px;color:#fff}
+5 -1
View File
@@ -16,7 +16,11 @@
<section class="section paddings--left-right section--u-i7l3q2nvu rep-nav">
<div class="container container--u-i80idakgi">
<a href="#top" class="link-block link-block--u-ij7yf5mm2">
<div class="image image--u-irhpgss26 rep-logo-box"><span class="rep-logo" id="brandMark">—</span></div>
<div class="image image--u-irhpgss26 rep-logo-box">
<img id="brandLogo" class="rep-brand-logo" alt="" hidden>
<span class="rep-logo" id="brandMark">—</span>
</div>
<span class="rep-brand-name" id="brandName" hidden></span>
</a>
<div class="menu menu--u-i9yrdei10 menu--s2-i9yrdei10">
<div class="menu__fixed-wrapper menu__fixed-wrapper--s2-iek5sxvy1 rep-menu-panel" id="navPanel">
+8
View File
@@ -10,6 +10,10 @@
:root{--yellow:#F7C90E;--dark:#211E22;--gray:#9C9C9C;--page:#f6f6f6;--card-bg:#fff;--radius:30px}
body{font-family:'Segoe UI',system-ui,-apple-system,Roboto,sans-serif;background:var(--page);color:var(--dark);min-height:100dvh}
.hero{background:var(--yellow);padding:44px 20px 52px;text-align:center;position:relative;overflow:hidden}
.hero .brand{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:16px}
.hero .brand[hidden]{display:none}
.hero .brand .brand-logo{height:52px;width:auto;max-width:min(42vw,300px);object-fit:contain;display:block}
.hero .brand .brand-name{font-size:1.05rem;font-weight:800;letter-spacing:-.02em;color:var(--dark);opacity:.8}
.hero h1{font-size:clamp(1.6rem,4.5vw,2.9rem);font-weight:800;line-height:1.05;letter-spacing:-.02em;color:var(--dark);max-width:900px;margin:0 auto}
.hero .chips{margin-top:20px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.hero .chip{background:#fff;color:var(--dark);border-radius:999px;padding:8px 18px;font-size:.88rem;font-weight:600;box-shadow:5px 5px 10px rgba(216,173,0,.25)}
@@ -88,6 +92,10 @@ body{font-family:'Segoe UI',system-ui,-apple-system,Roboto,sans-serif;background
</head>
<body>
<section class="hero">
<div class="brand" id="brandHead" hidden>
<img class="brand-logo" id="brandLogo" alt="" hidden>
<span class="brand-name" id="brandName" hidden></span>
</div>
<h1 id="title">Загрузка...</h1>
<div class="chips" id="chips"></div>
</section>