diff options
| author | Ogulcan Celik <ogulcancelik@gmail.com> | 2026-06-22 21:15:50 +0300 |
|---|---|---|
| committer | Ogulcan Celik <ogulcancelik@gmail.com> | 2026-06-22 21:16:51 +0300 |
| commit | 705403fe31d8fd935bfebf92cdbdb511350ddbbf (patch) | |
| tree | 15c6cfe121a94ebff271609269adb6e8b5b60b8c /website/src/components | |
| parent | 995a429cb85e7b33e662df61e92d798a600fc317 (diff) | |
feat: add author card to bottom of blog posts
Diffstat (limited to 'website/src/components')
| -rw-r--r-- | website/src/components/AuthorCard.astro | 30 | ||||
| -rw-r--r-- | website/src/components/MarketingLayout.astro | 2 |
2 files changed, 31 insertions, 1 deletions
diff --git a/website/src/components/AuthorCard.astro b/website/src/components/AuthorCard.astro new file mode 100644 index 00000000..75eb9f7e --- /dev/null +++ b/website/src/components/AuthorCard.astro @@ -0,0 +1,30 @@ +--- +const name = 'Can Celik'; +const role = 'Building Herdr'; +const photo = '/assets/author-can.jpeg'; +const x = 'https://x.com/lumendriada'; +const email = 'ogulcancelik@gmail.com'; +--- + +<aside class="author-card" aria-label="About the author"> + <img class="author-photo" src={photo} width="72" height="72" alt={name} loading="lazy" decoding="async" /> + <div class="author-body"> + <p class="author-name">{name}</p> + <p class="author-role">{role}</p> + <div class="author-links"> + <a href={x} target="_blank" rel="me noopener" aria-label={`${name} on X`}> + <svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="currentColor"> + <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" /> + </svg> + <span>X</span> + </a> + <a href={`mailto:${email}`} aria-label={`Email ${name}`}> + <svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"> + <rect x="2.5" y="4.5" width="19" height="15" rx="2" /> + <path d="m3 6 9 7 9-7" /> + </svg> + <span>Email</span> + </a> + </div> + </div> +</aside> diff --git a/website/src/components/MarketingLayout.astro b/website/src/components/MarketingLayout.astro index 381daf03..dfb68ca5 100644 --- a/website/src/components/MarketingLayout.astro +++ b/website/src/components/MarketingLayout.astro @@ -58,7 +58,7 @@ const ogImageUrl = new URL(ogImage, 'https://herdr.dev').toString(); document.documentElement.setAttribute("data-palette", saved || system); })(); </script> - <link rel="stylesheet" href="/css/style.css?v=39" /> + <link rel="stylesheet" href="/css/style.css?v=40" /> </head> <body> <header class="site-header"> |