improve layout

This commit is contained in:
Ruidy 2024-11-25 14:58:18 +01:00
parent 148dba120f
commit c2d0ddc67a
No known key found for this signature in database
GPG key ID: E00F51288CB857CC
10 changed files with 15 additions and 13 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1,013 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 488 KiB

View file

@ -1,7 +1,7 @@
package view package view
templ BookingForm(booking BookingViewModel) { templ BookingForm(booking BookingViewModel) {
<form hx-put={ booking.Url } hx-swap="outerHTML" class="p-4 bg-base-200 rounded-lg shadow-lg max-w-4xl mx-auto"> <form hx-put={ booking.Url } hx-swap="outerHTML" class="p-4 bg-base-200 rounded-lg shadow-lg w-[98%] mx-auto">
<fieldset class="space-y-6"> <fieldset class="space-y-6">
<div class="grid grid-cols-1 md:grid-cols-3 gap-4"> <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<label class="form-control w-full"> <label class="form-control w-full">

View file

@ -42,7 +42,7 @@ func BookingForm(booking BookingViewModel) templ.Component {
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" hx-swap=\"outerHTML\" class=\"p-4 bg-base-200 rounded-lg shadow-lg max-w-4xl mx-auto\"><fieldset class=\"space-y-6\"><div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\"><label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Customer name</span></div><input type=\"text\" id=\"name\" name=\"name\" value=\"") _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" hx-swap=\"outerHTML\" class=\"p-4 bg-base-200 rounded-lg shadow-lg w-[98%] mx-auto\"><fieldset class=\"space-y-6\"><div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\"><label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Customer name</span></div><input type=\"text\" id=\"name\" name=\"name\" value=\"")
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }

View file

@ -4,7 +4,7 @@ import "github.com/rjNemo/rentease/internal/view/layout"
templ ListBookings(bookings []*ListBookingsViewModel) { templ ListBookings(bookings []*ListBookingsViewModel) {
@layout.BaseLayout() { @layout.BaseLayout() {
<div class="flex flex-col md:flex-row justify-between items-start md:items-center gap-4 mb-4 w-full mx-4"> <section class="flex flex-col md:flex-row justify-between items-start md:items-center gap-4 mb-4 p-4 w-[98%] mx-auto">
<hgroup class="flex-shrink-0"> <hgroup class="flex-shrink-0">
<h1 class="text-3xl font-bold text-primary tracking-tight">Bookings</h1> <h1 class="text-3xl font-bold text-primary tracking-tight">Bookings</h1>
<h2 class="text-muted text-lg font-normal">Overview of the activity</h2> <h2 class="text-muted text-lg font-normal">Overview of the activity</h2>
@ -19,7 +19,7 @@ templ ListBookings(bookings []*ListBookingsViewModel) {
hx-trigger="keyup changed delay:500ms" hx-trigger="keyup changed delay:500ms"
class="input input-bordered input-primary w-full md:w-96" class="input input-bordered input-primary w-full md:w-96"
/> />
</div> </section>
<div class="overflow-x-auto"> <div class="overflow-x-auto">
<table class="table table-zebra w-full"> <table class="table table-zebra w-full">
<thead> <thead>

View file

@ -43,7 +43,7 @@ func ListBookings(bookings []*ListBookingsViewModel) templ.Component {
}() }()
} }
ctx = templ.InitializeContext(ctx) ctx = templ.InitializeContext(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex flex-col md:flex-row justify-between items-start md:items-center gap-4 mb-4 w-full mx-4\"><hgroup class=\"flex-shrink-0\"><h1 class=\"text-3xl font-bold text-primary tracking-tight\">Bookings</h1><h2 class=\"text-muted text-lg font-normal\">Overview of the activity</h2></hgroup> <input type=\"search\" name=\"search\" placeholder=\"Search bookings by name…\" hx-get=\"/bookings\" hx-target=\"tbody\" hx-swap=\"outerHTML\" hx-trigger=\"keyup changed delay:500ms\" class=\"input input-bordered input-primary w-full md:w-96\"></div><div class=\"overflow-x-auto\"><table class=\"table table-zebra w-full\"><thead><tr><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">ID</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">Name</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">Total (€)</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">From</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">To</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">Platform</th></tr></thead>") _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<section class=\"flex flex-col md:flex-row justify-between items-start md:items-center gap-4 mb-4 p-4 w-[98%] mx-auto\"><hgroup class=\"flex-shrink-0\"><h1 class=\"text-3xl font-bold text-primary tracking-tight\">Bookings</h1><h2 class=\"text-muted text-lg font-normal\">Overview of the activity</h2></hgroup> <input type=\"search\" name=\"search\" placeholder=\"Search bookings by name…\" hx-get=\"/bookings\" hx-target=\"tbody\" hx-swap=\"outerHTML\" hx-trigger=\"keyup changed delay:500ms\" class=\"input input-bordered input-primary w-full md:w-96\"></section><div class=\"overflow-x-auto\"><table class=\"table table-zebra w-full\"><thead><tr><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">ID</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">Name</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">Total (€)</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">From</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">To</th><th scope=\"col\" class=\"text-left px-4 py-2 text-primary\">Platform</th></tr></thead>")
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }

View file

@ -4,11 +4,13 @@ import "github.com/rjNemo/rentease/internal/view/layout"
templ NewBooking(platforms []string) { templ NewBooking(platforms []string) {
@layout.BaseLayout() { @layout.BaseLayout() {
<hgroup class="flex flex-col"> <section class="flex justify-between items-center p-4 bg-base-100">
<h1 class="text-2xl font-bold text-primary">New Booking</h1> <hgroup class="flex flex-col">
<span class="text-sm text-base-content/60">Create a new booking</span> <h1 class="text-3xl font-bold text-primary">New Booking</h1>
</hgroup> <h2 class="text-lg text-muted">Create a new booking</h2>
<form method="POST" class="p-4 bg-base-200 rounded-lg shadow-lg max-w-4xl mx-auto"> </hgroup>
</section>
<form method="POST" class="p-4 bg-base-200 rounded-lg shadow-lg w-[98%] mx-auto">
<fieldset class="space-y-6"> <fieldset class="space-y-6">
<div class="grid grid-cols-1 md:grid-cols-3 gap-4"> <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<label class="form-control w-full"> <label class="form-control w-full">

View file

@ -43,7 +43,7 @@ func NewBooking(platforms []string) templ.Component {
}() }()
} }
ctx = templ.InitializeContext(ctx) ctx = templ.InitializeContext(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<hgroup class=\"flex flex-col\"><h1 class=\"text-2xl font-bold text-primary\">New Booking</h1><span class=\"text-sm text-base-content/60\">Create a new booking</span></hgroup><form method=\"POST\" class=\"p-4 bg-base-200 rounded-lg shadow-lg max-w-4xl mx-auto\"><fieldset class=\"space-y-6\"><div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\"><label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Customer name</span></div><input type=\"text\" id=\"name\" name=\"name\" placeholder=\"John Doe\" required autofocus class=\"input input-bordered w-full\"></label> <label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Phone number</span></div><input type=\"tel\" id=\"phone_number\" name=\"phone_number\" placeholder=\"06 12 34 56 78\" class=\"input input-bordered w-full\"></label> <label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Customer number</span></div><input type=\"number\" inputmode=\"numeric\" id=\"customer_number\" name=\"customer_number\" placeholder=\"1\" required class=\"input input-bordered w-full\"></label></div><div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\"><label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Email</span></div><input type=\"email\" id=\"email\" name=\"email\" placeholder=\"john@doe.com\" class=\"input input-bordered w-full\"></label> <label class=\"form-control\"><div class=\"label\"><span class=\"label-text\">From</span></div><input type=\"date\" id=\"from\" name=\"from\" required class=\"input input-bordered w-full\"></label> <label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">To</span></div><input type=\"date\" id=\"to\" name=\"to\" required class=\"input input-bordered w-full\"></label></div><div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\"><label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Platform</span></div><select id=\"platform\" name=\"platform\" class=\"select select-bordered w-full\">") _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<section class=\"flex justify-between items-center p-4 bg-base-100\"><hgroup class=\"flex flex-col\"><h1 class=\"text-3xl font-bold text-primary\">New Booking</h1><h2 class=\"text-lg text-muted\">Create a new booking</h2></hgroup></section><form method=\"POST\" class=\"p-4 bg-base-200 rounded-lg shadow-lg w-[98%] mx-auto\"><fieldset class=\"space-y-6\"><div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\"><label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Customer name</span></div><input type=\"text\" id=\"name\" name=\"name\" placeholder=\"John Doe\" required autofocus class=\"input input-bordered w-full\"></label> <label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Phone number</span></div><input type=\"tel\" id=\"phone_number\" name=\"phone_number\" placeholder=\"06 12 34 56 78\" class=\"input input-bordered w-full\"></label> <label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Customer number</span></div><input type=\"number\" inputmode=\"numeric\" id=\"customer_number\" name=\"customer_number\" placeholder=\"1\" required class=\"input input-bordered w-full\"></label></div><div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\"><label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Email</span></div><input type=\"email\" id=\"email\" name=\"email\" placeholder=\"john@doe.com\" class=\"input input-bordered w-full\"></label> <label class=\"form-control\"><div class=\"label\"><span class=\"label-text\">From</span></div><input type=\"date\" id=\"from\" name=\"from\" required class=\"input input-bordered w-full\"></label> <label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">To</span></div><input type=\"date\" id=\"to\" name=\"to\" required class=\"input input-bordered w-full\"></label></div><div class=\"grid grid-cols-1 md:grid-cols-3 gap-4\"><label class=\"form-control w-full\"><div class=\"label\"><span class=\"label-text\">Platform</span></div><select id=\"platform\" name=\"platform\" class=\"select select-bordered w-full\">")
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }
@ -55,7 +55,7 @@ func NewBooking(platforms []string) templ.Component {
var templ_7745c5c3_Var3 string var templ_7745c5c3_Var3 string
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(platform) templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(platform)
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/bookings_new.templ`, Line: 60, Col: 32} return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/bookings_new.templ`, Line: 62, Col: 32}
} }
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3)) _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
@ -68,7 +68,7 @@ func NewBooking(platforms []string) templ.Component {
var templ_7745c5c3_Var4 string var templ_7745c5c3_Var4 string
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(platform) templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(platform)
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/bookings_new.templ`, Line: 60, Col: 45} return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/bookings_new.templ`, Line: 62, Col: 45}
} }
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4)) _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {