From 522ea50598acdf614cca0f9bc385036071c0a873 Mon Sep 17 00:00:00 2001
From: Ruud Andriessen <ruud.andriessen@uipath.com>
Date: Fri, 16 Oct 2026 13:41:29 +0200
Subject: [PATCH] fix(apollo-vertex): use type scale sizes in calendar and
 timeline

Calendar weekday headers and week numbers used text-[0.8rem] (12.8px) and
the compact timeline user marker used text-[9px], both outside the type
scale. Move them to text-xs (12px).

Two initials at 12px do not fit the 16px compact marker, so the compact
user marker now shows only the first initial instead of shrinking the
text below the scale or growing every compact marker.
---
 apps/apollo-vertex/content/docs/components/timeline.mdx    | 2 +-
 packages/apollo-vertex/registry/calendar/calendar.tsx      | 4 ++--
 .../apollo-vertex/registry/timeline/timeline-marker.tsx    | 7 ++-----
 3 files changed, 5 insertions(+), 8 deletions(-)

diff --git a/apps/apollo-vertex/content/docs/components/timeline.mdx b/apps/apollo-vertex/content/docs/components/timeline.mdx
index 2fc975feac..f100cb05eb 100644
--- a/apps/apollo-vertex/content/docs/components/timeline.mdx
+++ b/apps/apollo-vertex/content/docs/components/timeline.mdx
@@ -135,7 +135,7 @@ Keep the domain mapping on your side: convert your own state into a `TimelineMar
 | Prop | Type | Default | Description |
 | --- | --- | --- | --- |
 | `variant` | `TimelineMarkerVariant` | — | Required. One of `user`, `completed-user`, `completed-ai`, `ai-upcoming`, `ai-suspended`, `ai-progress`, `ai-failed`, `ai-cancelled`, `ai-complete`. |
-| `initials` | `string` | — | Shown inside the `user` marker, falling back to `"?"` when omitted. Ignored by other variants. |
+| `initials` | `string` | — | Shown inside the `user` marker, falling back to `"?"` when omitted. The compact size shows only the first character. Ignored by other variants. |
 | `compact` | `boolean` | `false` | Render the smaller size for dense trails. |
 
 ## TimelineRowLayout props
diff --git a/packages/apollo-vertex/registry/calendar/calendar.tsx b/packages/apollo-vertex/registry/calendar/calendar.tsx
index 93a979ea53..80bfc69c07 100644
--- a/packages/apollo-vertex/registry/calendar/calendar.tsx
+++ b/packages/apollo-vertex/registry/calendar/calendar.tsx
@@ -89,7 +89,7 @@ function Calendar({
         ),
         weekdays: cn("flex", defaultClassNames.weekdays),
         weekday: cn(
-          "text-muted-foreground rounded-md flex-1 font-normal text-[0.8rem] select-none",
+          "text-muted-foreground rounded-md flex-1 font-normal text-xs select-none",
           defaultClassNames.weekday,
         ),
         week: cn("flex w-full mt-2", defaultClassNames.week),
@@ -98,7 +98,7 @@ function Calendar({
           defaultClassNames.week_number_header,
         ),
         week_number: cn(
-          "text-[0.8rem] select-none text-muted-foreground",
+          "text-xs select-none text-muted-foreground",
           defaultClassNames.week_number,
         ),
         day: cn(
diff --git a/packages/apollo-vertex/registry/timeline/timeline-marker.tsx b/packages/apollo-vertex/registry/timeline/timeline-marker.tsx
index 0edd0ee57b..7b0988a0ac 100644
--- a/packages/apollo-vertex/registry/timeline/timeline-marker.tsx
+++ b/packages/apollo-vertex/registry/timeline/timeline-marker.tsx
@@ -70,12 +70,9 @@ export function TimelineMarker({
       return (
         <MarkerCircle
           compact={compact}
-          className={cn(
-            "bg-muted font-medium text-muted-foreground shadow-sm",
-            compact ? "text-[9px]" : "text-xs",
-          )}
+          className="bg-muted text-xs font-medium text-muted-foreground shadow-sm"
         >
-          {initials ?? "?"}
+          {(compact ? initials?.[0] : initials) ?? "?"}
         </MarkerCircle>
       );