Podešavanja: pozadinska slika i glass efekt za aplikaciju sa live preview sliderom
This commit is contained in:
@@ -0,0 +1,51 @@
|
||||
<svg width="100%" viewBox="0 0 750 690" role="img" style="" xmlns="http://www.w3.org/2000/svg">
|
||||
<title style="fill:rgb(0, 0, 0);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto">NTech favicon v4</title>
|
||||
<desc style="fill:rgb(0, 0, 0);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto">Moderna ikonica sa NT slovima i tehnološkim akcentom</desc>
|
||||
|
||||
<defs>
|
||||
<clipPath id="rounded-clip">
|
||||
<rect width="680" height="680" rx="120"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
|
||||
|
||||
<rect width="680" height="680" rx="120" style="fill:rgb(30, 27, 75);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
|
||||
<g clip-path="url(#rounded-clip)" style="fill:rgb(0, 0, 0);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto">
|
||||
<!-- Dekorativni krugovi u pozadini -->
|
||||
<circle cx="560" cy="160" r="180" fill="#2d2a6e" opacity="0.5" style="fill:rgb(45, 42, 110);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:0.5;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<circle cx="140" cy="520" r="120" fill="#2d2a6e" opacity="0.4" style="fill:rgb(45, 42, 110);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:0.4;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
|
||||
<!-- Horizontalna linija-akcenat -->
|
||||
<rect x="80" y="335" width="520" height="3" rx="2" fill="#4f46e5" opacity="0.35" style="fill:rgb(79, 70, 229);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:0.35;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
|
||||
<!-- Slovo N -->
|
||||
<path d="M80 490 L80 190 L135 190 L295 410 L295 190 L350 190 L350 490 L295 490 L135 270 L135 490 Z" fill="#6366f1" style="fill:rgb(99, 102, 241);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<path d="M80 190 L135 190 L135 255 L80 215 Z" fill="#818cf8" style="fill:rgb(129, 140, 248);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<path d="M295 430 L350 490 L295 490 Z" fill="#818cf8" style="fill:rgb(129, 140, 248);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
|
||||
<!-- Slovo T -->
|
||||
<rect x="375" y="190" width="205" height="48" rx="6" fill="#6366f1" style="fill:rgb(99, 102, 241);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<rect x="452" y="238" width="52" height="252" rx="6" fill="#6366f1" style="fill:rgb(99, 102, 241);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<rect x="375" y="190" width="100" height="20" rx="6" fill="#818cf8" style="fill:rgb(129, 140, 248);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
|
||||
<!-- Tehnički detalj — tačka gore desno -->
|
||||
<circle cx="590" cy="155" r="24" style="fill:rgb(99, 102, 241);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<circle cx="590" cy="155" r="13" fill="#1e1b4b" style="fill:rgb(30, 27, 75);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<circle cx="590" cy="155" r="6" style="fill:rgb(165, 180, 252);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
|
||||
<!-- Linija koja spaja sa T -->
|
||||
<line x1="567" y1="162" x2="550" y2="190" stroke="#4f46e5" stroke-width="2.5" stroke-linecap="round" style="fill:rgb(0, 0, 0);stroke:rgb(79, 70, 229);color:rgb(251, 251, 254);stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
|
||||
<!-- Male tačke -->
|
||||
<circle cx="590" cy="205" r="5" style="fill:rgb(55, 48, 163);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<circle cx="590" cy="228" r="5" style="fill:rgb(55, 48, 163);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<circle cx="590" cy="251" r="5" style="fill:rgb(55, 48, 163);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
|
||||
<!-- Donji akcenat -->
|
||||
<rect x="80" y="518" width="130" height="4" rx="2" style="fill:rgb(99, 102, 241);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:1;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
<rect x="223" y="518" width="44" height="4" rx="2" opacity="0.5" style="fill:rgb(129, 140, 248);stroke:none;color:rgb(251, 251, 254);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;opacity:0.5;font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:16px;font-weight:400;text-anchor:start;dominant-baseline:auto"/>
|
||||
</g>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 8.4 KiB |
@@ -85,6 +85,151 @@
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<!-- pozadinska slika aplikacije — upload, preview i stilovi -->
|
||||
<div class="kartica animiraj" style="margin-bottom:16px;"
|
||||
x-data="{
|
||||
blur: Number('{{.AppPozadinaBlur}}'),
|
||||
opacity: Number('{{.AppPozadinaOpacity}}'),
|
||||
slika: '{{.AppPozadina}}'
|
||||
}">
|
||||
|
||||
<div style="display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="var(--sb-akcent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>
|
||||
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Pozadinska slika aplikacije</span>
|
||||
</div>
|
||||
|
||||
{{if .AppPozadina}}
|
||||
<div style="margin-bottom:14px;display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;">
|
||||
<img src="{{.AppPozadina}}" alt="Trenutna app pozadina"
|
||||
style="width:160px;height:90px;object-fit:cover;border:0.5px solid var(--ivica);border-radius:8px;">
|
||||
<form method="POST" action="/podesavanja/app-pozadina/ukloni" style="margin:0;">
|
||||
<button type="submit"
|
||||
style="padding:7px 14px;background:transparent;border:0.5px solid #fca5a5;border-radius:8px;color:#dc2626;font-size:12px;cursor:pointer;"
|
||||
data-potvrda="Ukloniti pozadinsku sliku aplikacije?">
|
||||
Ukloni sliku
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
{{end}}
|
||||
|
||||
<form method="POST" action="/podesavanja/app-pozadina" enctype="multipart/form-data">
|
||||
<div style="display:flex;gap:10px;align-items:center;flex-wrap:wrap;">
|
||||
<input type="file" name="app_pozadina" accept=".jpg,.jpeg,.png,.webp"
|
||||
style="flex:1;min-width:200px;font-size:13px;color:var(--tekst-sporedni);">
|
||||
<button type="submit"
|
||||
style="padding:8px 16px;background:var(--sb-aktivan);color:var(--tekst-jak);border:0.5px solid var(--ivica);border-radius:8px;font-size:13px;cursor:pointer;white-space:nowrap;transition:opacity 0.2s;"
|
||||
onmouseover="this.style.opacity='0.8'" onmouseout="this.style.opacity='1'">
|
||||
Otpremi sliku
|
||||
</button>
|
||||
</div>
|
||||
<div style="font-size:12px;color:var(--tekst-sporedni);margin-top:6px;">JPG, PNG ili WebP — maksimum 5 MB</div>
|
||||
</form>
|
||||
|
||||
<!-- live preview -->
|
||||
<div style="margin-top:20px;padding-top:16px;border-top:0.5px solid var(--ivica);">
|
||||
<div style="font-size:13px;font-weight:500;color:var(--tekst-glavni);margin-bottom:10px;">Preview</div>
|
||||
|
||||
<!-- simulacija layouta aplikacije -->
|
||||
<div style="position:relative;width:100%;height:180px;border-radius:12px;overflow:hidden;"
|
||||
:style="slika ? `background:url('${slika}') center/cover` : 'background:#1a2033'">
|
||||
<!-- overlay -->
|
||||
<div style="position:absolute;inset:0;pointer-events:none;"
|
||||
:style="`background:rgba(0,0,0,${opacity}%)`"></div>
|
||||
<!-- lažni sidebar -->
|
||||
<div style="position:absolute;top:0;left:0;bottom:0;width:70px;display:flex;flex-direction:column;padding:10px 8px;gap:8px;"
|
||||
:style="`background:rgba(255,255,255,0.08);backdrop-filter:blur(${blur}px);-webkit-backdrop-filter:blur(${blur}px);border-right:1px solid rgba(255,255,255,0.12)`">
|
||||
<div style="width:38px;height:8px;background:rgba(255,255,255,0.35);border-radius:4px;"></div>
|
||||
<div style="margin-top:6px;display:flex;flex-direction:column;gap:6px;">
|
||||
<div style="width:30px;height:5px;background:rgba(255,255,255,0.2);border-radius:3px;"></div>
|
||||
<div style="width:26px;height:5px;background:rgba(255,255,255,0.14);border-radius:3px;"></div>
|
||||
<div style="width:32px;height:5px;background:rgba(255,255,255,0.14);border-radius:3px;"></div>
|
||||
<div style="width:22px;height:5px;background:rgba(255,255,255,0.14);border-radius:3px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- lažni glavni sadržaj -->
|
||||
<div style="position:absolute;top:0;left:70px;right:0;bottom:0;padding:7px;display:flex;flex-direction:column;gap:6px;">
|
||||
<!-- lažni topbar -->
|
||||
<div style="height:26px;border-radius:7px;flex-shrink:0;"
|
||||
:style="`background:rgba(255,255,255,0.08);backdrop-filter:blur(${blur}px);-webkit-backdrop-filter:blur(${blur}px);border:1px solid rgba(255,255,255,0.12)`"></div>
|
||||
<!-- lažne kartice -->
|
||||
<div style="display:flex;gap:6px;flex:1;">
|
||||
<div style="border-radius:7px;flex:1;"
|
||||
:style="`background:rgba(255,255,255,0.08);backdrop-filter:blur(${blur}px);-webkit-backdrop-filter:blur(${blur}px);border:1px solid rgba(255,255,255,0.12)`"></div>
|
||||
<div style="border-radius:7px;flex:1;"
|
||||
:style="`background:rgba(255,255,255,0.08);backdrop-filter:blur(${blur}px);-webkit-backdrop-filter:blur(${blur}px);border:1px solid rgba(255,255,255,0.12)`"></div>
|
||||
<div style="border-radius:7px;flex:1;"
|
||||
:style="`background:rgba(255,255,255,0.08);backdrop-filter:blur(${blur}px);-webkit-backdrop-filter:blur(${blur}px);border:1px solid rgba(255,255,255,0.12)`"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- slideri -->
|
||||
<div style="margin-top:14px;display:flex;flex-direction:column;gap:10px;">
|
||||
<div>
|
||||
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;">
|
||||
<span style="font-size:12px;color:var(--tekst-sporedni);">Zamućenje stakla</span>
|
||||
<span style="font-size:12px;color:var(--tekst-glavni);font-weight:500;" x-text="blur + 'px'"></span>
|
||||
</div>
|
||||
<input type="range" x-model.number="blur" min="0" max="20" step="1"
|
||||
style="width:100%;accent-color:var(--sb-akcent);height:4px;cursor:pointer;">
|
||||
</div>
|
||||
<div>
|
||||
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;">
|
||||
<span style="font-size:12px;color:var(--tekst-sporedni);">Zatamnjivanje</span>
|
||||
<span style="font-size:12px;color:var(--tekst-glavni);font-weight:500;" x-text="opacity + '%'"></span>
|
||||
</div>
|
||||
<input type="range" x-model.number="opacity" min="0" max="80" step="1"
|
||||
style="width:100%;accent-color:var(--sb-akcent);height:4px;cursor:pointer;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- forma za čuvanje vrednosti slidera -->
|
||||
<form method="POST" action="/podesavanja/app-pozadina/stilovi" style="margin-top:12px;">
|
||||
<input type="hidden" name="blur" :value="blur">
|
||||
<input type="hidden" name="opacity" :value="opacity">
|
||||
<button type="submit"
|
||||
style="padding:8px 20px;background:var(--sb-akcent);color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;transition:opacity 0.2s;"
|
||||
onmouseover="this.style.opacity='0.85'" onmouseout="this.style.opacity='1'">
|
||||
Sačuvaj izgled
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- pozadinska slika login stranice — posebna forma jer je multipart -->
|
||||
<form method="POST" action="/podesavanja/login-pozadina" enctype="multipart/form-data">
|
||||
<div class="kartica animiraj" style="margin-bottom:16px;">
|
||||
<div style="display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="var(--sb-akcent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>
|
||||
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Pozadinska slika prijave</span>
|
||||
</div>
|
||||
{{if .LoginPozadina}}
|
||||
<div style="margin-bottom:14px;display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;">
|
||||
<img src="{{.LoginPozadina}}" alt="Trenutna pozadina"
|
||||
style="width:160px;height:90px;object-fit:cover;border:0.5px solid var(--ivica);border-radius:8px;">
|
||||
<form method="POST" action="/podesavanja/login-pozadina/ukloni" style="margin:0;">
|
||||
<button type="submit"
|
||||
style="padding:7px 14px;background:transparent;border:0.5px solid #fca5a5;border-radius:8px;color:#dc2626;font-size:12px;cursor:pointer;"
|
||||
onclick="return confirm('Ukloniti pozadinsku sliku?')">
|
||||
Ukloni sliku
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
{{end}}
|
||||
<div style="display:flex;gap:10px;align-items:center;flex-wrap:wrap;">
|
||||
<input type="file" name="login_pozadina" accept=".jpg,.jpeg,.png,.webp"
|
||||
style="flex:1;min-width:200px;font-size:13px;color:var(--tekst-sporedni);">
|
||||
<button type="submit"
|
||||
style="padding:8px 16px;background:var(--sb-aktivan);color:var(--tekst-jak);border:0.5px solid var(--ivica);border-radius:8px;font-size:13px;cursor:pointer;white-space:nowrap;transition:opacity 0.2s;"
|
||||
onmouseover="this.style.opacity='0.8'" onmouseout="this.style.opacity='1'">
|
||||
Otpremi sliku
|
||||
</button>
|
||||
</div>
|
||||
<div style="font-size:12px;color:var(--tekst-sporedni);margin-top:6px;">JPG, PNG ili WebP — maksimum 5 MB</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<form method="POST" action="/podesavanja/sacuvaj">
|
||||
|
||||
<!-- sekcija: firma -->
|
||||
|
||||
@@ -14,7 +14,31 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 16px;
|
||||
position: relative;
|
||||
}
|
||||
{{if .LoginPozadina}}
|
||||
body::before {
|
||||
content: '';
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
background-image: url('{{.LoginPozadina}}');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
z-index: 0;
|
||||
}
|
||||
body::after {
|
||||
content: '';
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
background: rgba(0, 0, 0, 0.40);
|
||||
z-index: 1;
|
||||
}
|
||||
.kartica {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
{{end}}
|
||||
.kartica {
|
||||
background: #1a1d27;
|
||||
border: 0.5px solid #2d3148;
|
||||
|
||||
@@ -148,6 +148,14 @@
|
||||
{{if .Nalog.Avans}}{{.Nalog.AvansStr}} din{{else}}—{{end}}
|
||||
</div>
|
||||
</div>
|
||||
{{if .Nalog.PreostaloZaNaplatu}}
|
||||
<div>
|
||||
<div style="font-size:12px;color:var(--tekst-sporedni);margin-bottom:4px;">Preostalo za naplatu</div>
|
||||
<div style="font-size:20px;font-weight:600;color:#16a34a;">
|
||||
{{.Nalog.PreostaloZaNaplatuStr}} din
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
<!doctype html>
|
||||
<html lang="sr">
|
||||
<head>
|
||||
<link rel="icon" type="image/svg+xml" href="/static/favicon.svg">
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>{{block "naslov" .}}NTech{{end}}</title>
|
||||
@@ -23,8 +24,49 @@
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
|
||||
{{block "dodatni-css" .}}{{end}}
|
||||
|
||||
{{if .AppPozadina}}
|
||||
<style>
|
||||
body {
|
||||
background-image: url('{{.AppPozadina}}');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-attachment: fixed;
|
||||
}
|
||||
.app-overlay {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
background: rgba(0,0,0,{{.AppPozadinaOpacity}}%);
|
||||
pointer-events: none;
|
||||
z-index: 0;
|
||||
}
|
||||
.raspored {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.sidebar {
|
||||
background: rgba(255,255,255,0.08) !important;
|
||||
backdrop-filter: blur({{.AppPozadinaBlur}}px);
|
||||
-webkit-backdrop-filter: blur({{.AppPozadinaBlur}}px);
|
||||
border-right: 1px solid rgba(255,255,255,0.12) !important;
|
||||
}
|
||||
.topbar {
|
||||
background: rgba(255,255,255,0.08) !important;
|
||||
backdrop-filter: blur({{.AppPozadinaBlur}}px);
|
||||
-webkit-backdrop-filter: blur({{.AppPozadinaBlur}}px);
|
||||
border-bottom: 1px solid rgba(255,255,255,0.12) !important;
|
||||
}
|
||||
.kartica {
|
||||
background: rgba(255,255,255,0.08) !important;
|
||||
backdrop-filter: blur({{.AppPozadinaBlur}}px);
|
||||
-webkit-backdrop-filter: blur({{.AppPozadinaBlur}}px);
|
||||
border: 1px solid rgba(255,255,255,0.12) !important;
|
||||
}
|
||||
</style>
|
||||
{{end}}
|
||||
</head>
|
||||
<body>
|
||||
{{if .AppPozadina}}<div class="app-overlay"></div>{{end}}
|
||||
<div class="sidebar-overlay" id="sidebar-overlay"></div>
|
||||
<div class="raspored">
|
||||
{{template "sidebar" .}}
|
||||
|
||||
Reference in New Issue
Block a user