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

Merge grane feature/stagger-tabele: stagger redova tabela u main.css

Browse Source
This commit is contained in:
Dalibor Marković
2026-06-13 01:26:09 +02:00
parent 87bc36ee31 ff5f282981
commit 40975904f6
11 changed files with 16 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/static/css/main.css
+16
View File
@@ -978,6 +978,22 @@ select {
animation: fadeInUp 0.2s ease both; animation: fadeInUp 0.2s ease both;
} }
/* Stepenasta (stagger) animacija redova u svim listama — JEDNO mesto za sve tabele.
Pogađa samo redove koji se animiraju (<tr class="animiraj">); ostali ostaju bez
delay-a. Mora biti u main.css: HTMX navigacija (hx-select) odbacuje <head>, pa
stilovi iz page <style> blokova ne bi važili tokom navigacije.
Da promeniš animaciju redova svuda — menjaš samo ovde. */
.tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
.tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.tabela tbody tr:nth-child(5) { animation-delay: 0.20s; }
.tabela tbody tr:nth-child(6) { animation-delay: 0.24s; }
.tabela tbody tr:nth-child(7) { animation-delay: 0.28s; }
.tabela tbody tr:nth-child(8) { animation-delay: 0.32s; }
.tabela tbody tr:nth-child(9) { animation-delay: 0.36s; }
.tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
/* responsive prikaz — tabela/kartice za sve liste (mora biti u main.css jer HTMX ne učitava head ponovo) */ /* 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; } .nabavke-kartice { display: none; flex-direction: column; gap: 12px; }
.dobavljaci-kartice { display: none; flex-direction: column; gap: 12px; } .dobavljaci-kartice { display: none; flex-direction: column; gap: 12px; }
web/templates/stranice/admin_dozvole.html
-5
View File
@@ -4,11 +4,6 @@
{{define "dodatni-css"}} {{define "dodatni-css"}}
<style> <style>
.dozvole-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.dozvole-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.dozvole-tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
.dozvole-tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.dozvole-tabela tbody tr:nth-child(5) { animation-delay: 0.20s; }
/* zaglavlja modula — providna staklena traka sa akcentnom levom ivicom. /* zaglavlja modula — providna staklena traka sa akcentnom levom ivicom.
Bez sopstvenog backdrop-filter-a: kartica već zamućuje pozadinu, pa traka Bez sopstvenog backdrop-filter-a: kartica već zamućuje pozadinu, pa traka
web/templates/stranice/admin_korisnici.html
-10
View File
@@ -5,16 +5,6 @@
{{define "dodatni-css"}} {{define "dodatni-css"}}
<style> <style>
.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; }
.korisnici-tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.korisnici-tabela tbody tr:nth-child(5) { animation-delay: 0.20s; }
.korisnici-tabela tbody tr:nth-child(6) { animation-delay: 0.24s; }
.korisnici-tabela tbody tr:nth-child(7) { animation-delay: 0.28s; }
.korisnici-tabela tbody tr:nth-child(8) { animation-delay: 0.32s; }
.korisnici-tabela tbody tr:nth-child(9) { animation-delay: 0.36s; }
.korisnici-tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
.nova-forma-kartica { animation-delay: 0.30s; } .nova-forma-kartica { animation-delay: 0.30s; }
</style> </style>
web/templates/stranice/dobavljaci.html
-10
View File
@@ -4,16 +4,6 @@
{{define "dodatni-css"}} {{define "dodatni-css"}}
<style> <style>
.dobavljaci-tabela tbody tr:nth-child(1) { animation-delay: 0.04s; }
.dobavljaci-tabela tbody tr:nth-child(2) { animation-delay: 0.08s; }
.dobavljaci-tabela tbody tr:nth-child(3) { animation-delay: 0.12s; }
.dobavljaci-tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.dobavljaci-tabela tbody tr:nth-child(5) { animation-delay: 0.20s; }
.dobavljaci-tabela tbody tr:nth-child(6) { animation-delay: 0.24s; }
.dobavljaci-tabela tbody tr:nth-child(7) { animation-delay: 0.28s; }
.dobavljaci-tabela tbody tr:nth-child(8) { animation-delay: 0.32s; }
.dobavljaci-tabela tbody tr:nth-child(9) { animation-delay: 0.36s; }
.dobavljaci-tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
.dobavljac-kartica:nth-child(1) { animation-delay: 0.04s; } .dobavljac-kartica:nth-child(1) { animation-delay: 0.04s; }
.dobavljac-kartica:nth-child(2) { animation-delay: 0.10s; } .dobavljac-kartica:nth-child(2) { animation-delay: 0.10s; }
.dobavljac-kartica:nth-child(3) { animation-delay: 0.16s; } .dobavljac-kartica:nth-child(3) { animation-delay: 0.16s; }
web/templates/stranice/klijenti.html
-10
View File
@@ -4,16 +4,6 @@
{{define "dodatni-css"}} {{define "dodatni-css"}}
<style> <style>
.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; }
.klijenti-tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.klijenti-tabela tbody tr:nth-child(5) { animation-delay: 0.20s; }
.klijenti-tabela tbody tr:nth-child(6) { animation-delay: 0.24s; }
.klijenti-tabela tbody tr:nth-child(7) { animation-delay: 0.28s; }
.klijenti-tabela tbody tr:nth-child(8) { animation-delay: 0.32s; }
.klijenti-tabela tbody tr:nth-child(9) { animation-delay: 0.36s; }
.klijenti-tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
.klijent-kartica:nth-child(1) { animation-delay: 0.04s; } .klijent-kartica:nth-child(1) { animation-delay: 0.04s; }
.klijent-kartica:nth-child(2) { animation-delay: 0.10s; } .klijent-kartica:nth-child(2) { animation-delay: 0.10s; }
.klijent-kartica:nth-child(3) { animation-delay: 0.16s; } .klijent-kartica:nth-child(3) { animation-delay: 0.16s; }
web/templates/stranice/magacin.html
-10
View File
@@ -4,16 +4,6 @@
{{define "dodatni-css"}} {{define "dodatni-css"}}
<style> <style>
.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; }
.magacin-tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.magacin-tabela tbody tr:nth-child(5) { animation-delay: 0.20s; }
.magacin-tabela tbody tr:nth-child(6) { animation-delay: 0.24s; }
.magacin-tabela tbody tr:nth-child(7) { animation-delay: 0.28s; }
.magacin-tabela tbody tr:nth-child(8) { animation-delay: 0.32s; }
.magacin-tabela tbody tr:nth-child(9) { animation-delay: 0.36s; }
.magacin-tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
.magacin-kartica:nth-child(1) { animation-delay: 0.04s; } .magacin-kartica:nth-child(1) { animation-delay: 0.04s; }
.magacin-kartica:nth-child(2) { animation-delay: 0.10s; } .magacin-kartica:nth-child(2) { animation-delay: 0.10s; }
.magacin-kartica:nth-child(3) { animation-delay: 0.16s; } .magacin-kartica:nth-child(3) { animation-delay: 0.16s; }
web/templates/stranice/nabavka_detalji.html
-5
View File
@@ -7,11 +7,6 @@
.detalji-kartica:nth-child(1) { animation-delay: 0.04s; } .detalji-kartica:nth-child(1) { animation-delay: 0.04s; }
.detalji-kartica:nth-child(2) { animation-delay: 0.12s; } .detalji-kartica:nth-child(2) { animation-delay: 0.12s; }
.detalji-kartica:nth-child(3) { animation-delay: 0.20s; } .detalji-kartica:nth-child(3) { animation-delay: 0.20s; }
.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; }
.stavke-tabela tbody tr:nth-child(4) { animation-delay: 0.28s; }
.stavke-tabela tbody tr:nth-child(5) { animation-delay: 0.32s; }
</style> </style>
{{end}} {{end}}
web/templates/stranice/nabavke.html
-10
View File
@@ -4,16 +4,6 @@
{{define "dodatni-css"}} {{define "dodatni-css"}}
<style> <style>
.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; }
.nabavke-tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.nabavke-tabela tbody tr:nth-child(5) { animation-delay: 0.20s; }
.nabavke-tabela tbody tr:nth-child(6) { animation-delay: 0.24s; }
.nabavke-tabela tbody tr:nth-child(7) { animation-delay: 0.28s; }
.nabavke-tabela tbody tr:nth-child(8) { animation-delay: 0.32s; }
.nabavke-tabela tbody tr:nth-child(9) { animation-delay: 0.36s; }
.nabavke-tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
.nabavka-kartica:nth-child(1) { animation-delay: 0.04s; } .nabavka-kartica:nth-child(1) { animation-delay: 0.04s; }
.nabavka-kartica:nth-child(2) { animation-delay: 0.10s; } .nabavka-kartica:nth-child(2) { animation-delay: 0.10s; }
.nabavka-kartica:nth-child(3) { animation-delay: 0.16s; } .nabavka-kartica:nth-child(3) { animation-delay: 0.16s; }
web/templates/stranice/podsetnici.html
-10
View File
@@ -5,16 +5,6 @@
{{define "dodatni-css"}} {{define "dodatni-css"}}
<style> <style>
.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; }
.pod-tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.pod-tabela tbody tr:nth-child(5) { animation-delay: 0.20s; }
.pod-tabela tbody tr:nth-child(6) { animation-delay: 0.24s; }
.pod-tabela tbody tr:nth-child(7) { animation-delay: 0.28s; }
.pod-tabela tbody tr:nth-child(8) { animation-delay: 0.32s; }
.pod-tabela tbody tr:nth-child(9) { animation-delay: 0.36s; }
.pod-tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
.pod-kartica:nth-child(1) { animation-delay: 0.04s; } .pod-kartica:nth-child(1) { animation-delay: 0.04s; }
.pod-kartica:nth-child(2) { animation-delay: 0.10s; } .pod-kartica:nth-child(2) { animation-delay: 0.10s; }
web/templates/stranice/prodaja.html
-10
View File
@@ -1,15 +1,5 @@
{{template "base" .}} {{define "naslov"}}Prodaja — NTech{{end}} {{define "dodatni-css"}} {{template "base" .}} {{define "naslov"}}Prodaja — NTech{{end}} {{define "dodatni-css"}}
<style> <style>
.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; }
.prodaja-tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.prodaja-tabela tbody tr:nth-child(5) { animation-delay: 0.2s; }
.prodaja-tabela tbody tr:nth-child(6) { animation-delay: 0.24s; }
.prodaja-tabela tbody tr:nth-child(7) { animation-delay: 0.28s; }
.prodaja-tabela tbody tr:nth-child(8) { animation-delay: 0.32s; }
.prodaja-tabela tbody tr:nth-child(9) { animation-delay: 0.36s; }
.prodaja-tabela tbody tr:nth-child(10) { animation-delay: 0.4s; }
.prodaja-kartica:nth-child(1) { animation-delay: 0.04s; } .prodaja-kartica:nth-child(1) { animation-delay: 0.04s; }
.prodaja-kartica:nth-child(2) { animation-delay: 0.1s; } .prodaja-kartica:nth-child(2) { animation-delay: 0.1s; }
.prodaja-kartica:nth-child(3) { animation-delay: 0.16s; } .prodaja-kartica:nth-child(3) { animation-delay: 0.16s; }
web/templates/stranice/servis.html
-10
View File
@@ -5,16 +5,6 @@
{{define "dodatni-css"}} {{define "dodatni-css"}}
<style> <style>
.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; }
.servis-tabela tbody tr:nth-child(4) { animation-delay: 0.16s; }
.servis-tabela tbody tr:nth-child(5) { animation-delay: 0.20s; }
.servis-tabela tbody tr:nth-child(6) { animation-delay: 0.24s; }
.servis-tabela tbody tr:nth-child(7) { animation-delay: 0.28s; }
.servis-tabela tbody tr:nth-child(8) { animation-delay: 0.32s; }
.servis-tabela tbody tr:nth-child(9) { animation-delay: 0.36s; }
.servis-tabela tbody tr:nth-child(10) { animation-delay: 0.40s; }
.servis-kartica:nth-child(1) { animation-delay: 0.04s; } .servis-kartica:nth-child(1) { animation-delay: 0.04s; }
.servis-kartica:nth-child(2) { animation-delay: 0.10s; } .servis-kartica:nth-child(2) { animation-delay: 0.10s; }