added work prototype
This commit is contained in:
parent
ce5533b61c
commit
8ab42a6360
|
@ -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 {
|
||||
|
|
|
@ -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>
|
||||
}
|
|
@ -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
|
||||
})
|
||||
}
|
|
@ -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>
|
||||
|
|
|
@ -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
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue