mirror of
https://github.com/windmill-labs/windmill.git
synced 2026-09-11 08:07:15 +00:00
* fix(frontend): align Monaco editor font size with text-xs across viewports * fix(frontend): make placeholder lineHeight reactive to fontSize * fix(frontend): align GraphQL schema viewer font size with text-xs The read-only GraphQL schema viewer was the lone Monaco instance still inheriting Monaco's 14px default. Wire it through editorFontSize like the other editors so it stays in sync with text-xs across viewports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
26 lines
715 B
TypeScript
26 lines
715 B
TypeScript
// Reactive Monaco font sizes that follow the global `:root` font-size
|
|
// breakpoint set in `frontend/src/lib/assets/app.css` (18px at ≥1760px).
|
|
// The values mirror Tailwind's `text-xs` (0.75rem) computed pixel size so
|
|
// editors visually match the surrounding UI.
|
|
|
|
const LARGE_VIEWPORT_QUERY = '(min-width: 1760px)'
|
|
|
|
let isLargeViewport = $state(false)
|
|
|
|
if (typeof window !== 'undefined') {
|
|
const mq = window.matchMedia(LARGE_VIEWPORT_QUERY)
|
|
isLargeViewport = mq.matches
|
|
mq.addEventListener('change', (e) => {
|
|
isLargeViewport = e.matches
|
|
})
|
|
}
|
|
|
|
export const editorFontSize = {
|
|
get regular(): number {
|
|
return isLargeViewport ? 13.5 : 12
|
|
},
|
|
get small(): number {
|
|
return isLargeViewport ? 12 : 11
|
|
}
|
|
}
|