added work prototype

This commit is contained in:
Lorenz Hohermuth 2024-04-07 22:18:48 +02:00
parent ce5533b61c
commit 8ab42a6360
5 changed files with 151 additions and 8 deletions

View File

@ -1,6 +1,8 @@
package handler
import (
"time"
"github.com/labstack/echo/v4"
"github.com/lorenzhohermuth/portfolio/view/component"
"github.com/lorenzhohermuth/portfolio/view/page"
@ -16,7 +18,16 @@ func(h Homehandler) HandleUserShow(ctx echo.Context) error {
{"/static/flower.jpeg", "This is a Flower" , "I like Flowers"},
{"/static/paris.jpg", "This is the Eiffel Tower" , "I not like Franc"},
}
return render(ctx, page.ShowHome(entrys, h.Index))
events := []component.Event{
{time.Now(), time.Now(), "Title 1"},
{time.Now(), time.Now(), "Title 2"},
{time.Now(), time.Now(), "Title 3"},
{time.Now(), time.Now(), "Title 4"},
{time.Now(), time.Now(), "Title 5"},
}
return render(ctx, page.ShowHome(entrys, h.Index, events))
}
type HtmxCarouselHandler struct {

View File

@ -0,0 +1,26 @@
package component
import "time"
type Event struct {
DateStart time.Time
DateEnd time.Time
Title string
}
templ Timeline(evts []Event) {
<div class="text-white mr-4">
for i, v := range evts {
<div class="flex items-center">
<div class="h-1 w-3 m-0 mr-4 rounded-full bg-white"/>
<div>
<p class="m-0 mb-1">{v.Title}</p>
<p class="m-0 text-sm">{v.DateEnd.Format("02 January 2006")} - {v.DateEnd.Format("02 January 2006")}</p>
</div>
</div>
if i + 1 < len(evts) {
<div class="h-10 w-1 rounded-full bg-white ml-1"/>
}
}
</div>
}

View File

@ -0,0 +1,98 @@
// Code generated by templ - DO NOT EDIT.
// templ: version: v0.2.650
package component
//lint:file-ignore SA4006 This context is only used if a nested component is present.
import "github.com/a-h/templ"
import "context"
import "io"
import "bytes"
import "time"
type Event struct {
DateStart time.Time
DateEnd time.Time
Title string
}
func Timeline(evts []Event) templ.Component {
return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
if !templ_7745c5c3_IsBuffer {
templ_7745c5c3_Buffer = templ.GetBuffer()
defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
}
ctx = templ.InitializeContext(ctx)
templ_7745c5c3_Var1 := templ.GetChildren(ctx)
if templ_7745c5c3_Var1 == nil {
templ_7745c5c3_Var1 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"text-white mr-4\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
for i, v := range evts {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex items-center\"><div class=\"h-1 w-3 m-0 mr-4 rounded-full bg-white\"></div><div><p class=\"m-0 mb-1\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var2 string
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(v.Title)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `view/component/Timeline.templ`, Line: 17, Col: 33}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p><p class=\"m-0 text-sm\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var3 string
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(v.DateEnd.Format("02 January 2006"))
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `view/component/Timeline.templ`, Line: 18, Col: 64}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" - ")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var4 string
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(v.DateEnd.Format("02 January 2006"))
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `view/component/Timeline.templ`, Line: 18, Col: 104}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div></div>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if i+1 < len(evts) {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"h-10 w-1 rounded-full bg-white ml-1\"></div>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if !templ_7745c5c3_IsBuffer {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteTo(templ_7745c5c3_W)
}
return templ_7745c5c3_Err
})
}

View File

@ -3,7 +3,7 @@ package page
import "github.com/lorenzhohermuth/portfolio/view/layout"
import "github.com/lorenzhohermuth/portfolio/view/component"
templ ShowHome(arr []component.CarouselEntry, index int) {
templ ShowHome(arr []component.CarouselEntry, index int, events []component.Event) {
@layout.Base(){
<div class="bg-[#cdb4f6] pb-8 pt-1">
<div class="text-white py-2 pr-3 pl-6 bg-[#6266ec] my-4 mr-4 rounded-r-4">
@ -70,11 +70,11 @@ templ ShowHome(arr []component.CarouselEntry, index int) {
</div>
</div>
<div class="h-80 bg-[#fee7c5]">
<div class="bg-[#fee7c5]">
@component.Banner("Work", "", "#1733d2", "#ff5cdb")
<div class="p-3 h-full">
<div class="bg-[#1733d2] h-full w-full rounded-8 flex justify-center items-center">
Work
<div class="bg-[#1733d2] rounded-8 flex justify-center items-center py-8">
@component.Timeline(events)
</div>
</div>
</div>

View File

@ -13,7 +13,7 @@ import "bytes"
import "github.com/lorenzhohermuth/portfolio/view/layout"
import "github.com/lorenzhohermuth/portfolio/view/component"
func ShowHome(arr []component.CarouselEntry, index int) templ.Component {
func ShowHome(arr []component.CarouselEntry, index int, events []component.Event) templ.Component {
return templ.ComponentFunc(func(ctx context.Context, templ_7745c5c3_W io.Writer) (templ_7745c5c3_Err error) {
templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templ_7745c5c3_W.(*bytes.Buffer)
if !templ_7745c5c3_IsBuffer {
@ -56,7 +56,7 @@ func ShowHome(arr []component.CarouselEntry, index int) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div><div class=\"h-80 bg-[#fee7c5]\">")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div><div class=\"bg-[#fee7c5]\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -64,7 +64,15 @@ func ShowHome(arr []component.CarouselEntry, index int) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"p-3 h-full\"><div class=\"bg-[#1733d2] h-full w-full rounded-8 flex justify-center items-center\">Work</div></div></div>")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"p-3 h-full\"><div class=\"bg-[#1733d2] rounded-8 flex justify-center items-center py-8\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = component.Timeline(events).Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}