moved the date picker to header

This commit is contained in:
bronkuu 2026-06-15 14:56:08 +02:00
parent a91b196e64
commit 762c2a2e36
6 changed files with 29 additions and 25 deletions

View file

@ -7,7 +7,7 @@ import (
) )
templ CakePage(cake models.Cake) { templ CakePage(cake models.Cake) {
@Layout(cakeTitle(cake), CakeForm(cake)) @Layout(cakeTitle(cake), nil, CakeForm(cake))
} }
templ CakeForm(cake models.Cake) { templ CakeForm(cake models.Cake) {

View file

@ -7,7 +7,7 @@ import (
) )
templ CakesPage(cakes []models.Cake) { templ CakesPage(cakes []models.Cake) {
@Layout("Katalog", CakesMain(cakes)) @Layout("Katalog", nil, CakesMain(cakes))
} }
templ CakesMain(cakes []models.Cake) { templ CakesMain(cakes []models.Cake) {

View file

@ -3,7 +3,7 @@ package templates
import "strconv" import "strconv"
templ Confirmation(title string, id int) { templ Confirmation(title string, id int) {
@Layout(title, ConfirmationBody(id)) @Layout(title, nil, ConfirmationBody(id))
} }
templ ConfirmationBody(id int) { templ ConfirmationBody(id int) {

View file

@ -1,15 +1,15 @@
package templates package templates
templ Layout(title string, main templ.Component) { templ Layout(title string, header, main templ.Component) {
<!doctype html> <!DOCTYPE html>
<html lang="pl"> <html lang="pl">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>{ title } — Zamówienia ciast</title> <title>{ title } — Zamówienia ciast</title>
<link rel="stylesheet" href="/static/fonts/inter.css" /> <link rel="stylesheet" href="/static/fonts/inter.css"/>
<link rel="stylesheet" href="/static/fonts/material.css" /> <link rel="stylesheet" href="/static/fonts/material.css"/>
<link rel="stylesheet" href="/static/style.css" /> <link rel="stylesheet" href="/static/style.css"/>
<script src="/static/htmx2.04.js" defer></script> <script src="/static/htmx2.04.js" defer></script>
<script src="/static/order.js"></script> <script src="/static/order.js"></script>
</head> </head>
@ -20,6 +20,7 @@ templ Layout(title string, main templ.Component) {
<main> <main>
<header class="topnav"> <header class="topnav">
<h1>{ title }</h1> <h1>{ title }</h1>
@header
</header> </header>
<div class="main-content"> <div class="main-content">
@main @main

View file

@ -7,7 +7,7 @@ import (
) )
templ OrderPage(order models.Order, catalogue []models.Cake) { templ OrderPage(order models.Order, catalogue []models.Cake) {
@Layout(orderTitle(order), OrderForm(order, catalogue)) @Layout(orderTitle(order), nil, OrderForm(order, catalogue))
} }
templ OrderForm(order models.Order, catalogue []models.Cake) { templ OrderForm(order models.Order, catalogue []models.Cake) {

View file

@ -7,10 +7,25 @@ import (
) )
templ OrdersPage(first, last string, orders []models.Order) { templ OrdersPage(first, last string, orders []models.Order) {
@Layout("Panel główny", OrdersMain(first, last, orders)) @Layout("Panel główny", DateForm(first, last), OrdersMain(orders))
} }
templ OrdersMain(first, last string, orders []models.Order) { templ DateForm(first, last string) {
<div style="display:flex;align-items:center;gap:0.5rem">
<form hx-get="/orders/search" hx-target="#results-table" hx-trigger="keyup delay:500ms, change" style="display:flex;align-items:center;gap:0.5rem">
<div class="form-group" style="flex-direction:row;align-items:center;gap:0.25rem">
<label style="font-size:0.75rem;white-space:nowrap">Od</label>
<input class="form-input" style="width:8.75rem" type="date" value={ first } name="from"/>
</div>
<div class="form-group" style="flex-direction:row;align-items:center;gap:0.25rem">
<label style="font-size:0.75rem;white-space:nowrap">Do</label>
<input class="form-input" style="width:8.75rem" type="date" value={ last } name="to"/>
</div>
</form>
</div>
}
templ OrdersMain(orders []models.Order) {
<div class="metrics-grid"> <div class="metrics-grid">
<div> <div>
<span class="label"> <span class="label">
@ -60,18 +75,6 @@ templ OrdersMain(first, last string, orders []models.Order) {
<span class="material-symbols-outlined">list_alt</span> <span class="material-symbols-outlined">list_alt</span>
Aktywne zamówienia Aktywne zamówienia
</h2> </h2>
<div style="display:flex;align-items:center;gap:0.5rem">
<form hx-get="/orders/search" hx-target="#results-table" hx-trigger="keyup delay:500ms, change" style="display:flex;align-items:center;gap:0.5rem">
<div class="form-group" style="flex-direction:row;align-items:center;gap:0.25rem">
<label style="font-size:0.75rem;white-space:nowrap">Od</label>
<input class="form-input" style="width:8.75rem" type="date" value={ first } name="from"/>
</div>
<div class="form-group" style="flex-direction:row;align-items:center;gap:0.25rem">
<label style="font-size:0.75rem;white-space:nowrap">Do</label>
<input class="form-input" style="width:8.75rem" type="date" value={ last } name="to"/>
</div>
</form>
</div>
</header> </header>
<div class="table-container" id="results-table"> <div class="table-container" id="results-table">
@OrdersTable(orders) @OrdersTable(orders)