feat(editor): Update fonts - #36485
Conversation
PR review overviewBased on ownership of the 13 changed files in this PR:
|
Bundle ReportChanges will decrease total bundle size by 827.53kB (-1.54%) ⬇️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: editor-ui-esmAssets Changed:
|
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
There was a problem hiding this comment.
All reported issues were addressed across 21 files
Architecture diagram
sequenceDiagram
participant DS as Design System Package
participant CSS as CSS Build (fonts.scss)
participant FS as Font Assets (EK Baumer woff/)
participant APP as App Surfaces (MCP, Editor)
participant SB as Storybook Styleguide
participant GEN as Font Character Generator (script)
Note over DS,CSS: Runtime Font Loading & Styleguide Flow
%% Font loading - Baumer
APP->>DS: @use design-system css/fonts/baumer
DS->>CSS: Load fonts.scss
CSS->>FS: url() fetch Baumer woff2 files
FS-->>CSS: Font data
CSS-->>APP: Declared font-family: Baumer
%% Font loading - Baumer Mono
APP->>DS: @use design-system css/fonts/baumer-mono
DS->>CSS: Load baumer-mono.scss
CSS->>FS: url() fetch Baumer Mono woff2 files
FS-->>CSS: Font data
CSS-->>APP: Declared font-family: Baumer Mono
%% Legacy fonts loaded only in Styleguide
Note over DS,SB: Legacy Inter/CommitMono for comparisons
SB->>DS: Load styleguide components
DS->>CSS: Load inter.scss (legacy)
CSS->>FS: url() fetch InterVariable woff2
CSS->>FS: url() fetch CommitMono woff2
FS-->>CSS: Font data
%% Styleguide grid flow
SB->>GEN: Locale character blocks data
GEN-->SB: Unicode blocks (Basic Latin, Greek, Punctuation, etc.)
SB->>SB: Render FontsCharacterGrid (light + dark themes)
SB-->>CSS: font-family: Baumer / Baumer Mono for preview
alt Local font files missing
CSS->>FS: url() request fails
FS-->>CSS: 404 / missing asset
Note over CSS,APP: App builds fail (README documents requirement)
end
Reply with feedback, questions, or to request a fix.
Fix all with cubic | Re-trigger cubic
Codecov Report❌ Patch coverage is 📢 Thoughts on this report? Let us know! |
There was a problem hiding this comment.
All reported issues were addressed across 5 files (changes from recent commits).
Tip: Review your code locally with the cubic CLI to iterate faster.
Fix all with cubic | Re-trigger cubic
There was a problem hiding this comment.
1 issue found across 22 files (changes from recent commits).
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="packages/frontend/@n8n/design-system/vite.config.mts">
<violation number="1">
P3: The revised comment says the `url('../../assets/fonts/…')` in `fonts.scss` keeps resolving, but `fonts.scss` currently contains no such URL — it only `@use`s `./fonts/baumer` and `./fonts/baumer-mono`, which are placeholder comments for locally installed fonts. Only `icon.scss` has the `url('../../assets/fonts/...')` pattern today. Wording the comment as if `fonts.scss` ships that URL now is misleading; it describes the future state, not the current code.</violation>
</file>
Tip: Review your code locally with the cubic CLI to iterate faster.
Fix all with cubic | Re-trigger cubic
| @@ -0,0 +1,2 @@ | |||
| // Rebrand: uses locally installed Baumer. Come back and add served @font-face | |||
There was a problem hiding this comment.
is this still up to date? Sounds like we don't have a license to use these? 😰
There was a problem hiding this comment.
@CharlieKolb we don't at the moment, so the font files are not included – when we're ready to go live, the license will be purchased and files added.
There was a problem hiding this comment.
Ah you're targeting a feature branch again now, gotcha. Thought we were about to merge to master
There was a problem hiding this comment.
@CharlieKolb ah sorry yes, I'd mistakenly set to master before – apologies for confusion.
a588e8b to
9753479
Compare
3 participants
Summary
BaumerandBaumer Mono, replacingInterandCommitMonorespectively.--font-weight--boldwith--font-weight--mediumacross design-system, editor-ui, Storybook, and the MCP browser extensionN8nHeadingbold variant now renders as mediumstrongandbto--font-weight--mediumfont-weight: 600withvar(--font-weight--medium)BlockMessage,TextMessage,ToolMessage,RestoreVersionConfirm) andN8nMenuItemNodeIconandUserStackstoriesMarkdownheadings storyHeadingRelated Linear tickets, Github issues, and Community forum posts
https://linear.app/n8n/issue/DS-617/brand-test-new-typeface
Review / Merge checklist
Backport to Beta,Backport to Stable, orBackport to v1(if the PR is an urgent fix that needs to be backported)