made page responsive + added content
This commit is contained in:
parent
dedb185664
commit
6512ba1bef
|
|
@ -0,0 +1,84 @@
|
|||
package page
|
||||
|
||||
import "github.com/lorenzhohermuth/portfolio/view/layout"
|
||||
import "github.com/lorenzhohermuth/portfolio/view/component"
|
||||
|
||||
templ ShowHome(arr []component.CarouselEntry, index int, events []component.Event) {
|
||||
@layout.Base(){
|
||||
<section class="bg-[#cdb4f6] pb-8 pt-1">
|
||||
<div id="home" class="text-white py-2 pr-3 md:pr-10 pl-6 bg-[#6266ec] my-4 mr-4 rounded-r-4">
|
||||
<p>
|
||||
About this Website
|
||||
</p>
|
||||
<p>
|
||||
The Purpose of this website is to try a new Stack with GO and HTMX with the goal of using a Minimal amount of Code.
|
||||
And to refresh my old Portfolio to a newer State.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="my-4">
|
||||
@component.Banner("Stack", "", "#6266ec", "#b9f301" )
|
||||
</div>
|
||||
|
||||
<div class="sm:flex justify-center">
|
||||
<div class="px-4 sm:w-150">
|
||||
|
||||
<div class="grid grid-cols-3 gap-1 gap-y-2 font-sm text-sm">
|
||||
|
||||
<div class="col-span-2 rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6">
|
||||
Language
|
||||
</div>
|
||||
<div class="rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6">
|
||||
GO
|
||||
</div>
|
||||
|
||||
<div class="text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
HTMX
|
||||
</div>
|
||||
<div class="text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
Frontend Famework
|
||||
</div>
|
||||
|
||||
<div class="col-span-2 rounded bg-[#b9f301] flex justify-center items-center py-3 px-6">
|
||||
CSS Famework
|
||||
</div>
|
||||
<div class="rounded bg-[#b9f301] flex justify-center items-center py-3 px-6">
|
||||
Uno CSS
|
||||
</div>
|
||||
|
||||
<div class="text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
Templ
|
||||
</div>
|
||||
<div class="text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
HTML Templating
|
||||
</div>
|
||||
|
||||
<div class="text-white col-span-2 rounded bg-[#3331ee] flex justify-center items-center py-3 px-6">
|
||||
HTTP Famework
|
||||
</div>
|
||||
<div class="text-white rounded bg-[#3331ee] flex justify-center items-center py-3 px-6">
|
||||
Echo
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="projects" class="bg-[#ff5cdb] pb-7">
|
||||
@component.Banner("Porjects", "", "#b9f301", "#ff5cdb")
|
||||
<div class="flex justify-center items-center mt-10">
|
||||
@component.Carousel(arr, index)
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="work" class="bg-[#fee7c5]">
|
||||
@component.Banner("Work", "", "#1733d2", "#ff5cdb")
|
||||
<div class="p-3 h-full">
|
||||
<div class="bg-[#1733d2] rounded-8 flex justify-center items-center py-8">
|
||||
@component.Timeline(events)
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
package mdparser
|
||||
|
||||
import (
|
||||
"context"
|
||||
"regexp"
|
||||
"strings"
|
||||
|
||||
"github.com/lorenzhohermuth/portfolio/pkg/github"
|
||||
"github.com/lorenzhohermuth/portfolio/view/component"
|
||||
)
|
||||
|
||||
func GetProjects() []component.CarouselEntry {
|
||||
projectsFile, ghErr := github.FetchGHFile(context.Background(), "/interactive/projects.md")
|
||||
if ghErr != nil {
|
||||
panic(ghErr)
|
||||
}
|
||||
components := make([]component.CarouselEntry, 0)
|
||||
|
||||
lines := strings.Split(projectsFile, "\n")
|
||||
tmpTitle := ""
|
||||
tmpText := ""
|
||||
tmpImg := ""
|
||||
for _, l := range lines {
|
||||
isFilled, elm := parseMdProject(l, &tmpTitle, &tmpText, &tmpImg)
|
||||
if isFilled {
|
||||
components = append(components, elm)
|
||||
}
|
||||
}
|
||||
|
||||
return components
|
||||
}
|
||||
|
||||
func getChar(text string, pos int) string {
|
||||
text = strings.TrimSpace(text)
|
||||
if text == "" {
|
||||
return ""
|
||||
}
|
||||
return string([]rune(text)[pos])
|
||||
}
|
||||
|
||||
func parseMdProject(line string, title *string, text *string, img *string) (bool, component.CarouselEntry){
|
||||
char := getChar(line, 0)
|
||||
|
||||
if char == "" {
|
||||
elm := component.CarouselEntry{
|
||||
ImgPath: *img,
|
||||
Title: *title,
|
||||
Text: *text,
|
||||
}
|
||||
*img = ""
|
||||
*title = ""
|
||||
*text = ""
|
||||
return true, elm
|
||||
|
||||
} else if char == "#" {
|
||||
*title = strings.TrimSpace(line[1:])
|
||||
|
||||
} else if char == "!" {
|
||||
rgx := regexp.MustCompile(`\((.*?)\)`)
|
||||
mdImage := rgx.FindStringSubmatch(line)[1]
|
||||
mdImage = strings.TrimSpace(mdImage)
|
||||
|
||||
if mdImage[:4] != "http" {
|
||||
mdImage = strings.Replace(mdImage, "assets", "static", 1)
|
||||
}
|
||||
|
||||
*img = mdImage
|
||||
|
||||
} else {
|
||||
*text += line
|
||||
}
|
||||
return false, component.CarouselEntry{}
|
||||
}
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
package mdparser
|
||||
|
||||
import (
|
||||
"context"
|
||||
"strings"
|
||||
|
||||
"github.com/lorenzhohermuth/portfolio/pkg/github"
|
||||
"github.com/lorenzhohermuth/portfolio/view/component"
|
||||
)
|
||||
|
||||
func GetWork() []component.Event {
|
||||
projectsFile, ghErr := github.FetchGHFile(context.Background(), "/interactive/work.md")
|
||||
if ghErr != nil {
|
||||
panic(ghErr)
|
||||
}
|
||||
components := make([]component.Event, 0)
|
||||
|
||||
lines := strings.Split(projectsFile, "\n")
|
||||
tmpTitle := ""
|
||||
tmpPeriod := ""
|
||||
for _, l := range lines {
|
||||
isFilled, elm := parseMdWork(l, &tmpTitle, &tmpPeriod)
|
||||
if isFilled {
|
||||
components = append(components, elm)
|
||||
}
|
||||
}
|
||||
|
||||
return components
|
||||
}
|
||||
|
||||
func parseMdWork(line string, title *string, periode *string) (bool, component.Event){
|
||||
char := getChar(line, 0)
|
||||
|
||||
if char == "" {
|
||||
elm := component.Event{
|
||||
TimePeriode: *periode,
|
||||
Title: *title,
|
||||
}
|
||||
*title = ""
|
||||
*periode = ""
|
||||
return true, elm
|
||||
|
||||
} else if char == "#" {
|
||||
*title = strings.TrimSpace(line[1:])
|
||||
} else {
|
||||
*periode = line
|
||||
}
|
||||
return false, component.Event{}
|
||||
}
|
||||
|
|
@ -17,7 +17,7 @@ func getEntry(arr []CarouselEntry, index int) CarouselEntry {
|
|||
|
||||
templ Carousel(elm []CarouselEntry , index int) {
|
||||
<div id="carousel-parent">
|
||||
<div class="flex items-center gap-x-13">
|
||||
<div class="flex items-center gap-x-13 md:gap-x-28 lg:gap-x-52 2xl:gap-x-96 xl:text-lg">
|
||||
|
||||
<div class="relative z-10">
|
||||
<button class="top-1/2 left-0 border-none bg-transparent p-0 absolute -translate-y-1/2 bg-black "
|
||||
|
|
@ -25,13 +25,13 @@ templ Carousel(elm []CarouselEntry , index int) {
|
|||
hx-trigger="click"
|
||||
hx-target="#carousel-parent"
|
||||
>
|
||||
<img src={getEntry(elm, index - 1).ImgPath} class="h-28 w-52 rounded object-cover bg-neutral-800"/>
|
||||
<img src={getEntry(elm, index - 1).ImgPath} class="h-28 w-56 md:h-40 md:w-80 xl:h-64 xl:w-156 rounded object-cover bg-neutral-800"/>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="relative text-center z-20">
|
||||
<img src={getEntry(elm, index).ImgPath} class="h-36 w-64 rounded object-cover bg-neutral-800"/>
|
||||
<div class="bg-gradient-to-t from-black/30 absolute bottom-0 left-0 h-36 w-64 rounded"></div>
|
||||
<img src={getEntry(elm, index).ImgPath} class="h-32 w-64 md:h-48 md:w-96 xl:h-82 xl:w-164 rounded object-cover bg-neutral-800"/>
|
||||
<div class="bg-gradient-to-t from-black/30 absolute bottom-0 left-0 h-32 w-64 md:h-48 md:w-96 xl:h-82 xl:w-164 rounded"></div>
|
||||
<p class="absolute text-neutral-300 bottom-0.5 left-5">{getEntry(elm, index).Title}</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -41,7 +41,7 @@ templ Carousel(elm []CarouselEntry , index int) {
|
|||
hx-trigger="click"
|
||||
hx-target="#carousel-parent"
|
||||
>
|
||||
<img src={getEntry(elm, index + 1).ImgPath} class="h-28 w-52 rounded object-cover bg-neutral-800"/>
|
||||
<img src={getEntry(elm, index + 1).ImgPath} class="h-28 w-56 md:h-40 md:w-80 xl:h-64 xl:w-156 rounded object-cover bg-neutral-800"/>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ func Carousel(elm []CarouselEntry, index int) templ.Component {
|
|||
templ_7745c5c3_Var1 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div id=\"carousel-parent\"><div class=\"flex items-center gap-x-13\"><div class=\"relative z-10\"><button class=\"top-1/2 left-0 border-none bg-transparent p-0 absolute -translate-y-1/2 bg-black \" hx-post=\"/carousel/previous\" hx-trigger=\"click\" hx-target=\"#carousel-parent\"><img src=\"")
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div id=\"carousel-parent\"><div class=\"flex items-center gap-x-13 md:gap-x-28 lg:gap-x-52 2xl:gap-x-96 xl:text-lg\"><div class=\"relative z-10\"><button class=\"top-1/2 left-0 border-none bg-transparent p-0 absolute -translate-y-1/2 bg-black \" hx-post=\"/carousel/previous\" hx-trigger=\"click\" hx-target=\"#carousel-parent\"><img src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
|
|
@ -51,7 +51,7 @@ func Carousel(elm []CarouselEntry, index int) templ.Component {
|
|||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-28 w-52 rounded object-cover bg-neutral-800\"></button></div><div class=\"relative text-center z-20\"><img src=\"")
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-28 w-56 md:h-40 md:w-80 xl:h-64 xl:w-156 rounded object-cover bg-neutral-800\"></button></div><div class=\"relative text-center z-20\"><img src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
|
|
@ -64,7 +64,7 @@ func Carousel(elm []CarouselEntry, index int) templ.Component {
|
|||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-36 w-64 rounded object-cover bg-neutral-800\"><div class=\"bg-gradient-to-t from-black/30 absolute bottom-0 left-0 h-36 w-64 rounded\"></div><p class=\"absolute text-neutral-300 bottom-0.5 left-5\">")
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-32 w-64 md:h-48 md:w-96 xl:h-82 xl:w-164 rounded object-cover bg-neutral-800\"><div class=\"bg-gradient-to-t from-black/30 absolute bottom-0 left-0 h-32 w-64 md:h-48 md:w-96 xl:h-82 xl:w-164 rounded\"></div><p class=\"absolute text-neutral-300 bottom-0.5 left-5\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
|
|
@ -90,7 +90,7 @@ func Carousel(elm []CarouselEntry, index int) templ.Component {
|
|||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-28 w-52 rounded object-cover bg-neutral-800\"></button></div></div><p class=\"text-center font-thin\">")
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-28 w-56 md:h-40 md:w-80 xl:h-64 xl:w-156 rounded object-cover bg-neutral-800\"></button></div></div><p class=\"text-center font-thin\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ templ Base() {
|
|||
<div class="bg-orange-500 w-35 flex justify-center">
|
||||
<img src="/static/robot.png" height="70"/>
|
||||
</div>
|
||||
<div class="container bg-[#3331ee]">
|
||||
<div class="bg-[#3331ee] w-full">
|
||||
<ul class="flex items-center justify-center h-full gap-x-4 p-0 list-none m-0">
|
||||
<li><a class="no-underline text-[#ff5cdb]" href="#home">Home</a></li>
|
||||
<li><a class="no-underline text-[#ff5cdb]" href="#projects">Projects</a></li>
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ func Base() templ.Component {
|
|||
templ_7745c5c3_Var1 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!doctype html><html lang=\"en\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><title>Portfolio Lorenz Hohermuth</title><script src=\"https://cdn.jsdelivr.net/npm/@unocss/runtime\"></script><script src=\"https://unpkg.com/htmx.org@1.9.11\" integrity=\"sha384-0gxUXCCR8yv9FM2b+U3FDbsKthCI66oH5IA9fHppQq9DDMHuMauqq1ZHBpJxQ0J0\" crossorigin=\"anonymous\"></script></head><style>\n\t\t@font-face {\n\t\t\tfont-family: UbuntuMono;\n\t\t\tsrc: url(static/UbuntuMono/UbuntuMonoNerdFont-Bold.ttf)\n\t\t}\n\t</style><body class=\"m-0 p-0 font-black\" style=\"font-family: UbuntuMono\"><nav class=\"flex w-full pos-sticky top-0 z-30\"><div class=\"bg-orange-500 w-35 flex justify-center\"><img src=\"/static/robot.png\" height=\"70\"></div><div class=\"container bg-[#3331ee]\"><ul class=\"flex items-center justify-center h-full gap-x-4 p-0 list-none m-0\"><li><a class=\"no-underline text-[#ff5cdb]\" href=\"#home\">Home</a></li><li><a class=\"no-underline text-[#ff5cdb]\" href=\"#projects\">Projects</a></li><li><a class=\"no-underline text-[#ff5cdb]\" href=\"#work\">Work</a></li></ul></div></nav><main>")
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!doctype html><html lang=\"en\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><title>Portfolio Lorenz Hohermuth</title><script src=\"https://cdn.jsdelivr.net/npm/@unocss/runtime\"></script><script src=\"https://unpkg.com/htmx.org@1.9.11\" integrity=\"sha384-0gxUXCCR8yv9FM2b+U3FDbsKthCI66oH5IA9fHppQq9DDMHuMauqq1ZHBpJxQ0J0\" crossorigin=\"anonymous\"></script></head><style>\n\t\t@font-face {\n\t\t\tfont-family: UbuntuMono;\n\t\t\tsrc: url(static/UbuntuMono/UbuntuMonoNerdFont-Bold.ttf)\n\t\t}\n\t</style><body class=\"m-0 p-0 font-black\" style=\"font-family: UbuntuMono\"><nav class=\"flex w-full pos-sticky top-0 z-30\"><div class=\"bg-orange-500 w-35 flex justify-center\"><img src=\"/static/robot.png\" height=\"70\"></div><div class=\"bg-[#3331ee] w-full\"><ul class=\"flex items-center justify-center h-full gap-x-4 p-0 list-none m-0\"><li><a class=\"no-underline text-[#ff5cdb]\" href=\"#home\">Home</a></li><li><a class=\"no-underline text-[#ff5cdb]\" href=\"#projects\">Projects</a></li><li><a class=\"no-underline text-[#ff5cdb]\" href=\"#work\">Work</a></li></ul></div></nav><main>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,66 +5,80 @@ import "github.com/lorenzhohermuth/portfolio/view/component"
|
|||
|
||||
templ ShowHome(arr []component.CarouselEntry, index int, events []component.Event) {
|
||||
@layout.Base(){
|
||||
<section class="bg-[#cdb4f6] pb-8 pt-1">
|
||||
<div id="home" class="text-white py-2 pr-3 pl-6 bg-[#6266ec] my-4 mr-4 rounded-r-4">
|
||||
<p>
|
||||
About this Website
|
||||
</p>
|
||||
<p>
|
||||
The Purpose of this website is to try a new Stack with GO and HTMX with the goal of using a Minimal amount of Code.
|
||||
And to refresh my old Portfolio to a newer State.
|
||||
</p>
|
||||
<section class="bg-[#cdb4f6] pt-1">
|
||||
<div class="md:flex justify-center">
|
||||
<div id="home" class="text-white py-2 pr-3 pl-6 bg-[#6266ec] my-4 mr-4 rounded-r-4 md:rounded-4 md:m-4 md:w-164">
|
||||
<h2>
|
||||
About this Website
|
||||
</h2>
|
||||
<p>
|
||||
The Purpose of this website is to try a new Stack with GO and HTMX with the goal of using a Minimal amount of Code.
|
||||
And to refresh my old Portfolio to a newer State.
|
||||
</p>
|
||||
<p>
|
||||
Normally, my Portfolio is seriously out of date.
|
||||
So I have written this one with the GitHub API and a small parser, which parser the Markdown Files in my Repo into the Timeline and the Carousel.
|
||||
They are the files in the Interactive folder.
|
||||
</p>
|
||||
<a href="https://github.com/LorenzHohermuth/portfolio" class="text-[#ff5cdb]">Repo</a>
|
||||
<p>
|
||||
Yes, I could have written a GitHub workflow to Automatically make restart the site,
|
||||
but I wanted to learn more about the go Context. (Plus Pipelines are a Pain in the Ass).
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="my-4">
|
||||
<div>
|
||||
@component.Banner("Stack", "", "#6266ec", "#b9f301" )
|
||||
</div>
|
||||
|
||||
<div class="px-4">
|
||||
|
||||
<div class="grid grid-cols-3 gap-1 gap-y-2 font-sm text-sm">
|
||||
|
||||
<div class="col-span-2 rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6">
|
||||
Language
|
||||
</div>
|
||||
<div class="rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6">
|
||||
GO
|
||||
</div>
|
||||
|
||||
<div class="text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
HTMX
|
||||
</div>
|
||||
<div class="text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
Frontend Famework
|
||||
</div>
|
||||
<div class="sm:flex justify-center py-12">
|
||||
<div class="px-4 sm:w-150">
|
||||
|
||||
<div class="col-span-2 rounded bg-[#b9f301] flex justify-center items-center py-3 px-6">
|
||||
CSS Famework
|
||||
</div>
|
||||
<div class="rounded bg-[#b9f301] flex justify-center items-center py-3 px-6">
|
||||
Uno CSS
|
||||
</div>
|
||||
<div class="grid grid-cols-3 gap-1 gap-y-2 text-sm md:text-base">
|
||||
|
||||
<div class="text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
Templ
|
||||
</div>
|
||||
<div class="text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
HTML Templating
|
||||
</div>
|
||||
<div class="col-span-2 rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6">
|
||||
Language
|
||||
</div>
|
||||
<div class="rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6">
|
||||
GO
|
||||
</div>
|
||||
|
||||
<div class="text-white col-span-2 rounded bg-[#3331ee] flex justify-center items-center py-3 px-6">
|
||||
HTTP Famework
|
||||
<div class="text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
HTMX
|
||||
</div>
|
||||
<div class="text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
Frontend Famework
|
||||
</div>
|
||||
|
||||
<div class="col-span-2 rounded bg-[#b9f301] flex justify-center items-center py-3 px-6">
|
||||
CSS Famework
|
||||
</div>
|
||||
<div class="rounded bg-[#b9f301] flex justify-center items-center py-3 px-6">
|
||||
Uno CSS
|
||||
</div>
|
||||
|
||||
<div class="text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
Templ
|
||||
</div>
|
||||
<div class="text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6">
|
||||
HTML Templating
|
||||
</div>
|
||||
|
||||
<div class="text-white col-span-2 rounded bg-[#3331ee] flex justify-center items-center py-3 px-6">
|
||||
HTTP Famework
|
||||
</div>
|
||||
<div class="text-white rounded bg-[#3331ee] flex justify-center items-center py-3 px-6">
|
||||
Echo
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="text-white rounded bg-[#3331ee] flex justify-center items-center py-3 px-6">
|
||||
Echo
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="projects" class="bg-[#ff5cdb] pb-7">
|
||||
@component.Banner("Porjects", "", "#b9f301", "#ff5cdb")
|
||||
@component.Banner("Projects", "", "#b9f301", "#ff5cdb")
|
||||
<div class="flex justify-center items-center mt-10">
|
||||
@component.Carousel(arr, index)
|
||||
</div>
|
||||
|
|
@ -73,7 +87,7 @@ templ ShowHome(arr []component.CarouselEntry, index int, events []component.Even
|
|||
<section id="work" class="bg-[#fee7c5]">
|
||||
@component.Banner("Work", "", "#1733d2", "#ff5cdb")
|
||||
<div class="p-3 h-full">
|
||||
<div class="bg-[#1733d2] rounded-8 flex justify-center items-center py-8">
|
||||
<div class="bg-[#1733d2] rounded-8 flex justify-center items-center py-16 sm:p-24">
|
||||
@component.Timeline(events)
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ func ShowHome(arr []component.CarouselEntry, index int, events []component.Event
|
|||
templ_7745c5c3_Buffer = templ.GetBuffer()
|
||||
defer templ.ReleaseBuffer(templ_7745c5c3_Buffer)
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<section class=\"bg-[#cdb4f6] pb-8 pt-1\"><div id=\"home\" class=\"text-white py-2 pr-3 pl-6 bg-[#6266ec] my-4 mr-4 rounded-r-4\"><p>About this Website </p><p>The Purpose of this website is to try a new Stack with GO and HTMX with the goal of using a Minimal amount of Code. And to refresh my old Portfolio to a newer State.</p></div><div class=\"my-4\">")
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<section class=\"bg-[#cdb4f6] pt-1\"><div class=\"md:flex justify-center\"><div id=\"home\" class=\"text-white py-2 pr-3 pl-6 bg-[#6266ec] my-4 mr-4 rounded-r-4 md:rounded-4 md:m-4 md:w-164\"><h2>About this Website </h2><p>The Purpose of this website is to try a new Stack with GO and HTMX with the goal of using a Minimal amount of Code. And to refresh my old Portfolio to a newer State.</p><p>Normally, my Portfolio is seriously out of date. So I have written this one with the GitHub API and a small parser, which parser the Markdown Files in my Repo into the Timeline and the Carousel. They are the files in the Interactive folder. </p><a href=\"https://github.com/LorenzHohermuth/portfolio\" class=\"text-[#ff5cdb]\">Repo</a><p>Yes, I could have written a GitHub workflow to Automatically make restart the site, but I wanted to learn more about the go Context. (Plus Pipelines are a Pain in the Ass).</p></div></div><div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
|
|
@ -40,11 +40,11 @@ func ShowHome(arr []component.CarouselEntry, index int, events []component.Event
|
|||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div class=\"px-4\"><div class=\"grid grid-cols-3 gap-1 gap-y-2 font-sm text-sm\"><div class=\"col-span-2 rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6\">Language</div><div class=\"rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6\">GO</div><div class=\"text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6\">HTMX</div><div class=\"text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6\">Frontend Famework</div><div class=\"col-span-2 rounded bg-[#b9f301] flex justify-center items-center py-3 px-6\">CSS Famework</div><div class=\"rounded bg-[#b9f301] flex justify-center items-center py-3 px-6\">Uno CSS</div><div class=\"text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6\">Templ</div><div class=\"text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6\">HTML Templating</div><div class=\"text-white col-span-2 rounded bg-[#3331ee] flex justify-center items-center py-3 px-6\">HTTP Famework</div><div class=\"text-white rounded bg-[#3331ee] flex justify-center items-center py-3 px-6\">Echo</div></div></div></section><section id=\"projects\" class=\"bg-[#ff5cdb] pb-7\">")
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div class=\"sm:flex justify-center py-12\"><div class=\"px-4 sm:w-150\"><div class=\"grid grid-cols-3 gap-1 gap-y-2 text-sm md:text-base\"><div class=\"col-span-2 rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6\">Language</div><div class=\"rounded bg-[#ff5cdb] flex justify-center items-center py-3 px-6\">GO</div><div class=\"text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6\">HTMX</div><div class=\"text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6\">Frontend Famework</div><div class=\"col-span-2 rounded bg-[#b9f301] flex justify-center items-center py-3 px-6\">CSS Famework</div><div class=\"rounded bg-[#b9f301] flex justify-center items-center py-3 px-6\">Uno CSS</div><div class=\"text-white rounded bg-[#6266ec] flex justify-center items-center py-3 px-6\">Templ</div><div class=\"text-white col-span-2 rounded bg-[#6266ec] flex justify-center items-center py-3 px-6\">HTML Templating</div><div class=\"text-white col-span-2 rounded bg-[#3331ee] flex justify-center items-center py-3 px-6\">HTTP Famework</div><div class=\"text-white rounded bg-[#3331ee] flex justify-center items-center py-3 px-6\">Echo</div></div></div></div></section><section id=\"projects\" class=\"bg-[#ff5cdb] pb-7\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = component.Banner("Porjects", "", "#b9f301", "#ff5cdb").Render(ctx, templ_7745c5c3_Buffer)
|
||||
templ_7745c5c3_Err = component.Banner("Projects", "", "#b9f301", "#ff5cdb").Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
|
|
@ -64,7 +64,7 @@ func ShowHome(arr []component.CarouselEntry, index int, events []component.Event
|
|||
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] rounded-8 flex justify-center items-center py-8\">")
|
||||
_, 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-16 sm:p-24\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue