tom/arbeitszeitmessung
3
0
Fork 0
Code Issues 17 Pull Requests Actions Packages Releases 9 Wiki Activity

CHANGE: sorted .templ files + added css classes + added nav header

Browse Source
This commit is contained in:
Tom Tröger
2025-02-24 10:42:09 +01:00
parent fdd6416ad9
commit a4e0bf82c9
18 changed files with 384 additions and 477 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
Backend/templates/timeComponents.templ
View File

@@ -13,22 +13,22 @@ templ inputForm() {
urlParams := ctx.Value("urlParams").(url.Values)
user := ctx.Value("user").(models.User)
}}
<div class="col-span-full flex flex-col md:grid grid-cols-subgrid divide-x-1 divide-neutral-400">
<div class="bg-neutral-300 p-2 col-span-2 md:col-span-1 max-md:grid grid-cols-2">
<div class="grid-sub divide-x-1 bg-neutral-300">
<div class="grid-cell col-span-2 md:col-span-1 max-md:grid grid-cols-2">
<p class="font-bold uppercase">{ user.Vorname + " " + user.Name }</p>
<div class="justify-self-end">
<p class="text-sm">Überstunden</p>
<p class="text-accent">4h 32min</p>
</div>
</div>
<form id="timeRangeForm" method="GET" class="bg-neutral-300 flex flex-row col-span-3 md:col-span-3 p-2 gap-2 ">
<form id="timeRangeForm" method="GET" class="grid-cell flex flex-row col-span-3 md:col-span-3 gap-2 ">
@lineComponent()
<div class="flex flex-col gap-2 justify-between grow-1">
<input type="date" value={ urlParams.Get("time_from") } name="time_from" class="w-full bg-neutral-100 placeholder:text-neutral-400 text-neutral-700 text-sm border border-neutral-0 rounded-md px-3 py-2 transition duration-300 ease focus:outline-none focus:border-neutral-400 hover:border-neutral-300" placeholder="Zeitraum von..."/>
<input type="date" value={ urlParams.Get("time_to") } name="time_to" class="w-full bg-neutral-100 placeholder:text-neutral-400 text-neutral-700 text-sm border border-neutral-0 rounded-md px-3 py-2 transition duration-300 ease focus:outline-none focus:border-neutral-400 hover:border-neutral-300" placeholder="Zeitraum bis..."/>
</div>
</form>
<div class="bg-neutral-300 border-r-0 p-2 content-end">
<div class="grid-cell content-end">
<button type="submit" form="timeRangeForm" class="w-full bg-neutral-100 cursor-pointer rounded-md text-neutral-800 p-2 md:px-4 border text-center text-sm hover:text-white transition-colors border-neutral-900 focus:bg-neutral-700 active:bg-neutral-700 hover:bg-neutral-700 disabled:pointer-events-none disabled:opacity-50">
<p class="">Anzeigen</p>
</button>
@@ -40,8 +40,8 @@ templ dayComponent(workDay models.WorkDay) {
{{
work, pause := workDay.GetWorkTimeString()
}}
<div class="col-span-full grid grid-cols-subgrid divide-x-1 divide-neutral-400 hover:bg-neutral-200 transition-colors">
<div class="p-2 col-span-2 md:col-span-1 flex flex-row gap-2">
<div class="grid-sub divide-x-1 hover:bg-neutral-200 transition-colors">
<div class="grid-cell col-span-2 md:col-span-1 flex flex-row gap-2">
@timeGaugeComponent(workDay.GetWorkDayProgress(ctx.Value("user").(models.User)), workDay.Day.Equal(time.Now().Truncate(24*time.Hour)), workDay.RequiresAction())
<div>
<p class=""><span class="font-bold uppercase hidden md:inline">{ workDay.Day.Format("Mon") }:</span> { workDay.Day.Format("02.01.2006") }</p>
@@ -54,7 +54,7 @@ templ dayComponent(workDay models.WorkDay) {
<p class="text-neutral-500">{ pause }</p>
</div>
</div>
<div class="time-component flex flex-row col-span-3 md:col-span-3 gap-2 w-full p-2">
<div class="time-component flex flex-row col-span-3 md:col-span-3 gap-2 w-full grid-cell">
@lineComponent()
<form id={ "time-" + workDay.Day.Format("2006-01-02") } class="flex flex-col gap-2 justify-between group w-full" method="post">
for _, booking := range workDay.Bookings {
@@ -62,7 +62,7 @@ templ dayComponent(workDay models.WorkDay) {
}
</form>
</div>
<div class="p-2">
<div class="grid-cell">
@changeButtonComponent("time-" + workDay.Day.Format("2006-01-02"))
</div>
</div>