overleaf/services/web/frontend/js/features/history/extensions/theme.ts
Tim Down 95646a1bd5 Merge pull request #12936 from overleaf/td-history-diff-viewer-fixed-font
History migration: Use fixed font, text size, line height and theme in document diff viewer

GitOrigin-RevId: 9f86be609e0fe72ca41429bae9db03e047952c08
2023-05-05 08:04:37 +00:00

32 lines
929 B
TypeScript

import { EditorView } from '@codemirror/view'
const fontFamily = 'Monaco, Menlo, Ubuntu Mono, Consolas, monospace'
export const theme = () =>
EditorView.theme({
'&.cm-editor': {
'--font-size': '12px',
'--source-font-family': fontFamily,
'--line-height': 1.6,
},
'.cm-content': {
fontSize: 'var(--font-size)',
fontFamily: 'var(--source-font-family)',
lineHeight: 'var(--line-height)',
color: '#000',
},
'.cm-gutters': {
fontSize: 'var(--font-size)',
lineHeight: 'var(--line-height)',
},
'.cm-tooltip': {
// Set variables for tooltips, which are outside the editor
'--font-size': '12px',
'--source-font-family': fontFamily,
// NOTE: fontFamily is not set here, as most tooltips use the UI font
fontSize: 'var(--font-size)',
},
'.cm-lineNumbers': {
fontFamily: 'var(--source-font-family)',
},
})