Dasko/GoNtech
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Embed implementacija, animacije, sidebar hover

Browse Source
This commit is contained in:
Dalibor Marković
2026-06-04 02:50:48 +02:00
parent 851ceb32dc
commit 08b9359a76
34 changed files with 171 additions and 378 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/templates/stranice/admin_korisnici.html
+3 -14
View File
@@ -8,17 +8,8 @@
from { opacity: 0; transform: translateY(-10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.poruka-animacija { animation: slideDown 0.3s ease forwards; }
.korisnici-tabela tbody tr {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.korisnici-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.korisnici-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.korisnici-tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
@@ -31,8 +22,6 @@
.korisnici-tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
.nova-forma-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
animation-delay: 0.30s;
}
</style>
@@ -52,7 +41,7 @@
{{end}}
<!-- lista korisnika -->
<div class="kartica" style="padding:0;overflow:hidden;">
<div class="kartica animiraj" style="padding:0;overflow:hidden;">
<div style="padding:16px 20px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Korisnici sistema</span>
</div>
@@ -70,7 +59,7 @@
</thead>
<tbody>
{{range .Korisnici}}
<tr style="border-bottom:0.5px solid var(--ivica);">
<tr class="animiraj" style="border-bottom:0.5px solid var(--ivica);">
<td style="padding:10px 20px;font-size:14px;font-weight:500;color:var(--tekst-glavni);">{{.KorisnickoIme}}</td>
<td style="padding:10px 20px;">
{{if eq $.KorisnikUloga "superadmin"}}
@@ -127,7 +116,7 @@
</div>
<!-- forma za novog korisnika -->
<div class="kartica nova-forma-kartica">
<div class="kartica nova-forma-kartica animiraj">
<div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
Novi korisnik
</div>
web/templates/stranice/admin_login_istorija.html
+11 -2
View File
@@ -2,6 +2,15 @@
{{define "naslov"}}Istorija prijava — NTech{{end}}
{{define "dodatni-css"}}
<style>
.animiraj:nth-child(1) { animation-delay: 0.10s; }
.animiraj:nth-child(2) { animation-delay: 0.16s; }
.animiraj:nth-child(3) { animation-delay: 0.22s; }
.animiraj:nth-child(4) { animation-delay: 0.28s; }
</style>
{{end}}
{{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;">
@@ -15,7 +24,7 @@
</span>
</div>
<div class="kartica" style="padding:0;overflow:hidden;">
<div class="kartica animiraj" style="padding:0;overflow:hidden;">
<div style="padding:16px 20px;border-bottom:0.5px solid var(--ivica);display:flex;align-items:center;justify-content:space-between;">
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Poslednjih 50 pokušaja</span>
<span style="font-size:12px;color:var(--tekst-sporedni);">Vreme prikazano u UTC</span>
@@ -35,7 +44,7 @@
</thead>
<tbody>
{{range .Istorija}}
<tr style="border-bottom:0.5px solid var(--ivica);">
<tr class="animiraj" style="border-bottom:0.5px solid var(--ivica);">
<td style="padding:10px 20px;font-size:13px;color:var(--tekst-sporedni);white-space:nowrap;">
{{.Vreme.Format "02.01.2006. 15:04:05"}}
</td>
web/templates/stranice/admin_profil.html
+10 -3
View File
@@ -2,7 +2,14 @@
{{define "naslov"}}Moj profil — NTech{{end}}
{{define "dodatni-css"}}{{end}}
{{define "dodatni-css"}}
<style>
.animiraj:nth-child(1) { animation-delay: 0.10s; }
.animiraj:nth-child(2) { animation-delay: 0.16s; }
.animiraj:nth-child(3) { animation-delay: 0.22s; }
.animiraj:nth-child(4) { animation-delay: 0.28s; }
</style>
{{end}}
{{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;max-width:560px;">
@@ -16,7 +23,7 @@
{{end}}
<!-- promena lozinke -->
<div class="kartica">
<div class="kartica animiraj">
<div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
Promena lozinke
</div>
@@ -52,7 +59,7 @@
</div>
<!-- TOTP / 2FA -->
<div class="kartica">
<div class="kartica animiraj">
<div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
Dvostepena verifikacija (2FA)
</div>
web/templates/stranice/dashboard.html
+8 -21
View File
@@ -4,25 +4,12 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.dash-stat {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.dash-stat:nth-child(1) { animation-delay: 0.04s; }
.dash-stat:nth-child(2) { animation-delay: 0.10s; }
.dash-stat:nth-child(3) { animation-delay: 0.16s; }
.dash-stat:nth-child(4) { animation-delay: 0.22s; }
.dash-stat:nth-child(5) { animation-delay: 0.28s; }
.dash-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.dash-kartica:nth-child(1) { animation-delay: 0.20s; }
.dash-kartica:nth-child(2) { animation-delay: 0.28s; }
.dash-kartica:nth-child(3) { animation-delay: 0.36s; }
@@ -32,7 +19,7 @@
{{define "sadrzaj"}}
<div class="grid grid-cols-2 md:grid-cols-5 gap-3 mb-6">
<!-- stat kartice -->
<div class="kartica dash-stat">
<div class="kartica dash-stat animiraj">
<div style="width:36px;height:36px;border-radius:8px;background:#eff2ff;display:flex;align-items:center;justify-content:center;margin-bottom:10px;">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#4f7ef8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/></svg>
</div>
@@ -40,7 +27,7 @@
<div style="font-size:12px;color:var(--tekst-sporedni);margin-top:4px;">Artikala na stanju</div>
</div>
<div class="kartica dash-stat">
<div class="kartica dash-stat animiraj">
<div style="width:36px;height:36px;border-radius:8px;background:#f0fdf4;display:flex;align-items:center;justify-content:center;margin-bottom:10px;">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#16a34a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"/></svg>
</div>
@@ -48,7 +35,7 @@
<div style="font-size:12px;color:var(--tekst-sporedni);margin-top:4px;">Aktivnih servisa</div>
</div>
<div class="kartica dash-stat">
<div class="kartica dash-stat animiraj">
<div style="width:36px;height:36px;border-radius:8px;background:#fff7ed;display:flex;align-items:center;justify-content:center;margin-bottom:10px;">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#ea580c" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="21" r="1"/><circle cx="20" cy="21" r="1"/><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"/></svg>
</div>
@@ -56,7 +43,7 @@
<div style="font-size:12px;color:var(--tekst-sporedni);margin-top:4px;">Prihod ovog meseca</div>
</div>
<div class="kartica dash-stat">
<div class="kartica dash-stat animiraj">
<div style="width:36px;height:36px;border-radius:8px;background:#fef2f2;display:flex;align-items:center;justify-content:center;margin-bottom:10px;">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#dc2626" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg>
</div>
@@ -64,7 +51,7 @@
<div style="font-size:12px;color:var(--tekst-sporedni);margin-top:4px;">Kritično niska zaliha</div>
</div>
<a href="/podsetnici" class="kartica dash-stat" style="text-decoration:none;display:block;">
<a href="/podsetnici" class="kartica dash-stat animiraj" style="text-decoration:none;display:block;">
<div style="width:36px;height:36px;border-radius:8px;background:#f0f9ff;display:flex;align-items:center;justify-content:center;margin-bottom:10px;">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#0284c7" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"/><path d="M13.73 21a2 2 0 0 1-3.46 0"/></svg>
</div>
@@ -75,7 +62,7 @@
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<!-- poslednji servisi -->
<div class="kartica dash-kartica">
<div class="kartica dash-kartica animiraj">
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;">
<span style="font-size:14px;font-weight:500;color:var(--tekst-glavni);">Poslednji servisi</span>
</div>
@@ -91,7 +78,7 @@
</div>
<!-- kritične zalihe -->
<div class="kartica dash-kartica">
<div class="kartica dash-kartica animiraj">
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;">
<span style="font-size:14px;font-weight:500;color:var(--tekst-glavni);">Kritične zalihe</span>
<span style="font-size:11px;padding:2px 8px;border-radius:20px;background:#fffbeb;color:#b45309;font-weight:500;">Upozorenje</span>
@@ -108,7 +95,7 @@
</div>
<!-- poslednje prodaje -->
<div class="kartica dash-kartica">
<div class="kartica dash-kartica animiraj">
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;">
<span style="font-size:14px;font-weight:500;color:var(--tekst-glavni);">Poslednje prodaje</span>
</div>
web/templates/stranice/dobavljac_forma.html
+1 -18
View File
@@ -4,23 +4,6 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes shake {
0%, 100% { transform: translateX(0); }
20% { transform: translateX(-6px); }
40% { transform: translateX(6px); }
60% { transform: translateX(-4px); }
80% { transform: translateX(4px); }
}
.forma-kartica {
animation: fadeInUp 0.3s ease forwards;
}
.greska-animacija {
animation: shake 0.4s ease;
}
@@ -38,7 +21,7 @@
Nazad na dobavljače
</a>
<div class="kartica forma-kartica">
<div class="kartica forma-kartica animiraj">
<div style="margin-bottom:20px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">
{{if .Izmena}}Izmeni dobavljača{{else}}Novi dobavljač{{end}}
web/templates/stranice/dobavljaci.html
+3 -18
View File
@@ -9,20 +9,10 @@
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.poruka-animacija {
animation: slideDown 0.3s ease forwards;
}
.dobavljaci-tabela tbody tr {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
/* stagger — svaki red se pojavljuje malo kasnije */
.dobavljaci-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.dobavljaci-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
@@ -41,11 +31,6 @@
gap: 12px;
}
.dobavljac-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.dobavljac-kartica:nth-child(1) { animation-delay: 0.04s; }
.dobavljac-kartica:nth-child(2) { animation-delay: 0.10s; }
.dobavljac-kartica:nth-child(3) { animation-delay: 0.16s; }
@@ -89,7 +74,7 @@
</div>
<!-- desktop tabela -->
<div class="kartica dobavljaci-tabela" style="padding:0;overflow:hidden;">
<div class="kartica dobavljaci-tabela animiraj" style="padding:0;overflow:hidden;">
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;">
<thead>
@@ -103,7 +88,7 @@
</thead>
<tbody>
{{range .Dobavljaci}}
<tr style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
<tr class="animiraj" style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
onmouseover="this.style.background='var(--pozadina)'"
onmouseout="this.style.background=''">
<td style="padding:12px 16px;font-size:14px;font-weight:500;color:var(--tekst-glavni);">{{.Naziv}}</td>
@@ -149,7 +134,7 @@
<!-- mobilne kartice -->
<div class="dobavljaci-kartice">
{{range .Dobavljaci}}
<div class="kartica dobavljac-kartica">
<div class="kartica dobavljac-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;">
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">{{.Naziv}}</span>
<div style="display:flex;gap:8px;flex-shrink:0;">
web/templates/stranice/izvestaji.html
+5 -18
View File
@@ -83,23 +83,10 @@
.badge-dana.upozorenje { background: #fffbeb; color: #b45309; }
.badge-dana.kritican { background: #fef2f2; color: #dc2626; }
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.izv-sekcija {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.izv-sekcija:nth-child(1) { animation-delay: 0.04s; }
.izv-sekcija:nth-child(2) { animation-delay: 0.12s; }
.izv-sekcija:nth-child(3) { animation-delay: 0.20s; }
.izv-grid-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.izv-grid-kartica:nth-child(1) { animation-delay: 0.24s; }
.izv-grid-kartica:nth-child(2) { animation-delay: 0.32s; }
</style>
@@ -109,7 +96,7 @@
<div style="display:flex;flex-direction:column;gap:20px;">
<!-- 1. mesečni prihod -->
<div class="kartica izv-sekcija">
<div class="kartica izv-sekcija animiraj">
<div style="display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:4px;">
<div class="izv-naslov" style="margin-bottom:0;">Mesečni prihod — poslednjih 12 meseci</div>
<div class="toggle-red" style="margin-bottom:0;">
@@ -156,7 +143,7 @@
</div>
<!-- 2. stari otvoreni nalozi -->
<div class="kartica izv-sekcija">
<div class="kartica izv-sekcija animiraj">
<div class="izv-naslov">Stari otvoreni nalozi — bez završetka duže od 14 dana</div>
{{if .StariNalozi}}
<div style="overflow-x:auto;">
@@ -198,10 +185,10 @@
{{end}}
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 izv-sekcija">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 izv-sekcija animiraj">
<!-- 3. top 10 artikala -->
<div class="kartica izv-grid-kartica">
<div class="kartica izv-grid-kartica animiraj">
<div class="izv-naslov">Najprodavaniji artikli — top 10</div>
{{if .TopArtikli}}
<table style="width:100%;border-collapse:collapse;">
@@ -235,7 +222,7 @@
</div>
<!-- 4. top 10 klijenata -->
<div class="kartica izv-grid-kartica">
<div class="kartica izv-grid-kartica animiraj">
<div class="izv-naslov">Najvažniji klijenti — top 10</div>
{{if .TopKlijenti}}
<table style="width:100%;border-collapse:collapse;">
web/templates/stranice/kategorije.html
+2 -13
View File
@@ -8,23 +8,12 @@
from { opacity: 0; transform: translateY(-10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.poruka-animacija { animation: slideDown 0.3s ease forwards; }
.kat-forma-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
animation-delay: 0.04s;
}
.kat-red {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.kat-red:nth-child(1) { animation-delay: 0.12s; }
.kat-red:nth-child(2) { animation-delay: 0.18s; }
.kat-red:nth-child(3) { animation-delay: 0.24s; }
@@ -53,7 +42,7 @@
</a>
<!-- forma za novu kategoriju -->
<div class="kartica kat-forma-kartica">
<div class="kartica kat-forma-kartica animiraj">
<div style="margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Nova kategorija</span>
</div>
@@ -87,7 +76,7 @@
<span style="font-size:14px;font-weight:500;color:var(--tekst-glavni);">Postojeće kategorije</span>
</div>
{{range .Kategorije}}
<div class="kat-red" style="display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:0.5px solid var(--ivica);">
<div class="kat-red animiraj" style="display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:0.5px solid var(--ivica);">
<div style="flex:1;">
<div style="font-size:14px;color:var(--tekst-glavni);">{{.Naziv}}</div>
{{if .Opis}}
web/templates/stranice/klijent_forma.html
+1 -18
View File
@@ -4,23 +4,6 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes shake {
0%, 100% { transform: translateX(0); }
20% { transform: translateX(-6px); }
40% { transform: translateX(6px); }
60% { transform: translateX(-4px); }
80% { transform: translateX(4px); }
}
.forma-kartica {
animation: fadeInUp 0.3s ease forwards;
}
.greska-animacija {
animation: shake 0.4s ease;
}
@@ -42,7 +25,7 @@
Nazad na klijente
</a>
<div class="kartica forma-kartica">
<div class="kartica forma-kartica animiraj">
<div style="margin-bottom:20px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">
{{if .Izmena}}Izmeni klijenta{{else}}Novi klijent{{end}}
web/templates/stranice/klijenti.html
+3 -18
View File
@@ -9,20 +9,10 @@
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.poruka-animacija {
animation: slideDown 0.3s ease forwards;
}
.klijenti-tabela tbody tr {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.klijenti-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.klijenti-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.klijenti-tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
@@ -40,11 +30,6 @@
gap: 12px;
}
.klijent-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.klijent-kartica:nth-child(1) { animation-delay: 0.04s; }
.klijent-kartica:nth-child(2) { animation-delay: 0.10s; }
.klijent-kartica:nth-child(3) { animation-delay: 0.16s; }
@@ -88,7 +73,7 @@
</div>
<!-- desktop tabela -->
<div class="kartica klijenti-tabela" style="padding:0;overflow:hidden;">
<div class="kartica klijenti-tabela animiraj" style="padding:0;overflow:hidden;">
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;">
<thead>
@@ -102,7 +87,7 @@
</thead>
<tbody>
{{range .Klijenti}}
<tr style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
<tr class="animiraj" style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
onmouseover="this.style.background='var(--pozadina)'"
onmouseout="this.style.background=''">
<td style="padding:12px 16px;">
@@ -157,7 +142,7 @@
<!-- mobilne kartice -->
<div class="klijenti-kartice">
{{range .Klijenti}}
<div class="kartica klijent-kartica">
<div class="kartica klijent-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;">
<div>
{{if .NazivFirme}}
web/templates/stranice/magacin.html
+2 -11
View File
@@ -4,15 +4,6 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.magacin-tabela tbody tr {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.magacin-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.magacin-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.magacin-tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
@@ -72,7 +63,7 @@
</form>
<!-- tabela artikala -->
<div class="kartica" style="padding:0;overflow:hidden;">
<div class="kartica animiraj" style="padding:0;overflow:hidden;">
<div style="overflow-x:auto;">
<table class="magacin-tabela" style="width:100%;border-collapse:collapse;">
<thead>
@@ -87,7 +78,7 @@
</thead>
<tbody>
{{range .Artikli}}
<tr style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
<tr class="animiraj" style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
onmouseover="this.style.background='var(--pozadina)'"
onmouseout="this.style.background=''">
<td style="padding:12px 16px;font-size:14px;color:var(--tekst-glavni);">{{.Naziv}}</td>
web/templates/stranice/magacin_forma.html
+1 -1
View File
@@ -11,7 +11,7 @@
Nazad na magacin
</a>
<div class="kartica">
<div class="kartica animiraj">
<div style="margin-bottom:20px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">
{{if .Izmena}}Izmeni artikal{{else}}Novi artikal{{end}}
web/templates/stranice/nabavka_detalji.html
+2 -17
View File
@@ -4,25 +4,10 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
.detalji-kartica {
animation: fadeInUp 0.3s ease forwards;
opacity: 0;
}
.detalji-kartica:nth-child(1) { animation-delay: 0.04s; }
.detalji-kartica:nth-child(2) { animation-delay: 0.12s; }
.detalji-kartica:nth-child(3) { animation-delay: 0.20s; }
.stavke-tabela tbody tr {
animation: fadeInUp 0.2s ease forwards;
opacity: 0;
}
.stavke-tabela tbody tr:nth-child(1) { animation-delay: 0.16s; }
.stavke-tabela tbody tr:nth-child(2) { animation-delay: 0.20s; }
.stavke-tabela tbody tr:nth-child(3) { animation-delay: 0.24s; }
@@ -54,7 +39,7 @@
</a>
<!-- zaglavlje nabavke -->
<div class="kartica detalji-kartica">
<div class="kartica detalji-kartica animiraj">
<div style="margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">Detalji nabavke</span>
<span style="font-size:13px;color:var(--tekst-sporedni);">{{.Nabavka.Datum.Format "02.01.2006. u 15:04"}}</span>
@@ -101,7 +86,7 @@
</thead>
<tbody>
{{range .Stavke}}
<tr style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
<tr class="animiraj" style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
onmouseover="this.style.background='var(--pozadina)'"
onmouseout="this.style.background=''">
<td style="padding:10px 16px;font-size:14px;color:var(--tekst-glavni);">{{.ArtikalNaziv}}</td>
web/templates/stranice/nabavka_forma.html
+2 -20
View File
@@ -4,29 +4,11 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes shake {
0%, 100% { transform: translateX(0); }
20% { transform: translateX(-6px); }
40% { transform: translateX(6px); }
60% { transform: translateX(-4px); }
80% { transform: translateX(4px); }
}
@keyframes modalIn {
from { opacity: 0; transform: translateY(-16px) scale(0.97); }
to { opacity: 1; transform: translateY(0) scale(1); }
}
.forma-kartica {
animation: fadeInUp 0.3s ease forwards;
opacity: 0;
}
.forma-kartica:nth-child(1) { animation-delay: 0.04s; }
.forma-kartica:nth-child(2) { animation-delay: 0.12s; }
@@ -148,7 +130,7 @@
{{end}}
<!-- zaglavlje nabavke -->
<div class="kartica forma-kartica" style="margin-bottom:16px;">
<div class="kartica forma-kartica animiraj" style="margin-bottom:16px;">
<div style="margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">Nova nabavka</span>
</div>
@@ -172,7 +154,7 @@
</div>
<!-- stavke -->
<div class="kartica forma-kartica" style="margin-bottom:16px;">
<div class="kartica forma-kartica animiraj" style="margin-bottom:16px;">
<div style="margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">Stavke</span>
<div style="display:flex;gap:8px;flex-wrap:wrap;">
web/templates/stranice/nabavke.html
+3 -18
View File
@@ -9,20 +9,10 @@
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.poruka-animacija {
animation: slideDown 0.3s ease forwards;
}
.nabavke-tabela tbody tr {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.nabavke-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.nabavke-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.nabavke-tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
@@ -40,11 +30,6 @@
gap: 12px;
}
.nabavka-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.nabavka-kartica:nth-child(1) { animation-delay: 0.04s; }
.nabavka-kartica:nth-child(2) { animation-delay: 0.10s; }
.nabavka-kartica:nth-child(3) { animation-delay: 0.16s; }
@@ -78,7 +63,7 @@
</div>
<!-- desktop tabela -->
<div class="kartica nabavke-tabela" style="padding:0;overflow:hidden;">
<div class="kartica nabavke-tabela animiraj" style="padding:0;overflow:hidden;">
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;">
<thead>
@@ -92,7 +77,7 @@
</thead>
<tbody>
{{range .Nabavke}}
<tr style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
<tr class="animiraj" style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
onmouseover="this.style.background='var(--pozadina)'"
onmouseout="this.style.background=''">
<td style="padding:12px 16px;font-size:13px;color:var(--tekst-sporedni);white-space:nowrap;">
@@ -140,7 +125,7 @@
<!-- mobilne kartice -->
<div class="nabavke-kartice">
{{range .Nabavke}}
<div class="kartica nabavka-kartica">
<div class="kartica nabavka-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;">
<div>
<div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">
web/templates/stranice/podesavanja.html
+13 -4
View File
@@ -2,6 +2,15 @@
{{define "naslov"}}Podešavanja — NTech{{end}}
{{define "dodatni-css"}}
<style>
.animiraj:nth-child(1) { animation-delay: 0.10s; }
.animiraj:nth-child(2) { animation-delay: 0.16s; }
.animiraj:nth-child(3) { animation-delay: 0.22s; }
.animiraj:nth-child(4) { animation-delay: 0.28s; }
</style>
{{end}}
{{define "sadrzaj"}}
<div style="width:100%;max-width:100%;">
@@ -13,7 +22,7 @@
<!-- upload loga — posebna forma jer je multipart, mora biti van glavne forme -->
<form method="POST" action="/podesavanja/logo" enctype="multipart/form-data">
<div class="kartica" style="margin-bottom:16px;">
<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);">Logo firme</span>
@@ -45,7 +54,7 @@
<form method="POST" action="/podesavanja/sacuvaj">
<!-- sekcija: firma -->
<div class="kartica" style="margin-bottom:16px;">
<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"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Firma</span>
@@ -110,7 +119,7 @@
</div>
<!-- sekcija: izgled -->
<div class="kartica" style="margin-bottom:16px;">
<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"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/></svg>
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Izgled</span>
@@ -134,7 +143,7 @@
</div>
<!-- sekcija: sistem -->
<div class="kartica" style="margin-bottom:16px;">
<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"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06-.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Sistem</span>
web/templates/stranice/podsetnici.html
+3 -18
View File
@@ -9,20 +9,10 @@
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.poruka-animacija {
animation: slideDown 0.3s ease forwards;
}
.pod-tabela tbody tr {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.pod-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.pod-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.pod-tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
@@ -40,11 +30,6 @@
gap: 12px;
}
.pod-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.pod-kartica:nth-child(1) { animation-delay: 0.04s; }
.pod-kartica:nth-child(2) { animation-delay: 0.10s; }
.pod-kartica:nth-child(3) { animation-delay: 0.16s; }
@@ -90,7 +75,7 @@
</div>
<!-- desktop tabela -->
<div class="kartica pod-tabela" style="padding:0;overflow:hidden;">
<div class="kartica pod-tabela animiraj" style="padding:0;overflow:hidden;">
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;">
<thead>
@@ -103,7 +88,7 @@
</thead>
<tbody>
{{range .Podsetnici}}
<tr class="{{if .JePrekoracen}}red-prekoracen{{end}}"
<tr class="animiraj {{if .JePrekoracen}}red-prekoracen{{end}}"
style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
onmouseover="this.style.background='var(--pozadina)'"
onmouseout="this.style.background=''">
@@ -165,7 +150,7 @@
<!-- mobilne kartice -->
<div class="pod-kartice">
{{range .Podsetnici}}
<div class="kartica pod-kartica">
<div class="kartica pod-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;">
<div>
<div style="font-size:15px;font-weight:500;color:{{if .JePrekoracen}}var(--greska){{else}}var(--tekst-glavni){{end}};">{{.Naslov}}</div>
web/templates/stranice/podsetnik_forma.html
+1 -18
View File
@@ -4,23 +4,6 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes shake {
0%, 100% { transform: translateX(0); }
20% { transform: translateX(-6px); }
40% { transform: translateX(6px); }
60% { transform: translateX(-4px); }
80% { transform: translateX(4px); }
}
.forma-kartica {
animation: fadeInUp 0.3s ease forwards;
}
.greska-animacija {
animation: shake 0.4s ease;
}
@@ -37,7 +20,7 @@
Nazad na podsetnik
</a>
<div class="kartica forma-kartica" style="max-width:600px;">
<div class="kartica forma-kartica animiraj" style="max-width:600px;">
<div style="margin-bottom:20px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">
{{if .Izmena}}Izmeni podsetnik{{else}}Novi podsetnik{{end}}
web/templates/stranice/prijava.html
+1 -1
View File
@@ -98,7 +98,7 @@
</style>
</head>
<body>
<div class="kartica">
<div class="kartica animiraj">
<div class="logo">
<div class="logo-naziv">NTech</div>
<div class="logo-podnazlov">Sistem za upravljanje</div>
web/templates/stranice/prodaja.html
+3 -18
View File
@@ -9,18 +9,8 @@
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.poruka-animacija { animation: slideDown 0.3s ease forwards; }
.prodaja-tabela tbody tr {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.prodaja-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.prodaja-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.prodaja-tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
@@ -38,11 +28,6 @@
gap: 12px;
}
.prodaja-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.prodaja-kartica:nth-child(1) { animation-delay: 0.04s; }
.prodaja-kartica:nth-child(2) { animation-delay: 0.10s; }
.prodaja-kartica:nth-child(3) { animation-delay: 0.16s; }
@@ -93,7 +78,7 @@
</div>
<!-- desktop tabela -->
<div class="kartica prodaja-tabela" style="padding:0;overflow:hidden;">
<div class="kartica prodaja-tabela animiraj" style="padding:0;overflow:hidden;">
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;">
<thead>
@@ -107,7 +92,7 @@
</thead>
<tbody>
{{range .Nalozi}}
<tr style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
<tr class="animiraj" style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
onmouseover="this.style.background='var(--pozadina)'"
onmouseout="this.style.background=''">
<td style="padding:12px 16px;font-size:13px;font-family:monospace;color:var(--tekst-glavni);">
@@ -149,7 +134,7 @@
<!-- mobilne kartice -->
<div class="prodaja-kartice">
{{range .Nalozi}}
<div class="kartica prodaja-kartica">
<div class="kartica prodaja-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;">
<div>
<div style="font-size:13px;font-family:monospace;color:var(--tekst-glavni);">{{.BrojNaloga}}</div>
web/templates/stranice/prodaja_detalji.html
+3 -14
View File
@@ -4,17 +4,6 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes slideDown {
from { opacity: 0; transform: translateY(-10px); }
to { opacity: 1; transform: translateY(0); }
}
.detalji-kartica { animation: fadeInUp 0.3s ease forwards; opacity: 0; }
.detalji-kartica:nth-child(1) { animation-delay: 0.04s; }
.detalji-kartica:nth-child(2) { animation-delay: 0.12s; }
.detalji-kartica:nth-child(3) { animation-delay: 0.20s; }
@@ -39,7 +28,7 @@
</a>
<!-- zaglavlje naloga -->
<div class="kartica detalji-kartica">
<div class="kartica detalji-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:20px;font-weight:600;color:var(--tekst-glavni);font-family:monospace;">
{{.Nalog.BrojNaloga}}
@@ -76,7 +65,7 @@
</div>
<!-- stavke -->
<div class="kartica detalji-kartica" style="padding:0;overflow:hidden;">
<div class="kartica detalji-kartica animiraj" style="padding:0;overflow:hidden;">
<div style="padding:16px 20px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Stavke</span>
</div>
@@ -111,7 +100,7 @@
</div>
<!-- zona za brisanje -->
<div class="kartica detalji-kartica" style="border-color:#dc262633;">
<div class="kartica detalji-kartica animiraj" style="border-color:#dc262633;">
<div style="display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;">
<div style="flex:1;min-width:200px;">
<div style="font-size:14px;font-weight:500;color:#dc2626;margin-bottom:4px;">Brisanje naloga</div>
web/templates/stranice/prodaja_forma.html
+2 -16
View File
@@ -4,20 +4,6 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes shake {
0%, 100% { transform: translateX(0); }
20% { transform: translateX(-6px); }
40% { transform: translateX(6px); }
60% { transform: translateX(-4px); }
80% { transform: translateX(4px); }
}
.forma-kartica { animation: fadeInUp 0.3s ease forwards; opacity: 0; }
.forma-kartica:nth-child(1) { animation-delay: 0.04s; }
.forma-kartica:nth-child(2) { animation-delay: 0.12s; }
@@ -99,7 +85,7 @@
{{end}}
<!-- zaglavlje prodaje -->
<div class="kartica forma-kartica" style="margin-bottom:16px;">
<div class="kartica forma-kartica animiraj" style="margin-bottom:16px;">
<div style="margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">Nova prodaja</span>
</div>
@@ -125,7 +111,7 @@
</div>
<!-- stavke -->
<div class="kartica forma-kartica" style="margin-bottom:16px;">
<div class="kartica forma-kartica animiraj" style="margin-bottom:16px;">
<div style="margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">Stavke</span>
<button type="button" @click="dodajStavku()"
web/templates/stranice/servis.html
+3 -18
View File
@@ -9,18 +9,8 @@
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
.poruka-animacija { animation: slideDown 0.3s ease forwards; }
.servis-tabela tbody tr {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.servis-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.servis-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.servis-tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
@@ -38,11 +28,6 @@
gap: 12px;
}
.servis-kartica {
animation: fadeInUp 0.25s ease forwards;
opacity: 0;
}
.servis-kartica:nth-child(1) { animation-delay: 0.04s; }
.servis-kartica:nth-child(2) { animation-delay: 0.10s; }
.servis-kartica:nth-child(3) { animation-delay: 0.16s; }
@@ -119,7 +104,7 @@
</div>
<!-- desktop tabela -->
<div class="kartica servis-tabela" style="padding:0;overflow:hidden;">
<div class="kartica servis-tabela animiraj" style="padding:0;overflow:hidden;">
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;">
<thead>
@@ -134,7 +119,7 @@
</thead>
<tbody>
{{range .Nalozi}}
<tr style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
<tr class="animiraj" style="border-bottom:0.5px solid var(--ivica);transition:background 0.15s;"
onmouseover="this.style.background='var(--pozadina)'"
onmouseout="this.style.background=''">
<td style="padding:12px 16px;">
@@ -188,7 +173,7 @@
<!-- mobilne kartice -->
<div class="servis-kartice">
{{range .Nalozi}}
<div class="kartica servis-kartica">
<div class="kartica servis-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;">
<div>
<a href="/servis/{{.ID}}"
web/templates/stranice/servis_detalji.html
+5 -20
View File
@@ -4,21 +4,6 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes slideDown {
from { opacity: 0; transform: translateY(-10px); }
to { opacity: 1; transform: translateY(0); }
}
.detalji-kartica {
animation: fadeInUp 0.3s ease forwards;
opacity: 0;
}
.detalji-kartica:nth-child(1) { animation-delay: 0.04s; }
.detalji-kartica:nth-child(2) { animation-delay: 0.12s; }
.detalji-kartica:nth-child(3) { animation-delay: 0.20s; }
@@ -72,7 +57,7 @@
</a>
<!-- zaglavlje naloga -->
<div class="kartica detalji-kartica">
<div class="kartica detalji-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:12px;margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<div style="display:flex;flex-direction:column;gap:8px;">
<span style="font-size:20px;font-weight:600;color:var(--tekst-glavni);font-family:monospace;">
@@ -107,7 +92,7 @@
</div>
<!-- podaci o uređaju -->
<div class="kartica detalji-kartica">
<div class="kartica detalji-kartica animiraj">
<div style="margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Uređaj</span>
</div>
@@ -138,7 +123,7 @@
</div>
<!-- cene -->
<div class="kartica detalji-kartica">
<div class="kartica detalji-kartica animiraj">
<div style="margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);">
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Cene</span>
</div>
@@ -171,7 +156,7 @@
</div>
<!-- placeholder za buduće funkcije -->
<div class="kartica detalji-kartica" style="border-style:dashed;">
<div class="kartica detalji-kartica animiraj" style="border-style:dashed;">
<div style="display:flex;align-items:center;gap:10px;color:var(--tekst-sporedni);">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>
<span style="font-size:13px;">Istorija promena statusa i vezani artikli biće dostupni u narednoj verziji.</span>
@@ -179,7 +164,7 @@
</div>
<!-- zona za brisanje -->
<div class="kartica detalji-kartica" style="border-color:#dc262633;">
<div class="kartica detalji-kartica animiraj" style="border-color:#dc262633;">
<div style="display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;">
<div style="flex:1;min-width:200px;">
<div style="font-size:14px;font-weight:500;color:#dc2626;margin-bottom:4px;">Brisanje naloga</div>
web/templates/stranice/servis_forma.html
+1 -15
View File
@@ -4,20 +4,6 @@
{{define "dodatni-css"}}
<style>
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes shake {
0%, 100% { transform: translateX(0); }
20% { transform: translateX(-6px); }
40% { transform: translateX(6px); }
60% { transform: translateX(-4px); }
80% { transform: translateX(4px); }
}
.forma-kartica { animation: fadeInUp 0.3s ease forwards; }
.greska-animacija { animation: shake 0.4s ease; }
.sekcija-naslov {
@@ -47,7 +33,7 @@
Nazad na servis
</a>
<div class="kartica forma-kartica">
<div class="kartica forma-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);flex-wrap:wrap;gap:10px;">
<span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">
{{if .Izmena}}Izmeni nalog{{else}}Novi nalog{{end}}
web/templates/stranice/setup.html
+1 -1
View File
@@ -73,7 +73,7 @@
</style>
</head>
<body>
<div class="kartica">
<div class="kartica animiraj">
<div class="logo">
<div class="logo-naziv">NTech</div>
<div class="logo-podnazlov">Prvo pokretanje</div>
web/templates/stranice/totp_provera.html
+1 -1
View File
@@ -78,7 +78,7 @@
</style>
</head>
<body>
<div class="kartica">
<div class="kartica animiraj">
<div class="logo">
<div class="logo-naziv">NTech</div>
</div>