diff --git a/web/src/app.css b/web/src/app.css index 934bc84f..b9245093 100644 --- a/web/src/app.css +++ b/web/src/app.css @@ -13,38 +13,6 @@ here; dark-mode overrides live in the prefers-color-scheme block below. ========================================================================= */ - /* --- typography — synced from Figma "Font Styles" (node 1:186) --- */ - --text-heading-0: 5rem; - --text-heading-0--line-height: 5rem; - --text-heading-0--font-weight: 600; - --text-heading-0--letter-spacing: -0.25px; - --text-heading-1: 3rem; - --text-heading-1--line-height: 3.5rem; - --text-heading-1--font-weight: 500; - --text-heading-2: 1.875rem; - --text-heading-2--line-height: 1.875rem; - --text-heading-2--font-weight: 600; - --text-heading-3: 1.5rem; - --text-heading-3--line-height: 1.875rem; - --text-heading-3--font-weight: 500; - --text-heading-4: 1.25rem; - --text-heading-4--line-height: 1.75rem; - --text-heading-4--font-weight: 500; - --text-paragraph-large: 1rem; - --text-paragraph-large--line-height: 1.6875rem; - --text-paragraph-regular: 0.875rem; - --text-paragraph-regular--line-height: 1.5rem; - --text-paragraph-small: 0.75rem; - --text-paragraph-small--line-height: 1.25rem; - --text-paragraph-mini: 0.625rem; - --text-paragraph-mini--line-height: 1rem; - --text-monospace-large: 1rem; - --text-monospace-large--line-height: 1.5rem; - --text-monospace-regular: 0.875rem; - --text-monospace-regular--line-height: 1.375rem; - --text-monospace-small: 0.75rem; - --text-monospace-small--line-height: 1.25rem; - /* --- background --- */ --color-background-default: #ffffff; --color-background-subtle: #f9fafb; @@ -159,6 +127,83 @@ --color-alpha-dark-95: color-mix(in srgb, var(--color-foreground-default) 95%, transparent); } +/* ============================================================================= + Type scale — synced from Figma "Font Styles" (node 1:186) + + These are `typography-*` utilities rather than `--text-*` theme tokens on + purpose: named `text-heading-3` & co. they collided with `text-` in + tailwind-merge, which classes them as colours and drops the size as soon as a + colour follows. Declare `font-size` first in each block — Tailwind sorts a + custom utility by its first property, and that is what keeps an explicit + `font-medium`/`font-bold` winning over the weight baked in here. + ============================================================================= */ + +@utility typography-heading-0 { + font-size: 5rem; + line-height: 5rem; + font-weight: 600; + letter-spacing: -0.25px; +} + +@utility typography-heading-1 { + font-size: 3rem; + line-height: 3.5rem; + font-weight: 500; +} + +@utility typography-heading-2 { + font-size: 1.875rem; + line-height: 1.875rem; + font-weight: 600; +} + +@utility typography-heading-3 { + font-size: 1.5rem; + line-height: 1.875rem; + font-weight: 500; +} + +@utility typography-heading-4 { + font-size: 1.25rem; + line-height: 1.75rem; + font-weight: 500; +} + +@utility typography-paragraph-large { + font-size: 1rem; + line-height: 1.6875rem; +} + +@utility typography-paragraph-regular { + font-size: 0.875rem; + line-height: 1.5rem; +} + +@utility typography-paragraph-small { + font-size: 0.75rem; + line-height: 1.25rem; +} + +@utility typography-paragraph-mini { + font-size: 0.625rem; + line-height: 1rem; +} + +@utility typography-monospace-large { + font-size: 1rem; + line-height: 1.5rem; +} + +@utility typography-monospace-regular { + font-size: 0.875rem; + line-height: 1.375rem; +} + +@utility typography-monospace-small { + font-size: 0.75rem; + line-height: 1.25rem; +} + @layer base { @font-face { font-family: "InterVariable"; diff --git a/web/src/lib/components/home/MarketingHome.svelte b/web/src/lib/components/home/MarketingHome.svelte index baadeb11..5dd94733 100644 --- a/web/src/lib/components/home/MarketingHome.svelte +++ b/web/src/lib/components/home/MarketingHome.svelte @@ -14,7 +14,7 @@ {#snippet marketingButton(label: string, showArrow: boolean, className: string)} {#if relation.failed} -

