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
assets.go
+12
View File
@@ -0,0 +1,12 @@
package assets
import "embed"
//go:embed migrations
var MigracijeFS embed.FS
//go:embed web/static/css
var StaticFS embed.FS
//go:embed web/templates
var TemplatesFS embed.FS
cmd/ntech/main.go
+10 -5
View File
@@ -4,6 +4,7 @@ import (
"context"
"fmt"
"io"
"io/fs"
"log"
"net/http"
"os"
@@ -11,6 +12,7 @@ import (
"sort"
"time"
"ntech"
"ntech/internal/auth"
"ntech/internal/config"
"ntech/internal/db/sqlite"
@@ -30,7 +32,7 @@ func main() {
auth.InitAuthLog()
if config.JelPrvoPokretanje() {
config.PokreniSetup()
config.PokreniSetup(assets.TemplatesFS)
return
}
@@ -50,7 +52,7 @@ func main() {
}
defer db.Close()
if err := sqlite.PokreniMigracije(db, "migrations"); err != nil {
if err := sqlite.PokreniMigracije(db, assets.MigracijeFS); err != nil {
log.Fatalf("Greška pri migracijama: %v", err)
}
log.Println("Migracije uspešno izvršene")
@@ -75,7 +77,7 @@ func main() {
h.Verzija = Verzija
if os.Getenv("NTECH_ENV") == "production" {
kes, err := handler.KreirajKes()
kes, err := handler.KreirajKes(assets.TemplatesFS)
if err != nil {
log.Fatalf("Greška pri kreiranju keša šablona: %v", err)
}
@@ -88,8 +90,11 @@ func main() {
r.Use(ntechmw.CsrfMiddleware)
r.Use(middleware.Compress(5))
// statični fajlovi
r.Handle("/static/*", http.StripPrefix("/static/", http.FileServer(http.Dir("web/static"))))
// uploads se servira sa diska (runtime fajlovi)
r.Handle("/static/uploads/*", http.StripPrefix("/static/uploads/", http.FileServer(http.Dir("web/static/uploads"))))
// ostali statični fajlovi (CSS) iz embed FS-a
staticSub, _ := fs.Sub(assets.StaticFS, "web/static")
r.Handle("/static/*", http.StripPrefix("/static/", http.FileServer(http.FS(staticSub))))
// javne rute (bez autentifikacije)
r.Get("/prijava", h.PrikazPrijave)
internal/config/setup.go
+3 -3
View File
@@ -3,9 +3,9 @@ package config
import (
"encoding/json"
"fmt"
"io/fs"
"log"
"net/http"
"os"
"strings"
"github.com/go-chi/chi/v5"
@@ -13,7 +13,7 @@ import (
)
// PokreniSetup pokreće WebView prozor za prvo podešavanje
func PokreniSetup() {
func PokreniSetup(fsys fs.FS) {
port := NadjiSlobodanPort()
if port == 0 {
log.Fatal("Greška: nije pronađen nijedan slobodan port")
@@ -30,7 +30,7 @@ func PokreniSetup() {
http.Error(w, "Greška", http.StatusInternalServerError)
return
}
sadrzaj, err := os.ReadFile("web/templates/setup/index.html")
sadrzaj, err := fs.ReadFile(fsys, "web/templates/setup/index.html")
if err != nil {
http.Error(w, "Greška", http.StatusInternalServerError)
return
internal/db/sqlite/migracije.go
+8 -8
View File
@@ -3,8 +3,8 @@ package sqlite
import (
"database/sql"
"fmt"
"os"
"path/filepath"
"io/fs"
"path"
"sort"
_ "modernc.org/sqlite"
@@ -32,8 +32,8 @@ func OtvoriDB(putanja string) (*sql.DB, error) {
return db, nil
}
// PokreniMigracije izvršava sve SQL fajlove iz foldera koji još nisu izvršeni
func PokreniMigracije(db *sql.DB, folder string) error {
// PokreniMigracije izvršava sve SQL fajlove iz fs.FS koji još nisu izvršeni
func PokreniMigracije(db *sql.DB, fsys fs.FS) error {
// kreiramo tabelu za praćenje migracija ako ne postoji
_, err := db.Exec(`
CREATE TABLE IF NOT EXISTS migracije (
@@ -46,7 +46,7 @@ func PokreniMigracije(db *sql.DB, folder string) error {
}
// čitamo sve .sql fajlove iz foldera
unosi, err := os.ReadDir(folder)
unosi, err := fs.ReadDir(fsys, "migrations")
if err != nil {
return fmt.Errorf("ntech: PokreniMigracije: čitanje foldera: %w", err)
}
@@ -57,7 +57,7 @@ func PokreniMigracije(db *sql.DB, folder string) error {
})
for _, unos := range unosi {
if filepath.Ext(unos.Name()) != ".sql" {
if path.Ext(unos.Name()) != ".sql" {
continue
}
@@ -74,8 +74,8 @@ func PokreniMigracije(db *sql.DB, folder string) error {
}
// čitamo sadržaj SQL fajla
putanja := filepath.Join(folder, naziv)
sadrzaj, err := os.ReadFile(putanja)
putanja := "migrations/" + naziv
sadrzaj, err := fs.ReadFile(fsys, putanja)
if err != nil {
return fmt.Errorf("ntech: PokreniMigracije: čitanje %s: %w", naziv, err)
}
internal/handler/handler.go
+3 -1
View File
@@ -3,12 +3,13 @@ package handler
import (
"database/sql"
"html/template"
"io/fs"
"net/http"
"ntech/internal/db"
"ntech/internal/db/sqlite"
"ntech/internal/middleware"
"ntech/internal/model"
"net/http"
)
// Handler drži zavisnosti koje su potrebne svim handlerima
@@ -28,6 +29,7 @@ type Handler struct {
LoginIstorijsaRepo db.LoginIstorijsaRepository
Verzija string
Templates map[string]*template.Template
TemplatesFS fs.FS
}
// Novi kreira novi Handler sa datom bazom
internal/handler/kes.go
+5 -4
View File
@@ -3,6 +3,7 @@ package handler
import (
"fmt"
"html/template"
"io/fs"
"log"
"net/http"
)
@@ -34,15 +35,15 @@ var standaloneIme = []string{
"prijava", "setup", "totp_provera", "prodaja_stampa",
}
// KreirajKes parsuje sve šablone i vraća ih keširane u mapi
func KreirajKes() (map[string]*template.Template, error) {
// KreirajKes parsuje sve šablone iz fsys i vraća ih keširane u mapi
func KreirajKes(fsys fs.FS) (map[string]*template.Template, error) {
kes := make(map[string]*template.Template)
for _, ime := range saSidebar {
fajlovi := make([]string, len(bazniSabloni), len(bazniSabloni)+1)
copy(fajlovi, bazniSabloni)
fajlovi = append(fajlovi, "web/templates/stranice/"+ime+".html")
t, err := template.ParseFiles(fajlovi...)
t, err := template.ParseFS(fsys, fajlovi...)
if err != nil {
return nil, fmt.Errorf("kes: %s: %w", ime, err)
}
@@ -50,7 +51,7 @@ func KreirajKes() (map[string]*template.Template, error) {
}
for _, ime := range standaloneIme {
t, err := template.ParseFiles("web/templates/stranice/" + ime + ".html")
t, err := template.ParseFS(fsys, "web/templates/stranice/"+ime+".html")
if err != nil {
return nil, fmt.Errorf("kes: %s: %w", ime, err)
}
web/static/css/main.css
+34 -1
View File
@@ -31,6 +31,7 @@ body {
.sidebar.skupljen {
width: 60px;
overflow: hidden;
}
/* vrh sidebara — logo zona */
@@ -131,7 +132,7 @@ body {
white-space: nowrap;
position: relative;
text-decoration: none;
transition: background 0.2s, color 0.2s;
transition: background 0.2s, color 0.2s, transform 0.15s ease;
}
.nav-stavka:hover {
@@ -139,6 +140,14 @@ body {
color: var(--tekst-jak);
}
.sidebar:not(.skupljen) .nav-stavka:hover {
transform: scale(1.03);
}
.sidebar.skupljen .nav-stavka:hover svg {
transform: scale(1.15);
}
.nav-stavka.aktivan {
background: var(--sb-aktivan);
color: var(--tekst-jak);
@@ -159,6 +168,7 @@ body {
flex-shrink: 0;
width: 20px;
height: 20px;
transition: transform 0.15s ease;
}
.nav-stavka span {
@@ -437,6 +447,29 @@ select {
}
}
/* animacije */
@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); }
}
@keyframes shake {
0%, 100% { transform: translateX(0); }
20% { transform: translateX(-6px); }
40% { transform: translateX(6px); }
60% { transform: translateX(-4px); }
80% { transform: translateX(4px); }
}
.animiraj {
animation: fadeInUp 0.4s ease both;
}
/* gornja traka magacina — responsive */
.magacin-traka {
display: flex;
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>