From 48b51b668cfd86d95add50471291331abd4fcc52 Mon Sep 17 00:00:00 2001 From: Neethika Date: Sun, 12 Apr 2026 15:54:49 -0400 Subject: [PATCH] style(typography): standardize Inter + Space Grotesk across app (ref Sentinent-AI/Sentinent#23) --- src/app/components/login/login.css | 2 -- .../reset-password/reset-password.css | 4 ++-- .../components/workspace/create-workspace.css | 2 +- .../components/workspace/edit-workspace.css | 2 +- src/index.html | 2 +- src/styles.css | 23 ++++++++++++++++++- 6 files changed, 27 insertions(+), 8 deletions(-) diff --git a/src/app/components/login/login.css b/src/app/components/login/login.css index 9b9a3b7..6f887fa 100644 --- a/src/app/components/login/login.css +++ b/src/app/components/login/login.css @@ -7,8 +7,6 @@ --muted: rgba(10, 10, 10, 0.6); --error: #dc2626; --success: #16a34a; - --font-sans: Inter, sans-serif; - --font-display: "Space Grotesk", sans-serif; } :host-context(.dark) { diff --git a/src/app/components/reset-password/reset-password.css b/src/app/components/reset-password/reset-password.css index a0d4734..d9ca8c4 100644 --- a/src/app/components/reset-password/reset-password.css +++ b/src/app/components/reset-password/reset-password.css @@ -5,7 +5,7 @@ radial-gradient(circle at top left, rgba(15, 23, 42, 0.08), transparent 38%), linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%); color: #111827; - font-family: Inter, sans-serif; + font-family: var(--font-sans); } * { @@ -39,7 +39,7 @@ h1 { margin: 0 0 12px; - font-family: "Space Grotesk", sans-serif; + font-family: var(--font-display); font-size: 34px; line-height: 1.05; } diff --git a/src/app/components/workspace/create-workspace.css b/src/app/components/workspace/create-workspace.css index 81da6cf..6e817af 100644 --- a/src/app/components/workspace/create-workspace.css +++ b/src/app/components/workspace/create-workspace.css @@ -3,7 +3,7 @@ background-color: #ffffff; display: flex; flex-direction: column; - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; + font-family: var(--font-sans); } .top-nav { diff --git a/src/app/components/workspace/edit-workspace.css b/src/app/components/workspace/edit-workspace.css index 81da6cf..6e817af 100644 --- a/src/app/components/workspace/edit-workspace.css +++ b/src/app/components/workspace/edit-workspace.css @@ -3,7 +3,7 @@ background-color: #ffffff; display: flex; flex-direction: column; - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; + font-family: var(--font-sans); } .top-nav { diff --git a/src/index.html b/src/index.html index 32dadb0..4f0f3a0 100644 --- a/src/index.html +++ b/src/index.html @@ -8,7 +8,7 @@ - + diff --git a/src/styles.css b/src/styles.css index 6c568d1..e3c616f 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1,13 +1,34 @@ +:root { + --font-sans: "Inter", system-ui, -apple-system, sans-serif; + --font-display: "Space Grotesk", "Inter", sans-serif; +} + html, body { margin: 0; padding: 0; min-height: 100%; - font-family: 'Inter', system-ui, -apple-system, sans-serif; + font-family: var(--font-sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } +h1, +h2, +h3, +h4, +h5, +h6 { + font-family: var(--font-display); +} + +button, +input, +select, +textarea { + font: inherit; +} + *, *::before, *::after {