From 662964f3c842bc4496af6f577f2b4924e72eed97 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Dalibor=20Markovi=C4=87?= <dalibor31@gmail.com>
Date: Sat, 13 Jun 2026 01:32:44 +0200
Subject: [PATCH] =?UTF-8?q?refactor(css):=20stagger=20mobilnih=20lista-kar?=
 =?UTF-8?q?tica=20na=20jedno=20mesto=20u=20main.css=20Mobilni=20parnjak=20?=
 =?UTF-8?q?prethodnog=20(tabele):=207=20lista-kartica=20klasa=20(prodaja/s?=
 =?UTF-8?q?ervis/magacin/=20pod/klijent/dobavljac/nabavka-kartica)=20imale?=
 =?UTF-8?q?=20su=20identi=C4=8Dan=20:nth-child=20stagger=20(0.06s=20korak?=
 =?UTF-8?q?=20do=205).=20Uvedeno=20jedno=20pravilo=20[class*=3D"-kartice"]?=
 =?UTF-8?q?=20>=20.animiraj:nth-child=20u=20main.css;=20uklonjeni=20per-pa?=
 =?UTF-8?q?ge=20blokovi.=20Drugi=20tipovi=20kartica=20(detalji/forma/=20da?=
 =?UTF-8?q?shboard/izvestaji)=20imaju=20svoj=20stagger=20i=20ostaju=20po?=
 =?UTF-8?q?=20strani.=204=20strane=20(nabavke/klijenti/prodaja/dobavljaci)?=
 =?UTF-8?q?=20ostale=20prazan=20dodatni-css=20blok=20=E2=86=92=20uklonjen.?=
 =?UTF-8?q?=20Bez=20HTML=20izmena=20u=20sadr=C5=BEaju;=20radi=20i=20pod=20?=
 =?UTF-8?q?HTMX-om.=20Animacija=20lista-kartica=20se=20sada=20menja=20na?=
 =?UTF-8?q?=20JEDNOM=20mestu.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/static/css/main.css                |  9 +++++++++
 web/templates/stranice/dobavljaci.html | 10 ----------
 web/templates/stranice/klijenti.html   | 10 ----------
 web/templates/stranice/magacin.html    |  5 -----
 web/templates/stranice/nabavke.html    | 10 ----------
 web/templates/stranice/podsetnici.html |  5 -----
 web/templates/stranice/prodaja.html    | 10 +---------
 web/templates/stranice/servis.html     |  5 -----
 8 files changed, 10 insertions(+), 54 deletions(-)

diff --git a/web/static/css/main.css b/web/static/css/main.css
index da4f860..57a3b37 100644
--- a/web/static/css/main.css
+++ b/web/static/css/main.css
@@ -994,6 +994,15 @@ select {
 .tabela tbody tr:nth-child(9)  { animation-delay: 0.36s; }
 .tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
 
+/* Stagger mobilnih lista-kartica (parnjak gornjeg za tabele). Pogađa kartice
+   unutar bilo kog .X-kartice kontejnera; ostali tipovi kartica (detalji/forma/
+   dashboard) imaju svoj stagger po strani. Menjaš na JEDNOM mestu. */
+[class*="-kartice"] > .animiraj:nth-child(1) { animation-delay: 0.04s; }
+[class*="-kartice"] > .animiraj:nth-child(2) { animation-delay: 0.10s; }
+[class*="-kartice"] > .animiraj:nth-child(3) { animation-delay: 0.16s; }
+[class*="-kartice"] > .animiraj:nth-child(4) { animation-delay: 0.22s; }
+[class*="-kartice"] > .animiraj:nth-child(5) { animation-delay: 0.28s; }
+
 /* responsive prikaz — tabela/kartice za sve liste (mora biti u main.css jer HTMX ne učitava head ponovo) */
 .nabavke-kartice  { display: none; flex-direction: column; gap: 12px; }
 .dobavljaci-kartice { display: none; flex-direction: column; gap: 12px; }
diff --git a/web/templates/stranice/dobavljaci.html b/web/templates/stranice/dobavljaci.html
index a08f450..bf7e03f 100644
--- a/web/templates/stranice/dobavljaci.html
+++ b/web/templates/stranice/dobavljaci.html
@@ -2,16 +2,6 @@
 
 {{define "naslov"}}Dobavljači — NTech{{end}}
 
-{{define "dodatni-css"}}
-<style>
-  .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; }
-  .dobavljac-kartica:nth-child(4) { animation-delay: 0.22s; }
-  .dobavljac-kartica:nth-child(5) { animation-delay: 0.28s; }
-</style>
-{{end}}
-
 {{define "sadrzaj"}}
 <div class="kolona" style="gap:16px;">
 
