Antares/com.gregkilmer.www
1
0
Fork 0
mirror of https://github.com/Patiun/com.gregkilmer.www.git synced 2026-11-08 04:08:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

Content Updates with projects and experience

Browse Source
This commit is contained in:
Greg Kilmer
2026-07-04 18:03:38 -04:00
parent 1e8f5f1f01
commit 35d561525f
29 changed files with 347 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/professional/Timeline.astro
+16 -11
View File
@@ -43,23 +43,28 @@ const rendered = await Promise.all(
{rendered.map(({ entry, Content }, i) => (
<li class="relative pl-12">
<Reveal delay={i * 80}>
{/* Marker */}
{/* Marker dot on the timeline line (kept small; the icon now lives inline
with the company name inside the card so it never clips the card). */}
<span
class="absolute left-0 top-0 inline-flex h-9 w-9 items-center justify-center rounded-full border-4"
style="background: var(--color-surface-raised); border-color: var(--color-surface);"
class="absolute left-[1.15rem] top-7 h-3 w-3 -translate-x-1/2 rounded-full"
style="background: var(--color-accent); box-shadow: 0 0 0 4px var(--color-surface);"
aria-hidden="true"
>
<span
class="inline-flex h-9 w-9 items-center justify-center rounded-full"
style="background: color-mix(in srgb, var(--color-accent) 16%, transparent);"
>
<Icon name={entry.data.icon} class="h-4 w-4" />
</span>
</span>
<div class="card flex flex-col gap-3">
<div class="flex flex-wrap items-baseline justify-between gap-x-4 gap-y-1">
<h3 style="color: var(--color-text);">{entry.data.company}</h3>
{/* Header row: icon + company name inline, period on the right. */}
<div class="flex flex-wrap items-center justify-between gap-x-4 gap-y-1">
<h3 class="flex items-center gap-3" style="color: var(--color-text);">
<span
class="inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-full"
style="background: color-mix(in srgb, var(--color-accent) 16%, transparent);"
aria-hidden="true"
>
<Icon name={entry.data.icon} class="h-5 w-5" style="color: var(--color-accent);" />
</span>
{entry.data.company}
</h3>
<span class="font-mono text-xs uppercase tracking-[0.18em]" style="color: var(--color-text-subtle);">
{entry.data.period}
</span>