refactor(css): layout utili .kolona i .red-izmedju

Nove utility klase: .kolona (display:flex;flex-direction:column) i .red-izmedju
(display:flex;justify-content:space-between) — struktura bez razmaka. Izdvojena
strukturna flex deklaracija iz 50 elemenata (32 kolona + 18 red-izmedju); gap/
margin ostaju kao kontekstualni override po instanci.

Visoko varirani page-header redovi (sa border-bottom/flex-wrap) ostavljeni —
jednokratni. Bez promene izgleda; šabloni parsiraju.
This commit is contained in:
2026-06-13 00:57:07 +02:00
parent a33b426599
commit 261dc52b32
24 changed files with 60 additions and 50 deletions
+10
View File
@@ -737,6 +737,16 @@ select {
gap: 18px; gap: 18px;
} }
/* layout utili — struktura bez razmaka; gap/margin se daju po instanci */
.kolona {
display: flex;
flex-direction: column;
}
.red-izmedju {
display: flex;
justify-content: space-between;
}
/* grid raspored polja — osnovne (desktop) vrednosti; /* grid raspored polja — osnovne (desktop) vrednosti;
responsivni override na uže ekrane je niže u media bloku */ responsivni override na uže ekrane je niže u media bloku */
.forma-grid-2 { .forma-grid-2 {
+1 -1
View File
@@ -34,7 +34,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:20px;"> <div class="kolona" style="gap:20px;">
<!-- matrica dozvola — editabilna forma --> <!-- matrica dozvola — editabilna forma -->
<div class="kartica animiraj" style="padding:0;overflow:hidden;"> <div class="kartica animiraj" style="padding:0;overflow:hidden;">
+1 -1
View File
@@ -22,7 +22,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
<!-- lista korisnika --> <!-- lista korisnika -->
<div class="kartica animiraj" style="padding:0;overflow:hidden;"> <div class="kartica animiraj" style="padding:0;overflow:hidden;">
+1 -1
View File
@@ -29,7 +29,7 @@
{{end}} {{end}}
<form method="POST" action="{{if .Izmena}}/dobavljaci/izmeni/{{.Dobavljac.ID}}{{else}}/dobavljaci/novi{{end}}"> <form method="POST" action="{{if .Izmena}}/dobavljaci/izmeni/{{.Dobavljac.ID}}{{else}}/dobavljaci/novi{{end}}">
<div style="display:flex;flex-direction:column;gap:14px;"> <div class="kolona" style="gap:14px;">
<!-- naziv --> <!-- naziv -->
<div> <div>
+3 -3
View File
@@ -24,7 +24,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
{{if .Sacuvano}} {{if .Sacuvano}}
<div class="poruka-uspeh poruka-animacija">Dobavljač je uspešno sačuvan.</div> <div class="poruka-uspeh poruka-animacija">Dobavljač je uspešno sačuvan.</div>
@@ -104,7 +104,7 @@
<div class="dobavljaci-kartice"> <div class="dobavljaci-kartice">
{{range .Dobavljaci}} {{range .Dobavljaci}}
<div class="kartica dobavljac-kartica animiraj"> <div class="kartica dobavljac-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;"> <div class="red-izmedju" style="align-items:flex-start;gap:12px;margin-bottom:10px;">
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">{{.Naziv}}</span> <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">{{.Naziv}}</span>
<div style="display:flex;gap:8px;flex-shrink:0;"> <div style="display:flex;gap:8px;flex-shrink:0;">
<a href="/dobavljaci/izmeni/{{.ID}}" class="btn-primarno-malo"> <a href="/dobavljaci/izmeni/{{.ID}}" class="btn-primarno-malo">
@@ -120,7 +120,7 @@
{{end}} {{end}}
</div> </div>
</div> </div>
<div style="display:flex;flex-direction:column;gap:6px;"> <div class="kolona" style="gap:6px;">
{{if .KontaktOsoba}} {{if .KontaktOsoba}}
<div class="pomocni-tekst"> <div class="pomocni-tekst">
<span style="color:var(--tekst-glavni);font-weight:500;">Kontakt:</span> {{.KontaktOsoba}} <span style="color:var(--tekst-glavni);font-weight:500;">Kontakt:</span> {{.KontaktOsoba}}
+1 -1
View File
@@ -26,7 +26,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:20px;"> <div class="kolona" style="gap:20px;">
<!-- 1. mesečni prihod --> <!-- 1. mesečni prihod -->
<div class="kartica izv-sekcija animiraj"> <div class="kartica izv-sekcija animiraj">
+2 -2
View File
@@ -18,7 +18,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
{{if .Sacuvano}} {{if .Sacuvano}}
<div class="poruka-uspeh poruka-animacija">Kategorija je uspešno sačuvana.</div> <div class="poruka-uspeh poruka-animacija">Kategorija je uspešno sačuvana.</div>
@@ -40,7 +40,7 @@
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Nova kategorija</span> <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Nova kategorija</span>
</div> </div>
<form method="POST" action="/magacin/kategorije/dodaj"> <form method="POST" action="/magacin/kategorije/dodaj">
<div style="display:flex;flex-direction:column;gap:12px;"> <div class="kolona" style="gap:12px;">
<div> <div>
<label class="polje-labela"> <label class="polje-labela">
Naziv <span style="color:#dc2626;">*</span> Naziv <span style="color:#dc2626;">*</span>
+1 -1
View File
@@ -62,7 +62,7 @@
</div> </div>
<!-- sekcija fizičko lice --> <!-- sekcija fizičko lice -->
<div id="sec-fizicko" style="display:flex;flex-direction:column;gap:12px;"> <div id="sec-fizicko" class="kolona" style="gap:12px;">
<div class="sekcija-naslov">Ime i prezime</div> <div class="sekcija-naslov">Ime i prezime</div>
<div class="forma-grid-2"> <div class="forma-grid-2">
<div> <div>
+3 -3
View File
@@ -24,7 +24,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
{{if .Sacuvano}} {{if .Sacuvano}}
<div class="poruka-uspeh poruka-animacija">Klijent je uspešno sačuvan.</div> <div class="poruka-uspeh poruka-animacija">Klijent je uspešno sačuvan.</div>
@@ -113,7 +113,7 @@
<div class="klijenti-kartice"> <div class="klijenti-kartice">
{{range .Klijenti}} {{range .Klijenti}}
<div class="kartica klijent-kartica animiraj"> <div class="kartica klijent-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;"> <div class="red-izmedju" style="align-items:flex-start;gap:12px;margin-bottom:10px;">
<div> <div>
{{if .NazivFirme}} {{if .NazivFirme}}
<div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">{{.NazivFirme}}</div> <div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">{{.NazivFirme}}</div>
@@ -138,7 +138,7 @@
{{end}} {{end}}
</div> </div>
</div> </div>
<div style="display:flex;flex-direction:column;gap:6px;"> <div class="kolona" style="gap:6px;">
{{if .Telefon}} {{if .Telefon}}
<div class="pomocni-tekst"> <div class="pomocni-tekst">
<span style="color:var(--tekst-glavni);font-weight:500;">Telefon:</span> {{.Telefon}} <span style="color:var(--tekst-glavni);font-weight:500;">Telefon:</span> {{.Telefon}}
+3 -3
View File
@@ -25,7 +25,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
{{if .Sacuvano}} {{if .Sacuvano}}
<div class="poruka-uspeh">Artikal je uspešno sačuvan.</div> <div class="poruka-uspeh">Artikal je uspešno sačuvan.</div>
@@ -48,7 +48,7 @@
</div> </div>
<!-- pretraga i filteri --> <!-- pretraga i filteri -->
<form method="GET" action="/magacin" style="display:flex;flex-direction:column;gap:10px;"> <form method="GET" action="/magacin" class="kolona" style="gap:10px;">
<input type="text" name="pretraga" value="{{.Filter.Pretraga}}" <input type="text" name="pretraga" value="{{.Filter.Pretraga}}"
placeholder="Pretraži artikle..." placeholder="Pretraži artikle..."
style="width:100%;"> style="width:100%;">
@@ -134,7 +134,7 @@
<div class="magacin-kartice"> <div class="magacin-kartice">
{{range .Artikli}} {{range .Artikli}}
<div class="kartica magacin-kartica animiraj"> <div class="kartica magacin-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;"> <div class="red-izmedju" style="align-items:flex-start;gap:12px;margin-bottom:10px;">
<div> <div>
<div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">{{.Naziv}}</div> <div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">{{.Naziv}}</div>
{{if .KategorijaNaziv}} {{if .KategorijaNaziv}}
+1 -1
View File
@@ -29,7 +29,7 @@
{{end}} {{end}}
<form method="POST" action="{{if .Izmena}}/magacin/izmeni/{{.Artikal.ID}}{{else}}/magacin/novi{{end}}"> <form method="POST" action="{{if .Izmena}}/magacin/izmeni/{{.Artikal.ID}}{{else}}/magacin/novi{{end}}">
<div style="display:flex;flex-direction:column;gap:14px;"> <div class="kolona" style="gap:14px;">
<!-- naziv --> <!-- naziv -->
<div> <div>
+1 -1
View File
@@ -16,7 +16,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
<!-- nazad dugme --> <!-- nazad dugme -->
<a href="/nabavke" class="nazad-link"> <a href="/nabavke" class="nazad-link">
+3 -3
View File
@@ -36,7 +36,7 @@
<div style="margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);"> <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> <span style="font-size:16px;font-weight:500;color:var(--tekst-glavni);">Nova nabavka</span>
</div> </div>
<div style="display:flex;flex-direction:column;gap:14px;"> <div class="kolona" style="gap:14px;">
<div> <div>
<label class="polje-labela">Dobavljač</label> <label class="polje-labela">Dobavljač</label>
<select name="dobavljac_id" style="width:100%;"> <select name="dobavljac_id" style="width:100%;">
@@ -142,7 +142,7 @@
Ukloni Ukloni
</button> </button>
</div> </div>
<div style="display:flex;flex-direction:column;gap:10px;"> <div class="kolona" style="gap:10px;">
<div> <div>
<label style="font-size:12px;color:var(--tekst-sporedni);display:block;margin-bottom:4px;">Artikal</label> <label style="font-size:12px;color:var(--tekst-sporedni);display:block;margin-bottom:4px;">Artikal</label>
<select :name="'artikal_id[]'" x-model="stavka.artikal_id" <select :name="'artikal_id[]'" x-model="stavka.artikal_id"
@@ -201,7 +201,7 @@
<div x-show="modalGreska" class="poruka-greska greska-animacija" x-text="modalGreska"></div> <div x-show="modalGreska" class="poruka-greska greska-animacija" x-text="modalGreska"></div>
<div style="display:flex;flex-direction:column;gap:14px;"> <div class="kolona" style="gap:14px;">
<div> <div>
<label class="polje-labela"> <label class="polje-labela">
Naziv <span style="color:#dc2626;">*</span> Naziv <span style="color:#dc2626;">*</span>
+2 -2
View File
@@ -24,7 +24,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
{{if .Sacuvano}} {{if .Sacuvano}}
<div class="poruka-uspeh poruka-animacija">Nabavka je uspešno sačuvana.</div> <div class="poruka-uspeh poruka-animacija">Nabavka je uspešno sačuvana.</div>
@@ -98,7 +98,7 @@
<div class="nabavke-kartice"> <div class="nabavke-kartice">
{{range .Nabavke}} {{range .Nabavke}}
<div class="kartica nabavka-kartica animiraj"> <div class="kartica nabavka-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;"> <div class="red-izmedju" style="align-items:flex-start;gap:12px;margin-bottom:10px;">
<div> <div>
<div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);"> <div style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">
{{if .DobavljacNaziv}}{{.DobavljacNaziv}}{{else}}Bez dobavljača{{end}} {{if .DobavljacNaziv}}{{.DobavljacNaziv}}{{else}}Bez dobavljača{{end}}
+5 -5
View File
@@ -73,7 +73,7 @@
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Firma</span> <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Firma</span>
</div> </div>
<div style="display:flex;flex-direction:column;gap:14px;"> <div class="kolona" style="gap:14px;">
<div> <div>
<label class="polje-labela">Naziv firme</label> <label class="polje-labela">Naziv firme</label>
<input type="text" name="naziv_firme" value="{{.NazivFirme}}" <input type="text" name="naziv_firme" value="{{.NazivFirme}}"
@@ -210,7 +210,7 @@
<!-- slider: zamućenje pozadine --> <!-- slider: zamućenje pozadine -->
<div style="margin-top:16px;"> <div style="margin-top:16px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zamućenje pozadine</span> <span class="pomocni-tekst">Zamućenje pozadine</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurPozadine + 'px'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurPozadine + 'px'"></span>
</div> </div>
@@ -220,7 +220,7 @@
<!-- slider: zamućenje kartice --> <!-- slider: zamućenje kartice -->
<div style="margin-top:12px;"> <div style="margin-top:12px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zamućenje kartice (glass)</span> <span class="pomocni-tekst">Zamućenje kartice (glass)</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurKartice + 'px'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurKartice + 'px'"></span>
</div> </div>
@@ -230,7 +230,7 @@
<!-- slider: zatamnjivanje pozadine --> <!-- slider: zatamnjivanje pozadine -->
<div style="margin-top:12px;"> <div style="margin-top:12px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zatamnjivanje pozadine</span> <span class="pomocni-tekst">Zatamnjivanje pozadine</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="opacity + '%'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="opacity + '%'"></span>
</div> </div>
@@ -240,7 +240,7 @@
<!-- slider: zatamnjivanje kartice NTech --> <!-- slider: zatamnjivanje kartice NTech -->
<div style="margin-top:12px;"> <div style="margin-top:12px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zatamnjivanje kartice NTech</span> <span class="pomocni-tekst">Zatamnjivanje kartice NTech</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="zatamnjenjeKartice + '%'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="zatamnjenjeKartice + '%'"></span>
</div> </div>
@@ -80,7 +80,7 @@
</div> </div>
<div style="margin-top:16px;"> <div style="margin-top:16px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zamućenje pozadine</span> <span class="pomocni-tekst">Zamućenje pozadine</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurPozadine + 'px'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurPozadine + 'px'"></span>
</div> </div>
@@ -88,7 +88,7 @@
class="klizac"> class="klizac">
</div> </div>
<div style="margin-top:12px;"> <div style="margin-top:12px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zamućenje kartice (glass)</span> <span class="pomocni-tekst">Zamućenje kartice (glass)</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurKartice + 'px'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurKartice + 'px'"></span>
</div> </div>
@@ -96,7 +96,7 @@
class="klizac"> class="klizac">
</div> </div>
<div style="margin-top:12px;"> <div style="margin-top:12px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zatamnjivanje pozadine</span> <span class="pomocni-tekst">Zatamnjivanje pozadine</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="opacity + '%'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="opacity + '%'"></span>
</div> </div>
@@ -104,7 +104,7 @@
class="klizac"> class="klizac">
</div> </div>
<div style="margin-top:12px;"> <div style="margin-top:12px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zatamnjivanje kartice NTech</span> <span class="pomocni-tekst">Zatamnjivanje kartice NTech</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="zatamnjenjeKartice + '%'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="zatamnjenjeKartice + '%'"></span>
</div> </div>
@@ -64,7 +64,7 @@
<span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Firma</span> <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Firma</span>
</div> </div>
<div style="display:flex;flex-direction:column;gap:14px;"> <div class="kolona" style="gap:14px;">
<div> <div>
<label class="polje-labela">Naziv firme</label> <label class="polje-labela">Naziv firme</label>
<input type="text" name="naziv_firme" value="{{.NazivFirme}}" <input type="text" name="naziv_firme" value="{{.NazivFirme}}"
+2 -2
View File
@@ -27,7 +27,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
{{if .Sacuvano}} {{if .Sacuvano}}
<div class="poruka-uspeh poruka-animacija">Podsetnik je uspešno sačuvan.</div> <div class="poruka-uspeh poruka-animacija">Podsetnik je uspešno sačuvan.</div>
@@ -115,7 +115,7 @@
<div class="pod-kartice"> <div class="pod-kartice">
{{range .Podsetnici}} {{range .Podsetnici}}
<div class="kartica pod-kartica animiraj"> <div class="kartica pod-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;"> <div class="red-izmedju" style="align-items:flex-start;gap:12px;margin-bottom:10px;">
<div> <div>
<div style="font-size:15px;font-weight:500;color:{{if .JePrekoracen}}var(--greska){{else}}var(--tekst-glavni){{end}};">{{.Naslov}}</div> <div style="font-size:15px;font-weight:500;color:{{if .JePrekoracen}}var(--greska){{else}}var(--tekst-glavni){{end}};">{{.Naslov}}</div>
{{if .Napomena}} {{if .Napomena}}
+1 -1
View File
@@ -28,7 +28,7 @@
{{end}} {{end}}
<form method="POST" action="{{if .Izmena}}/podsetnici/izmeni/{{.Podsetnik.ID}}{{else}}/podsetnici/novi{{end}}"> <form method="POST" action="{{if .Izmena}}/podsetnici/izmeni/{{.Podsetnik.ID}}{{else}}/podsetnici/novi{{end}}">
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
<div> <div>
<label class="polje-labela"> <label class="polje-labela">
+1 -1
View File
@@ -226,7 +226,7 @@
<!-- storno i brisanje --> <!-- storno i brisanje -->
<div class="kartica detalji-kartica animiraj" style="border-color:#dc262633;"> <div class="kartica detalji-kartica animiraj" style="border-color:#dc262633;">
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
{{if and (index $.Dozvole "prodaja.storno") (not .Nalog.Stornirano) }} {{if and (index $.Dozvole "prodaja.storno") (not .Nalog.Stornirano) }}
<div style="display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;"> <div style="display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;">
+5 -5
View File
@@ -57,7 +57,7 @@
<form method="POST" action="/profil/tema"> <form method="POST" action="/profil/tema">
<input type="hidden" name="_csrf" value="{{.CsrfToken}}"> <input type="hidden" name="_csrf" value="{{.CsrfToken}}">
<input type="hidden" name="koristi_lokalnu_temu" value="1"> <input type="hidden" name="koristi_lokalnu_temu" value="1">
<div style="display:flex;flex-direction:column;gap:14px;"> <div class="kolona" style="gap:14px;">
<div style="padding:12px;background:var(--pozadina);border-radius:8px;border:0.5px solid var(--ivica);"> <div style="padding:12px;background:var(--pozadina);border-radius:8px;border:0.5px solid var(--ivica);">
<div style="font-size:13px;color:var(--tekst-sporedni);margin-bottom:10px;">Izaberite temu:</div> <div style="font-size:13px;color:var(--tekst-sporedni);margin-bottom:10px;">Izaberite temu:</div>
<div style="display:flex;gap:16px;"> <div style="display:flex;gap:16px;">
@@ -153,7 +153,7 @@
</div> </div>
<div style="margin-top:16px;"> <div style="margin-top:16px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zamućenje pozadine</span> <span class="pomocni-tekst">Zamućenje pozadine</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurPozadine + 'px'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blurPozadine + 'px'"></span>
</div> </div>
@@ -161,7 +161,7 @@
class="klizac"> class="klizac">
</div> </div>
<div style="margin-top:12px;"> <div style="margin-top:12px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zamućenje stakla</span> <span class="pomocni-tekst">Zamućenje stakla</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blur + 'px'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="blur + 'px'"></span>
</div> </div>
@@ -169,7 +169,7 @@
class="klizac"> class="klizac">
</div> </div>
<div style="margin-top:12px;"> <div style="margin-top:12px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zatamnjivanje pozadine</span> <span class="pomocni-tekst">Zatamnjivanje pozadine</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="opacity + '%'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="opacity + '%'"></span>
</div> </div>
@@ -177,7 +177,7 @@
class="klizac"> class="klizac">
</div> </div>
<div style="margin-top:12px;"> <div style="margin-top:12px;">
<div style="display:flex;justify-content:space-between;margin-bottom:6px;"> <div class="red-izmedju" style="margin-bottom:6px;">
<span class="pomocni-tekst">Zatamnjivanje stakla</span> <span class="pomocni-tekst">Zatamnjivanje stakla</span>
<span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="glassOpacity + '%'"></span> <span style="font-size:13px;color:var(--tekst-glavni);font-weight:500;" x-text="glassOpacity + '%'"></span>
</div> </div>
+3 -3
View File
@@ -45,7 +45,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
{{if .Sacuvano}} {{if .Sacuvano}}
<div class="poruka-uspeh poruka-animacija">Nalog je uspešno sačuvan.</div> <div class="poruka-uspeh poruka-animacija">Nalog je uspešno sačuvan.</div>
@@ -55,7 +55,7 @@
{{end}} {{end}}
<!-- gornja traka: pretraga + dugme nova, ispod toga dugme traži --> <!-- gornja traka: pretraga + dugme nova, ispod toga dugme traži -->
<form method="GET" action="/servis" style="display:flex;flex-direction:column;gap:8px;"> <form method="GET" action="/servis" class="kolona" style="gap:8px;">
<div style="display:flex;gap:8px;flex-wrap:wrap;align-items:center;"> <div style="display:flex;gap:8px;flex-wrap:wrap;align-items:center;">
<input type="text" name="pretraga" value="{{.Pretraga}}" <input type="text" name="pretraga" value="{{.Pretraga}}"
placeholder="Pretraži po broju naloga ili uređaju..." placeholder="Pretraži po broju naloga ili uređaju..."
@@ -138,7 +138,7 @@
<div class="servis-kartice"> <div class="servis-kartice">
{{range .Nalozi}} {{range .Nalozi}}
<div class="kartica servis-kartica animiraj"> <div class="kartica servis-kartica animiraj">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;"> <div class="red-izmedju" style="align-items:flex-start;gap:12px;margin-bottom:10px;">
<div> <div>
<a href="/servis/{{.ID}}" <a href="/servis/{{.ID}}"
style="font-size:15px;font-weight:500;color:var(--sb-akcent);text-decoration:none;font-family:monospace;"> style="font-size:15px;font-weight:500;color:var(--sb-akcent);text-decoration:none;font-family:monospace;">
+3 -3
View File
@@ -32,7 +32,7 @@
{{end}} {{end}}
{{define "sadrzaj"}} {{define "sadrzaj"}}
<div style="display:flex;flex-direction:column;gap:16px;"> <div class="kolona" style="gap:16px;">
{{if .Sacuvano}} {{if .Sacuvano}}
<div class="poruka-uspeh poruka-animacija">Nalog je uspešno sačuvan.</div> <div class="poruka-uspeh poruka-animacija">Nalog je uspešno sačuvan.</div>
@@ -47,7 +47,7 @@
<!-- zaglavlje naloga --> <!-- zaglavlje naloga -->
<div class="kartica detalji-kartica animiraj"> <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;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;"> <div class="kolona" style="gap:8px;">
<span style="font-size:20px;font-weight:600;color:var(--tekst-glavni);font-family:monospace;"> <span style="font-size:20px;font-weight:600;color:var(--tekst-glavni);font-family:monospace;">
{{.Nalog.BrojNaloga}} {{.Nalog.BrojNaloga}}
</span> </span>
@@ -94,7 +94,7 @@
<div style="margin-bottom:16px;padding-bottom:14px;border-bottom:0.5px solid var(--ivica);"> <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> <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Uređaj</span>
</div> </div>
<div style="display:flex;flex-direction:column;gap:14px;"> <div class="kolona" style="gap:14px;">
<div style="display:grid;grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));gap:16px;"> <div style="display:grid;grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));gap:16px;">
<div> <div>
<div style="font-size:12px;color:var(--tekst-sporedni);margin-bottom:4px;">Naziv uređaja</div> <div style="font-size:12px;color:var(--tekst-sporedni);margin-bottom:4px;">Naziv uređaja</div>
+2 -2
View File
@@ -37,12 +37,12 @@
<!-- broj naloga ide kao hidden — server ga je generisao, vraćamo ga pri POST-u --> <!-- broj naloga ide kao hidden — server ga je generisao, vraćamo ga pri POST-u -->
<input type="hidden" name="broj_naloga" value="{{.Nalog.BrojNaloga}}"> <input type="hidden" name="broj_naloga" value="{{.Nalog.BrojNaloga}}">
<div style="display:flex;flex-direction:column;gap:20px;"> <div class="kolona" style="gap:20px;">
<!-- uređaj --> <!-- uređaj -->
<div> <div>
<div class="sekcija-naslov">Uređaj</div> <div class="sekcija-naslov">Uređaj</div>
<div style="display:flex;flex-direction:column;gap:12px;"> <div class="kolona" style="gap:12px;">
<div class="forma-grid-2" style="display:grid;grid-template-columns:1fr 1fr;gap:12px;"> <div class="forma-grid-2" style="display:grid;grid-template-columns:1fr 1fr;gap:12px;">
<div> <div>
<label class="polje-labela"> <label class="polje-labela">