diff --git a/web/templates/stranice/klijenti.html b/web/templates/stranice/klijenti.html
index eb812ec..b673268 100644
--- a/web/templates/stranice/klijenti.html
+++ b/web/templates/stranice/klijenti.html
@@ -2,16 +2,6 @@
 
 {{define "naslov"}}Klijenti — NTech{{end}}
 
-{{define "dodatni-css"}}
-<style>
-    .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; }
-    .klijent-kartica:nth-child(4) { animation-delay: 0.22s; }
-    .klijent-kartica:nth-child(5) { animation-delay: 0.28s; }
-</style>
-{{end}}
-
 {{define "sadrzaj"}}
 <div class="kolona" style="gap:16px;">
 
diff --git a/web/templates/stranice/magacin.html b/web/templates/stranice/magacin.html
index c52798e..777dd3f 100644
--- a/web/templates/stranice/magacin.html
+++ b/web/templates/stranice/magacin.html
@@ -4,11 +4,6 @@
 
 {{define "dodatni-css"}}
 <style>
-    .magacin-kartica:nth-child(1) { animation-delay: 0.04s; }
-    .magacin-kartica:nth-child(2) { animation-delay: 0.10s; }
-    .magacin-kartica:nth-child(3) { animation-delay: 0.16s; }
-    .magacin-kartica:nth-child(4) { animation-delay: 0.22s; }
-    .magacin-kartica:nth-child(5) { animation-delay: 0.28s; }
 
     /* CSS modala „premesti" je u main.css — mora preživeti HTMX swap (header se ne menja) */
 </style>
diff --git a/web/templates/stranice/nabavke.html b/web/templates/stranice/nabavke.html
index e3c5712..842bad1 100644
--- a/web/templates/stranice/nabavke.html
+++ b/web/templates/stranice/nabavke.html
@@ -2,16 +2,6 @@
 
 {{define "naslov"}}Nabavke — NTech{{end}}
 
-{{define "dodatni-css"}}
-<style>
-    .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; }
-    .nabavka-kartica:nth-child(4) { animation-delay: 0.22s; }
-    .nabavka-kartica:nth-child(5) { animation-delay: 0.28s; }
-</style>
-{{end}}
-
 {{define "sadrzaj"}}
 <div class="kolona" style="gap:16px;">
 
diff --git a/web/templates/stranice/podsetnici.html b/web/templates/stranice/podsetnici.html
index 3493865..2972874 100644
--- a/web/templates/stranice/podsetnici.html
+++ b/web/templates/stranice/podsetnici.html
@@ -6,11 +6,6 @@
 <style>
 
 
-    .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; }
-    .pod-kartica:nth-child(4) { animation-delay: 0.22s; }
-    .pod-kartica:nth-child(5) { animation-delay: 0.28s; }
     .red-prekoracen td { background: rgba(207, 87, 87, 0.06); }
 </style>
 {{end}}
diff --git a/web/templates/stranice/prodaja.html b/web/templates/stranice/prodaja.html
index 1ab79d5..a9dfa3d 100644
--- a/web/templates/stranice/prodaja.html
+++ b/web/templates/stranice/prodaja.html
@@ -1,12 +1,4 @@
-{{template "base" .}} {{define "naslov"}}Prodaja — NTech{{end}} {{define "dodatni-css"}}
-<style>
-  .prodaja-kartica:nth-child(1) { animation-delay: 0.04s; }
-  .prodaja-kartica:nth-child(2) { animation-delay: 0.1s; }
-  .prodaja-kartica:nth-child(3) { animation-delay: 0.16s; }
-  .prodaja-kartica:nth-child(4) { animation-delay: 0.22s; }
-  .prodaja-kartica:nth-child(5) { animation-delay: 0.28s; }
-</style>
-{{end}} {{define "sadrzaj"}}
+{{template "base" .}} {{define "naslov"}}Prodaja — NTech{{end}} {{define "sadrzaj"}}
 <div style="display: flex; flex-direction: column; gap: 16px">
     {{if .Sacuvano}}
     <div class="poruka-uspeh poruka-animacija">Prodaja je uspešno sačuvana.</div>
diff --git a/web/templates/stranice/servis.html b/web/templates/stranice/servis.html
index 204b804..cb93ef0 100644
--- a/web/templates/stranice/servis.html
+++ b/web/templates/stranice/servis.html
@@ -6,11 +6,6 @@
 <style>
 
 
-    .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; }
-    .servis-kartica:nth-child(4) { animation-delay: 0.22s; }
-    .servis-kartica:nth-child(5) { animation-delay: 0.28s; }
     .status-badge { display: inline-block; padding: 3px 10px; border-radius: 20px; font-size: 12px; font-weight: 500; white-space: nowrap; }
 
     .status-primljeno    { background: rgba(148,163,184,0.15); color: #94a3b8; }