ob/ob248.com
1
0
Fork 0
mirror of https://github.com/hex248/ob248.com.git synced 2026-02-08 02:33:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

errrrrrrrrr

Browse Source
This commit is contained in:
Oliver Bryan
2025-09-26 16:00:15 +01:00
parent 721ac6f07e
commit 0efb4a877b
3 changed files with 21 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/NavLink.astro
View File

@@ -2,8 +2,17 @@
const { currentPage, title, href } = Astro.props;
---
<style>
.nav-link {
transition: color 0.2s;
}
.nav-link:hover {
color: var(--ayu-accent);
}
</style>
<a
href={href}
class={`${currentPage === title ? "text-ayu-accent font-bold" : ""}`}
class={`nav-link ${currentPage.toLowerCase() === title.toLowerCase() ? "text-ayu-accent font-bold" : ""}`}
>{title}</a
>

15
src/components/ProjectListItem.astro
View File

@@ -5,7 +5,9 @@ const { title, description, date, image, slug } = Astro.props;
<style>
.project-item {
border-color: var(--ayu-gutter-dim);
transition: all 0.2s;
transition:
color 0.2s,
border-color 0.2s;
}
.project-item:hover {
border-color: var(--ayu-gutter);
@@ -19,13 +21,16 @@ const { title, description, date, image, slug } = Astro.props;
.project-date {
color: var(--ayu-gutter);
}
.project-item:hover .project-date {
color: var(--ayu-accent);
}
</style>
<a
href={`/projects/${slug}`}
class="project-item block border flex flex-col justify-between"
class="project-item block border-2 flex flex-col justify-between rounded-md"
>
<div class="flex gap-4 p-4">
<div class="flex gap-4 p-4 pb-0">
<div class="w-16 h-16 flex-shrink-0">
{
image ? (
@@ -40,7 +45,7 @@ const { title, description, date, image, slug } = Astro.props;
}
</div>
<div class="flex flex-col gap-2">
<h3 class="project-title text-lg -mb-2">
<h3 class="project-title text-lg -mb-2 -mt-1">
{title}
</h3>
<p class="project-description text-sm">
@@ -48,7 +53,7 @@ const { title, description, date, image, slug } = Astro.props;
</p>
</div>
</div>
<div class="w-full flex justify-end p-2">
<div class="w-full flex justify-end p-2 pt-1">
<p class="project-date text-xs">{date}</p>
</div>
</a>