summaryrefslogtreecommitdiff
path: root/website.templ
diff options
context:
space:
mode:
Diffstat (limited to 'website.templ')
-rw-r--r--website.templ35
1 files changed, 26 insertions, 9 deletions
diff --git a/website.templ b/website.templ
index 53992f7..4a0471b 100644
--- a/website.templ
+++ b/website.templ
@@ -310,12 +310,12 @@ templ FlagshipProject(project Project, extra string) {
<div class="flex flex-col gap-4 flex-1 min-w-0">
<div class="flex flex-wrap items-baseline gap-x-[1ch] gap-y-[0.4rem]">
@project.Icon
- <a href={ templ.SafeURL("/projects/" + project.Slug) } class="text-[170%] font-bold text-(--accent) hover:underline">{ project.Title }</a>
+ <a href={ templ.SafeURL("/projects/" + project.Slug) } class="text-[170%] font-bold text-(--accent) hover:underline after:absolute after:inset-0 after:z-0">{ project.Title }</a>
<span class="text-[85%] text-(--primary)">{ project.Category }</span>
for _, tag := range project.Tags {
<code class={ "text-[75%] px-[0.4rem] inline-block rounded-[0.3rem] border-[0.01rem] bg-(--alt)/25" + " " + tag.Color }>{ tag.Name }</code>
}
- <span class="ml-auto flex items-center self-center">
+ <span class="ml-auto flex items-center self-center relative z-10">
for _, link := range project.Links {
@IconLink(link.URL, link.Label, "") {
@link.Icon
@@ -325,7 +325,7 @@ templ FlagshipProject(project Project, extra string) {
</div>
<p class="leading-relaxed max-w-3xl">{ project.Desc }</p>
if len(flagship.Downloads) > 0 || flagship.Version != "" {
- <div class="flex flex-wrap items-center gap-x-4 gap-y-2">
+ <div class="flex flex-wrap items-center gap-x-4 gap-y-2 relative z-10">
if versionBeforeDownloads {
@VersionTag(project)
}
@@ -349,7 +349,7 @@ templ FlagshipProject(project Project, extra string) {
}
</div>
if flagship.Snippet != "" {
- <div class="shrink-0 self-start flex flex-col gap-[0.5rem] p-[1rem] rounded-[0.4rem] bg-black/30">
+ <div class="shrink-0 self-start flex flex-col gap-[0.5rem] p-[1rem] rounded-[0.4rem] bg-black/30 relative z-10">
<span class="text-[75%] text-(--alt)">example</span>
@CopyPre(flagship.Snippet, "text-[80%] leading-[normal]") {
{ flagship.Snippet }
@@ -418,8 +418,13 @@ templ IconExternal(color string) {
}
templ IconKrypton() {
- @Icon("text-[#00f1ff]") {
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-dot preview-icon"><circle cx="12" cy="12" r="1"></circle><circle cx="12" cy="12" r="10"></circle></svg>
+ @Icon("text-[#00f1ff] scale-150") {
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="24" height="24" fill="none" stroke="currentColor">
+ <!-- Outer Circle -->
+ <circle cx="50" cy="50" r="42" stroke-width="6"></circle>
+ <!-- Inner Dot -->
+ <circle cx="50" cy="50" r="16" fill="currentColor" stroke="none"></circle>
+ </svg>
}
// { "\uf192" }
}
@@ -430,15 +435,15 @@ templ ProjectItem(project Project, extra string) {
<div class="flex flex-col gap-[0.0625rem] w-full">
<div class="flex flex-wrap items-baseline gap-x-[1ch] gap-y-[0.4rem]">
@project.Icon
- <a href={ templ.SafeURL("/projects/" + project.Slug) } class="text-[130%] font-bold text-(--accent)">{ project.Title }</a>
+ <a href={ templ.SafeURL("/projects/" + project.Slug) } class="text-[130%] font-bold text-(--accent) after:absolute after:inset-0 after:z-0">{ project.Title }</a>
<span class="text-[80%] text-(--primary)">{ project.Category }</span>
for _, tag := range project.Tags {
<code class={ "text-[75%] px-[0.4rem] inline-block rounded-[0.3rem] border-[0.01rem] bg-(--alt)/25" + " " + tag.Color }>{ tag.Name }</code>
}
// for _, tag := range project.Tags {
- // <code class="text-[75%] px-[0.4rem] inline-block rounded-[0.3rem] bg-(--extra)/70 text-(--background)">{ tag }</code>
+ // <code class="text-[75%] px-[0.4rem] inline-block rounded-[0.3rem] bg-(--extra)/70 text-(--background)">{ tag }</code>
// }
- <span class="ml-auto flex items-center self-center">
+ <span class="ml-auto flex items-center self-center relative z-10">
for _, link := range project.Links {
@IconLink(link.URL, link.Label, "") {
@link.Icon
@@ -652,6 +657,18 @@ templ IconJetbrains(color string) {
}
}
+templ IconDocs(color string) {
+ @Icon(color) {
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-book-open preview-icon"><path d="M12 5v16"></path><path d="M20.001 19A2 2 0 0022 17V5a2 2 0 00-1.999-2L16 3.002A5 5 0 0012 5a5 5 0 00-4-2H4a2 2 0 00-2 2v12a2 2 0 001.999 2H8a5 5 0 014 2 5 5 0 014-2z"></path></svg>
+ }
+}
+
+templ IconReleases(color string) {
+ @Icon(color) {
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-tags preview-icon"><path d="M13.172 2a2 2 0 0 1 1.414.586l6.71 6.71a2.4 2.4 0 0 1 0 3.408l-4.592 4.592a2.4 2.4 0 0 1-3.408 0l-6.71-6.71A2 2 0 0 1 6 9.172V3a1 1 0 0 1 1-1z"></path><path d="M2 7v6.172a2 2 0 0 0 .586 1.414l6.71 6.71a2.4 2.4 0 0 0 3.191.193"></path><circle cx="10.5" cy="6.5" r=".5" fill="currentColor"></circle></svg>
+ }
+}
+
func row(icon func(color string) templ.Component, color, label, value string) FetchRow {
return FetchRow{Icon: icon(color), Color: color, Label: label, Value: value}
}