49 lines
2.1 KiB
Plaintext
49 lines
2.1 KiB
Plaintext
package pages
|
|
|
|
import "personal-site/constants"
|
|
import "fmt"
|
|
import "personal-site/components"
|
|
|
|
templ projectCard(idx int, project constants.Project) {
|
|
<a href={ project.Url } target="_blank"
|
|
class="group rounded-lg px-5 py-4 flex items-start justify-between gap-4 fade-up bg-[#111113] border border-zinc-800 transition-all duration-150 ease-in-out hover:border-zinc-600 hover:bg-[#18181b] hover:-translate-y-0.5"
|
|
style={ fmt.Sprintf("animation-delay: %dms", idx*30) }>
|
|
<div class="flex-1 min-w-0">
|
|
<div class="flex items-center gap-2.5 mb-1.5">
|
|
<span class="text-sm font-medium">{ project.Name }</span>
|
|
</div>
|
|
<p class="text-zinc-500 text-xs leading-relaxed mb-3">{ project.Description }</p>
|
|
<div class="flex flex-wrap gap-1.5">
|
|
for _, tag := range project.TechTags {
|
|
<span class="font-mono text-xs px-2 py-0.5 rounded-sm bg-zinc-800 text-fg-200">{ tag }</span>
|
|
}
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="arrow text-fg-200 mt-0.5 shrink-0 opacity-0 group-hover:opacity-100 transition-all duration-150 ease-in-out">
|
|
<svg width="14" height="14" viewBox="0 0 14 14" fill="none">
|
|
<path d="M2 12L12 2M12 2H5M12 2V9" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
|
|
stroke-linejoin="round"></path>
|
|
</svg>
|
|
</div>
|
|
</a>
|
|
}
|
|
|
|
templ ProjectPage(projects []constants.Project) {
|
|
{{ params := constants.NewLayoutParams("Home") }}
|
|
@components.MainLayout(params) {
|
|
<div class="fade-up flex flex-col gap-3" style="animation-delay:0ms">
|
|
<p class="mono text-xs text-fg-200 tracking-widest uppercase">derrickgee.dev/projects</p>
|
|
<h1 class="text-3xl font-semibold tracking-tight">Projects Directory</h1>
|
|
<p class="text-fg-200 text-sm leading-relaxed max-w-md">
|
|
A collection of projects built across different languages and frameworks.
|
|
Each runs as an independent service.
|
|
</p>
|
|
</div>
|
|
<hr class="border-base-100 fade-up" style="animation-delay:80ms" />
|
|
for idx, p := range projects {
|
|
@projectCard(idx, p)
|
|
}
|
|
}
|
|
}
|