mirror of
https://github.com/anotherhadi/blog.git
synced 2026-05-20 13:32:33 +02:00
format
Signed-off-by: Hadi <112569860+anotherhadi@users.noreply.github.com>
This commit is contained in:
Hadi
@@ -1,18 +1,26 @@
|
||||
---
|
||||
import { Image } from "astro:assets";
|
||||
const avatar = "/avatar.jpg";
|
||||
const username = "anotherhadi"
|
||||
const bio = "Infosec engineer."
|
||||
|
||||
const username = "anotherhadi";
|
||||
const bio = "Infosec engineer.";
|
||||
---
|
||||
|
||||
<div class="flex flex-wrap gap-3 justify-start">
|
||||
<div
|
||||
class="ring-base-300 ring-offset-base-100 rounded-full ring-2 ring-offset-2 flex justify-center items-center"
|
||||
>
|
||||
<Image src={avatar} alt="anotherhadi avatar" class="rounded-full m-auto" width={36} height={36}/>
|
||||
<Image
|
||||
src={avatar}
|
||||
alt="anotherhadi avatar"
|
||||
class="rounded-full m-auto"
|
||||
width={36}
|
||||
height={36}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-sm font-semibold"><a href="/"><span class="text-base-content/40">@</span>{username}</a></p>
|
||||
<p class="text-sm font-semibold">
|
||||
<a href="/"><span class="text-base-content/40">@</span>{username}</a>
|
||||
</p>
|
||||
<p class="text-xs text-base-content/60">{bio}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -19,8 +19,12 @@ interface Props {
|
||||
const { repo } = Astro.props;
|
||||
|
||||
const platforms = [
|
||||
...(repo.mirrors.github ? [{ label: "GitHub", url: repo.mirrors.github }] : []),
|
||||
...(repo.mirrors.gitlab ? [{ label: "GitLab", url: repo.mirrors.gitlab }] : []),
|
||||
...(repo.mirrors.github
|
||||
? [{ label: "GitHub", url: repo.mirrors.github }]
|
||||
: []),
|
||||
...(repo.mirrors.gitlab
|
||||
? [{ label: "GitLab", url: repo.mirrors.gitlab }]
|
||||
: []),
|
||||
{ label: "Gitea", url: repo.html_url },
|
||||
];
|
||||
|
||||
@@ -46,64 +50,70 @@ const hasMultiplePlatforms = platforms.length > 1;
|
||||
</a>
|
||||
</h2>
|
||||
|
||||
{repo.description && (
|
||||
<p class="text-base-content/80">{repo.description}</p>
|
||||
)}
|
||||
{repo.description && <p class="text-base-content/80">{repo.description}</p>}
|
||||
|
||||
<div class="flex flex-wrap gap-2 mt-2">
|
||||
{repo.topics.map((topic) => (
|
||||
<span class="badge badge-sm rounded-sm badge-soft badge-accent">
|
||||
{topic}
|
||||
</span>
|
||||
))}
|
||||
{
|
||||
repo.topics.map((topic) => (
|
||||
<span class="badge badge-sm rounded-sm badge-soft badge-accent">
|
||||
{topic}
|
||||
</span>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
|
||||
<div class="card-actions justify-end mt-4 gap-2">
|
||||
{repo.website && (
|
||||
|
||||
<a
|
||||
href={repo.website}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="btn btn-soft btn-sm gap-1"
|
||||
>
|
||||
<ExternalLink class="size-4" />
|
||||
Website
|
||||
</a>
|
||||
)}
|
||||
|
||||
{hasMultiplePlatforms ? (
|
||||
<div class="dropdown dropdown-end">
|
||||
<div tabindex="0" role="button" class="btn btn-primary btn-sm gap-1">
|
||||
<ExternalLink class="size-4" />
|
||||
View Source
|
||||
<ChevronDown class="size-3" />
|
||||
</div>
|
||||
<ul
|
||||
tabindex="0"
|
||||
class="dropdown-content menu bg-base-100 rounded-xl z-10 w-36 p-1.5 shadow border border-base-200 text-sm"
|
||||
{
|
||||
repo.website && (
|
||||
<a
|
||||
href={repo.website}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="btn btn-soft btn-sm gap-1"
|
||||
>
|
||||
{platforms.map(({ label, url }) => (
|
||||
<li>
|
||||
<a href={url} target="_blank" rel="noopener noreferrer">
|
||||
{label}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
) : (
|
||||
|
||||
<a
|
||||
href={repo.html_url}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="btn btn-primary btn-sm gap-1"
|
||||
>
|
||||
<ExternalLink class="size-4" />
|
||||
View on Gitea
|
||||
</a>
|
||||
)}
|
||||
<ExternalLink class="size-4" />
|
||||
Website
|
||||
</a>
|
||||
)
|
||||
}
|
||||
|
||||
{
|
||||
hasMultiplePlatforms ? (
|
||||
<div class="dropdown dropdown-end">
|
||||
<div
|
||||
tabindex="0"
|
||||
role="button"
|
||||
class="btn btn-primary btn-sm gap-1"
|
||||
>
|
||||
<ExternalLink class="size-4" />
|
||||
View Source
|
||||
<ChevronDown class="size-3" />
|
||||
</div>
|
||||
<ul
|
||||
tabindex="0"
|
||||
class="dropdown-content menu bg-base-100 rounded-xl z-10 w-36 p-1.5 shadow border border-base-200 text-sm"
|
||||
>
|
||||
{platforms.map(({ label, url }) => (
|
||||
<li>
|
||||
<a href={url} target="_blank" rel="noopener noreferrer">
|
||||
{label}
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
) : (
|
||||
<a
|
||||
href={repo.html_url}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="btn btn-primary btn-sm gap-1"
|
||||
>
|
||||
<ExternalLink class="size-4" />
|
||||
View on Gitea
|
||||
</a>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
+36
-22
@@ -25,8 +25,16 @@ interface Props {
|
||||
rssFeed?: string;
|
||||
}
|
||||
|
||||
const { name, title, description, avatar, location, socialLinks, gpgKey, rssFeed } =
|
||||
Astro.props;
|
||||
const {
|
||||
name,
|
||||
title,
|
||||
description,
|
||||
avatar,
|
||||
location,
|
||||
socialLinks,
|
||||
gpgKey,
|
||||
rssFeed,
|
||||
} = Astro.props;
|
||||
---
|
||||
|
||||
<section class="hero min-h-[65vh]">
|
||||
@@ -80,34 +88,40 @@ const { name, title, description, avatar, location, socialLinks, gpgKey, rssFeed
|
||||
class="btn btn-circle btn-ghost"
|
||||
aria-label="Gitlab"
|
||||
>
|
||||
<svg
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
fill="currentColor"
|
||||
role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="m23.6004 9.5927-.0337-.0862L20.3.9814a.851.851 0 0 0-.3362-.405.8748.8748 0 0 0-.9997.0539.8748.8748 0 0 0-.29.4399l-2.2055 6.748H7.5375l-2.2057-6.748a.8573.8573 0 0 0-.29-.4412.8748.8748 0 0 0-.9997-.0537.8585.8585 0 0 0-.3362.4049L.4332 9.5015l-.0325.0862a6.0657 6.0657 0 0 0 2.0119 7.0105l.0113.0087.03.0213 4.976 3.7264 2.462 1.8633 1.4995 1.1321a1.0085 1.0085 0 0 0 1.2197 0l1.4995-1.1321 2.4619-1.8633 5.006-3.7489.0125-.01a6.0682 6.0682 0 0 0 2.0094-7.003z"/>
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="m23.6004 9.5927-.0337-.0862L20.3.9814a.851.851 0 0 0-.3362-.405.8748.8748 0 0 0-.9997.0539.8748.8748 0 0 0-.29.4399l-2.2055 6.748H7.5375l-2.2057-6.748a.8573.8573 0 0 0-.29-.4412.8748.8748 0 0 0-.9997-.0537.8585.8585 0 0 0-.3362.4049L.4332 9.5015l-.0325.0862a6.0657 6.0657 0 0 0 2.0119 7.0105l.0113.0087.03.0213 4.976 3.7264 2.462 1.8633 1.4995 1.1321a1.0085 1.0085 0 0 0 1.2197 0l1.4995-1.1321 2.4619-1.8633 5.006-3.7489.0125-.01a6.0682 6.0682 0 0 0 2.0094-7.003z" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
{socialLinks.gitea && (
|
||||
<div class="tooltip" data-tip="Gitea">
|
||||
<a
|
||||
href={socialLinks.gitea}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="btn btn-circle btn-ghost"
|
||||
aria-label="Gitea"
|
||||
>
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
fill="currentColor"
|
||||
role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4.209 4.603c-.247 0-.525.02-.84.088-.333.07-1.28.283-2.054 1.027C-.403 7.25.035 9.685.089 10.052c.065.446.263 1.687 1.21 2.768 1.749 2.141 5.513 2.092 5.513 2.092s.462 1.103 1.168 2.119c.955 1.263 1.936 2.248 2.89 2.367 2.406 0 7.212-.004 7.212-.004s.458.004 1.08-.394c.535-.324 1.013-.893 1.013-.893s.492-.527 1.18-1.73c.21-.37.385-.729.538-1.068 0 0 2.107-4.471 2.107-8.823-.042-1.318-.367-1.55-.443-1.627-.156-.156-.366-.153-.366-.153s-4.475.252-6.792.306c-.508.011-1.012.023-1.512.027v4.474l-.634-.301c0-1.39-.004-4.17-.004-4.17-1.107.016-3.405-.084-3.405-.084s-5.399-.27-5.987-.324c-.187-.011-.401-.032-.648-.032zm.354 1.832h.111s.271 2.269.6 3.597C5.549 11.147 6.22 13 6.22 13s-.996-.119-1.641-.348c-.99-.324-1.409-.714-1.409-.714s-.73-.511-1.096-1.52C1.444 8.73 2.021 7.7 2.021 7.7s.32-.859 1.47-1.145c.395-.106.863-.12 1.072-.12zm8.33 2.554c.26.003.509.127.509.127l.868.422-.529 1.075a.686.686 0 0 0-.614.359.685.685 0 0 0 .072.756l-.939 1.924a.69.69 0 0 0-.66.527.687.687 0 0 0 .347.763.686.686 0 0 0 .867-.206.688.688 0 0 0-.069-.882l.916-1.874a.667.667 0 0 0 .237-.02.657.657 0 0 0 .271-.137 8.826 8.826 0 0 1 1.016.512.761.761 0 0 1 .286.282c.073.21-.073.569-.073.569-.087.29-.702 1.55-.702 1.55a.692.692 0 0 0-.676.477.681.681 0 1 0 1.157-.252c.073-.141.141-.282.214-.431.19-.397.515-1.16.515-1.16.035-.066.218-.394.103-.814-.095-.435-.48-.638-.48-.638-.467-.301-1.116-.58-1.116-.58s0-.156-.042-.27a.688.688 0 0 0-.148-.241l.516-1.062 2.89 1.401s.48.218.583.619c.073.282-.019.534-.069.657-.24.587-2.1 4.317-2.1 4.317s-.232.554-.748.588a1.065 1.065 0 0 1-.393-.045l-.202-.08-4.31-2.1s-.417-.218-.49-.596c-.083-.31.104-.691.104-.691l2.073-4.272s.183-.37.466-.497a.855.855 0 0 1 .35-.077z"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<div class="tooltip" data-tip="Gitea">
|
||||
<a
|
||||
href={socialLinks.gitea}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="btn btn-circle btn-ghost"
|
||||
aria-label="Gitea"
|
||||
>
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
fill="currentColor"
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M4.209 4.603c-.247 0-.525.02-.84.088-.333.07-1.28.283-2.054 1.027C-.403 7.25.035 9.685.089 10.052c.065.446.263 1.687 1.21 2.768 1.749 2.141 5.513 2.092 5.513 2.092s.462 1.103 1.168 2.119c.955 1.263 1.936 2.248 2.89 2.367 2.406 0 7.212-.004 7.212-.004s.458.004 1.08-.394c.535-.324 1.013-.893 1.013-.893s.492-.527 1.18-1.73c.21-.37.385-.729.538-1.068 0 0 2.107-4.471 2.107-8.823-.042-1.318-.367-1.55-.443-1.627-.156-.156-.366-.153-.366-.153s-4.475.252-6.792.306c-.508.011-1.012.023-1.512.027v4.474l-.634-.301c0-1.39-.004-4.17-.004-4.17-1.107.016-3.405-.084-3.405-.084s-5.399-.27-5.987-.324c-.187-.011-.401-.032-.648-.032zm.354 1.832h.111s.271 2.269.6 3.597C5.549 11.147 6.22 13 6.22 13s-.996-.119-1.641-.348c-.99-.324-1.409-.714-1.409-.714s-.73-.511-1.096-1.52C1.444 8.73 2.021 7.7 2.021 7.7s.32-.859 1.47-1.145c.395-.106.863-.12 1.072-.12zm8.33 2.554c.26.003.509.127.509.127l.868.422-.529 1.075a.686.686 0 0 0-.614.359.685.685 0 0 0 .072.756l-.939 1.924a.69.69 0 0 0-.66.527.687.687 0 0 0 .347.763.686.686 0 0 0 .867-.206.688.688 0 0 0-.069-.882l.916-1.874a.667.667 0 0 0 .237-.02.657.657 0 0 0 .271-.137 8.826 8.826 0 0 1 1.016.512.761.761 0 0 1 .286.282c.073.21-.073.569-.073.569-.087.29-.702 1.55-.702 1.55a.692.692 0 0 0-.676.477.681.681 0 1 0 1.157-.252c.073-.141.141-.282.214-.431.19-.397.515-1.16.515-1.16.035-.066.218-.394.103-.814-.095-.435-.48-.638-.48-.638-.467-.301-1.116-.58-1.116-.58s0-.156-.042-.27a.688.688 0 0 0-.148-.241l.516-1.062 2.89 1.401s.48.218.583.619c.073.282-.019.534-.069.657-.24.587-2.1 4.317-2.1 4.317s-.232.554-.748.588a1.065 1.065 0 0 1-.393-.045l-.202-.08-4.31-2.1s-.417-.218-.49-.596c-.083-.31.104-.691.104-.691l2.073-4.272s.183-.37.466-.497a.855.855 0 0 1 .35-.077z" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
{socialLinks.linkedin && (
|
||||
<div class="tooltip" data-tip="Linkedin">
|
||||
|
||||
@@ -18,7 +18,9 @@ function isActive(href: string) {
|
||||
class="fixed top-0 left-0 right-0 z-[60] h-12 flex items-center px-5"
|
||||
style="background: oklch(0% 0 0 / 0.85); backdrop-filter: blur(12px); border-bottom: 1px solid oklch(22% 0 0);"
|
||||
>
|
||||
<div class="flex items-center justify-between w-full max-w-screen-xl mx-auto">
|
||||
<div
|
||||
class="flex items-center justify-between w-full max-w-screen-2xl mx-auto"
|
||||
>
|
||||
<a
|
||||
href="/"
|
||||
class="font-mono text-sm text-base-content/40 hover:text-primary transition-colors duration-200 tracking-tight"
|
||||
@@ -26,7 +28,8 @@ function isActive(href: string) {
|
||||
~/hadi
|
||||
</a>
|
||||
|
||||
<div id="oneko-track" class="flex-1 relative h-12 pointer-events-none"></div>
|
||||
<div id="oneko-track" class="flex-1 relative h-12 pointer-events-none">
|
||||
</div>
|
||||
|
||||
<nav class="hidden md:flex items-center">
|
||||
{
|
||||
@@ -58,9 +61,15 @@ function isActive(href: string) {
|
||||
class="md:hidden flex flex-col gap-1 p-2 text-base-content/40 hover:text-base-content/70 transition-colors"
|
||||
aria-label="Toggle menu"
|
||||
>
|
||||
<span class="hamburger-line block w-4 h-px bg-current transition-all duration-200"></span>
|
||||
<span class="hamburger-line block w-4 h-px bg-current transition-all duration-200"></span>
|
||||
<span class="hamburger-line block w-4 h-px bg-current transition-all duration-200"></span>
|
||||
<span
|
||||
class="hamburger-line block w-4 h-px bg-current transition-all duration-200"
|
||||
></span>
|
||||
<span
|
||||
class="hamburger-line block w-4 h-px bg-current transition-all duration-200"
|
||||
></span>
|
||||
<span
|
||||
class="hamburger-line block w-4 h-px bg-current transition-all duration-200"
|
||||
></span>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
@@ -113,7 +122,11 @@ function isActive(href: string) {
|
||||
});
|
||||
|
||||
document.addEventListener("click", (e) => {
|
||||
if (open && !btn.contains(e.target as Node) && !menu.contains(e.target as Node)) {
|
||||
if (
|
||||
open &&
|
||||
!btn.contains(e.target as Node) &&
|
||||
!menu.contains(e.target as Node)
|
||||
) {
|
||||
open = false;
|
||||
menu.style.display = "none";
|
||||
lines[0].style.transform = "";
|
||||
|
||||
Reference in New Issue
Block a user