+

Something went wrong. Try again.

{/if} diff --git a/web/src/lib/components/profile/ProfileCard.svelte b/web/src/lib/components/profile/ProfileCard.svelte index 326af57c..3c4a578f 100644 --- a/web/src/lib/components/profile/ProfileCard.svelte +++ b/web/src/lib/components/profile/ProfileCard.svelte @@ -53,7 +53,7 @@

{identity.handle}

@@ -79,7 +79,7 @@ {:else}
{#if shown?.description} -

{shown.description}

+

{shown.description}

{/if} {#if error} -

{error}

+

{error}

{/if}
diff --git a/web/src/lib/components/profile/StringCardContent.svelte b/web/src/lib/components/profile/StringCardContent.svelte index 30a50214..20f14264 100644 --- a/web/src/lib/components/profile/StringCardContent.svelte +++ b/web/src/lib/components/profile/StringCardContent.svelte @@ -23,7 +23,7 @@ {/if}
{entry.lines} line{entry.lines === 1 ? "" : "s"} · {compactRelativeTime( diff --git a/web/src/lib/components/profile/tabs/OverviewTab.svelte b/web/src/lib/components/profile/tabs/OverviewTab.svelte index 7198b39c..b82a2430 100644 --- a/web/src/lib/components/profile/tabs/OverviewTab.svelte +++ b/web/src/lib/components/profile/tabs/OverviewTab.svelte @@ -25,7 +25,7 @@
-

Activity

+

Activity

diff --git a/web/src/lib/components/repo/BranchList.svelte b/web/src/lib/components/repo/BranchList.svelte index cf7378c7..dd3f70c8 100644 --- a/web/src/lib/components/repo/BranchList.svelte +++ b/web/src/lib/components/repo/BranchList.svelte @@ -20,7 +20,7 @@
{#each branches as branch (branch.name)} -
+
{/if} {#if branch.isDefault} diff --git a/web/src/lib/components/repo/CloneDropdown.svelte b/web/src/lib/components/repo/CloneDropdown.svelte index 72a75ff0..a2a24cfc 100644 --- a/web/src/lib/components/repo/CloneDropdown.svelte +++ b/web/src/lib/components/repo/CloneDropdown.svelte @@ -74,7 +74,7 @@

Clone this repository

{#if repo.repoDid} - + Use permalink {/if} @@ -83,7 +83,7 @@ {#each urls as entry (entry.label)} {@const value = permalink && entry.perma ? entry.perma : entry.handle}
- {entry.label}
{/each} -

+

For self-hosted knots, clone URLs may differ based on your setup.

diff --git a/web/src/lib/components/repo/CommitList.svelte b/web/src/lib/components/repo/CommitList.svelte index e249809f..6d898306 100644 --- a/web/src/lib/components/repo/CommitList.svelte +++ b/web/src/lib/components/repo/CommitList.svelte @@ -24,7 +24,7 @@
{commit.subject} @@ -46,7 +46,7 @@ {/if}
{n} diff --git a/web/src/lib/components/repo/LanguageBar.svelte b/web/src/lib/components/repo/LanguageBar.svelte index 1c4e22dc..2bb5d470 100644 --- a/web/src/lib/components/repo/LanguageBar.svelte +++ b/web/src/lib/components/repo/LanguageBar.svelte @@ -29,7 +29,7 @@ class="flex flex-wrap items-center justify-center gap-4 border-b border-border-default px-4 py-2" > {#each languages as language (language.name)} -
+
{commit.shortHash} diff --git a/web/src/lib/components/repo/RepoCardContent.svelte b/web/src/lib/components/repo/RepoCardContent.svelte index f1e07b52..10ec9b0f 100644 --- a/web/src/lib/components/repo/RepoCardContent.svelte +++ b/web/src/lib/components/repo/RepoCardContent.svelte @@ -53,7 +53,7 @@ {#if repo.language !== undefined || stats.length > 0}
{#if repo.language} diff --git a/web/src/lib/components/repo/RepoHeader.svelte b/web/src/lib/components/repo/RepoHeader.svelte index 2354c520..f4a21ef4 100644 --- a/web/src/lib/components/repo/RepoHeader.svelte +++ b/web/src/lib/components/repo/RepoHeader.svelte @@ -28,7 +28,7 @@
-
+
{#if failed} -

+

Something went wrong. Try again.

{/if} diff --git a/web/src/lib/components/repo/TagList.svelte b/web/src/lib/components/repo/TagList.svelte index 0abc37a3..8ba5928a 100644 --- a/web/src/lib/components/repo/TagList.svelte +++ b/web/src/lib/components/repo/TagList.svelte @@ -18,7 +18,7 @@
{#each tags as tag, index (tag.name)}
-
+
{#if tag.when} - + {/if} {#if index === 0} Latest diff --git a/web/src/lib/components/repo/issues/IssueHeader.svelte b/web/src/lib/components/repo/issues/IssueHeader.svelte index a6484169..bc45a2ba 100644 --- a/web/src/lib/components/repo/issues/IssueHeader.svelte +++ b/web/src/lib/components/repo/issues/IssueHeader.svelte @@ -9,7 +9,7 @@
-

+

{title} #{rkey}

diff --git a/web/src/lib/components/repo/issues/IssueStatePill.svelte b/web/src/lib/components/repo/issues/IssueStatePill.svelte index 3098e842..a8e752b6 100644 --- a/web/src/lib/components/repo/issues/IssueStatePill.svelte +++ b/web/src/lib/components/repo/issues/IssueStatePill.svelte @@ -1,5 +1,5 @@
-

Profile

+

Profile

Your account information from your AT Protocol identity.

diff --git a/web/src/lib/components/settings/tabs/SitesTab.svelte b/web/src/lib/components/settings/tabs/SitesTab.svelte index 1c0d1d70..96ffc375 100644 --- a/web/src/lib/components/settings/tabs/SitesTab.svelte +++ b/web/src/lib/components/settings/tabs/SitesTab.svelte @@ -1,4 +1,4 @@
-

Git sites

+

Git sites

diff --git a/web/src/lib/components/settings/tabs/SpindlesTab.svelte b/web/src/lib/components/settings/tabs/SpindlesTab.svelte index 182bcfc6..68d5a259 100644 --- a/web/src/lib/components/settings/tabs/SpindlesTab.svelte +++ b/web/src/lib/components/settings/tabs/SpindlesTab.svelte @@ -1,5 +1,5 @@
-

Spindles

+

Spindles

Spindles are servers that run continuous integration pipelines for your repositories.

diff --git a/web/src/lib/components/shell/Footer.svelte b/web/src/lib/components/shell/Footer.svelte index 234dced6..4a681f93 100644 --- a/web/src/lib/components/shell/Footer.svelte +++ b/web/src/lib/components/shell/Footer.svelte @@ -46,7 +46,7 @@ const appPath = (path: string) => resolve(path as "/"); const headerStyle = "text-foreground-default font-bold text-sm tracking-wide mb-1"; const mobileHeaderStyle = - "text-foreground-default font-bold text-paragraph-small tracking-wide mb-1"; + "text-foreground-default font-bold typography-paragraph-small tracking-wide mb-1"; const linkStyle = "inline-flex items-center gap-1 text-foreground-subtle hover:text-foreground-default hover:underline"; const minimalLinkStyle = "text-foreground-subtle hover:text-foreground-default hover:underline"; @@ -405,7 +405,7 @@
-
+
© 2026 Tangled Labs Oy. All rights reserved.
@@ -439,7 +439,7 @@
-
+
© 2026 Tangled Labs Oy. All rights reserved.
diff --git a/web/src/lib/components/ui/Button.svelte b/web/src/lib/components/ui/Button.svelte index e3fe8220..fffff130 100644 --- a/web/src/lib/components/ui/Button.svelte +++ b/web/src/lib/components/ui/Button.svelte @@ -1,5 +1,5 @@
{message}{@render children?.()}
diff --git a/web/src/lib/components/ui/Error.svelte b/web/src/lib/components/ui/Error.svelte index 4f97f026..7b3fdd77 100644 --- a/web/src/lib/components/ui/Error.svelte +++ b/web/src/lib/components/ui/Error.svelte @@ -1,5 +1,5 @@