From 2e21c623204df104af2f7cd64d5b9344c9e2c99c Mon Sep 17 00:00:00 2001 From: David Hill Date: Tue, 16 Dec 2025 11:48:52 +0000 Subject: [PATCH] fix: font size updates --- packages/ui/src/components/markdown.css | 78 ++++++++++++++++++++----- packages/ui/src/styles/theme.css | 6 +- 2 files changed, 66 insertions(+), 18 deletions(-) diff --git a/packages/ui/src/components/markdown.css b/packages/ui/src/components/markdown.css index f9cf3d7c0..892402478 100644 --- a/packages/ui/src/components/markdown.css +++ b/packages/ui/src/components/markdown.css @@ -5,30 +5,70 @@ color: var(--text-base); text-wrap: pretty; - /* text-12-regular */ - font-family: var(--font-family-sans); - font-size: var(--font-size-small); - font-style: normal; - font-weight: var(--font-weight-regular); - line-height: var(--line-height-large); /* 166.667% */ - letter-spacing: var(--letter-spacing-normal); - - h1, - h2, - h3 { - margin-top: 16px; - margin-bottom: 8px; + strong { font-weight: var(--font-weight-medium); } + /* text-12-regular */ + font-family: var(--font-family-sans); + font-size: var(--font-size-base); + font-style: normal; + font-weight: var(--font-weight-regular); + line-height: var(--line-height-large); + letter-spacing: var(--letter-spacing-normal); + + h1 { + margin-top: 40px; + font-weight: var(--font-weight-medium); + color: var(--text-strong); + + strong { + font-weight: var(--font-weight-medium); + } + } + + h2 { + margin-top: 32px; + font-weight: var(--font-weight-medium); + color: var(--text-strong); + + strong { + font-weight: var(--font-weight-medium); + } + } + + h3 { + margin-top: 24px; + font-weight: var(--font-weight-medium); + color: var(--text-strong); + + + strong { + font-weight: var(--font-weight-medium); + } + } + + h1 { + font-size: 15px; + } + p { + margin-top: 16px; margin-bottom: 8px; } ul, ol { margin-top: 16px; - margin-bottom: 16px; + + li { + margin-bottom: 12px; + line-height: var(--line-height-large); + } + + li:last-child { + margin-bottom: 0; + } } hr { @@ -37,6 +77,14 @@ border-color: var(--border-weaker-base); } + .shiki { + font-size: 13px; + background: var(--surface-raised-base) !important; /* temporary fix to test style */ + padding: 8px 12px; + border-radius: 4px; + border: 0.5px solid var(--border-weak-base); + } + pre { margin-top: 2rem; margin-bottom: 2rem; @@ -51,7 +99,7 @@ :not(pre) > code { font-family: var(--font-family-mono); font-feature-settings: var(--font-family-mono--font-feature-settings); - font-size: 0.9em; + font-size: 13px; /* background-color: var(--surface-base-strong); */ /* padding: 0.15em 0.35em; */ /* border-radius: var(--radius-sm); */ diff --git a/packages/ui/src/styles/theme.css b/packages/ui/src/styles/theme.css index 2a095b436..47032f0b4 100644 --- a/packages/ui/src/styles/theme.css +++ b/packages/ui/src/styles/theme.css @@ -10,9 +10,9 @@ --font-size-x-large: 20px; --font-weight-regular: 400; --font-weight-medium: 500; - --line-height-large: 20px; - --line-height-x-large: 24px; - --line-height-2x-large: 30px; + --line-height-large: 150%; + --line-height-x-large: 180%; + --line-height-2x-large: 200%; --letter-spacing-normal: 0; --letter-spacing-tight: -0.1599999964237213; --letter-spacing-tightest: -0.3199999928474426;