mirror of
https://github.com/hex248/ob248.com.git
synced 2026-02-07 18:23:04 +00:00
improved filter visuals
This commit is contained in:
@@ -106,8 +106,8 @@ const sortedTags = Array.from(allTags).sort((a, b) => a.localeCompare(b));
|
|||||||
</style>
|
</style>
|
||||||
|
|
||||||
<Layout currentPage={{ title: "home", path: "/" }}>
|
<Layout currentPage={{ title: "home", path: "/" }}>
|
||||||
<h2 class="text-2xl font-600 text-ayu-green-500">ABOUT</h2>
|
<h2 class="text-2xl font-600 text-ayu-green-500 mb-2">ABOUT</h2>
|
||||||
<span class="flex flex-wrap gap-2 py-2">
|
<span class="flex flex-wrap gap-2 mb-2">
|
||||||
<a
|
<a
|
||||||
href="https://github.com/hex248"
|
href="https://github.com/hex248"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
@@ -127,7 +127,7 @@ const sortedTags = Array.from(allTags).sort((a, b) => a.localeCompare(b));
|
|||||||
04oliverbryan@gmail.com
|
04oliverbryan@gmail.com
|
||||||
</a>
|
</a>
|
||||||
</span>
|
</span>
|
||||||
<ul class="list-disc ml-4 mb-4">
|
<ul class="list-disc ml-4 mb-2">
|
||||||
<li>
|
<li>
|
||||||
<span class="text-ayu-red-500 font-500">Name: </span>Oliver Bryan
|
<span class="text-ayu-red-500 font-500">Name: </span>Oliver Bryan
|
||||||
</li>
|
</li>
|
||||||
@@ -158,21 +158,27 @@ const sortedTags = Array.from(allTags).sort((a, b) => a.localeCompare(b));
|
|||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<h2 class="text-2xl font-600 text-ayu-green-500">PROJECTS</h2>
|
<h2 class="text-2xl font-600 text-ayu-green-500 mt-6">PROJECTS</h2>
|
||||||
|
|
||||||
<div class="flex flex-wrap gap-2 py-2">
|
<div class="flex flex-col mb-2">
|
||||||
|
<div class="flex flex-wrap items-center gap-x-1 gap-y-1 mt-1">
|
||||||
|
<!-- <span class="text-sm mr-1 text-ayu-fg opacity-50 font-600"
|
||||||
|
>FILTER:</span
|
||||||
|
> -->
|
||||||
|
<Icon name="mdi:filter" class="w-5 h-5 text-ayu-gutter" />
|
||||||
{
|
{
|
||||||
sortedTags.map((tag) => (
|
sortedTags.map((tag) => (
|
||||||
<span
|
<span
|
||||||
id={`tag-${tag}`}
|
id={`tag-${tag}`}
|
||||||
data-tag={tag}
|
data-tag={tag}
|
||||||
class="no-select cursor-pointer rounded-md border border-ayu-gutter text-ayu-fg px-2 py-0 text-sm font-500"
|
class="no-select cursor-pointer rounded-md border border-ayu-gutter text-ayu-fg px-2 py-0 text-xs font-600"
|
||||||
>
|
>
|
||||||
{tag}
|
{tag}
|
||||||
</span>
|
</span>
|
||||||
))
|
))
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 gap-4 py-2">
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 gap-4 py-2">
|
||||||
{
|
{
|
||||||
projects.map((project) => (
|
projects.map((project) => (
|
||||||
|
|||||||
@@ -11,7 +11,14 @@ export const metadata = {
|
|||||||
url: "https://glimpse.ob248.com",
|
url: "https://glimpse.ob248.com",
|
||||||
github: "https://github.com/hex248/glimpse",
|
github: "https://github.com/hex248/glimpse",
|
||||||
hidden: false,
|
hidden: false,
|
||||||
tags: ["web", "react", "typescript", "postgresql", "blobs", "database"],
|
tags: [
|
||||||
|
"web",
|
||||||
|
"react",
|
||||||
|
"typescript",
|
||||||
|
"postgresql",
|
||||||
|
"blob_storage",
|
||||||
|
"database",
|
||||||
|
],
|
||||||
};
|
};
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user