PrivateCoffee/tldraw
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Fixes font issues with Recursive

Browse source
This commit is contained in:
Steve Ruiz 2021-06-27 22:30:37 +01:00
parent 121bba5acb
commit bb2268a1f4
9 changed files with 37 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
components/canvas/context-menu/context-menu.tsx
View file

@ -263,11 +263,13 @@ const StyledContent = styled(_ContextMenu.Content, {
padding: 3,
boxShadow: '0px 2px 4px rgba(0,0,0,.2)',
minWidth: 128,
font: '$ui',
'& kbd': {
marginLeft: '32px',
fontSize: '$1',
fontFamily: '$ui',
fontWeight: 400,
},
'& kbd > span': {

2
components/code-panel/code-docs.tsx
View file

@ -96,7 +96,7 @@ const StyledDocs = styled('div', {
'& pre': {
border: '1px solid $brushStroke',
font: '$ui',
font: '$mono',
fontWeight: 420,
lineHeight: 1.5,
padding: 16,

3
components/code-panel/code-editor.tsx
View file

@ -118,8 +118,7 @@ export default function CodeEditor({
editor.updateOptions({
fontSize,
fontFamily: "'Recursive', monospace",
fontWeight: '420',
fontFamily: "'Recursive Mono', monospace",
wordBasedSuggestions: false,
minimap: { enabled: false },
lightbulb: {

2
components/page-panel/page-panel.tsx
View file

@ -142,6 +142,7 @@ const StyledRadioItem = styled(DropdownMenu.RadioItem, {
borderRadius: '4px',
fontSize: '$1',
fontFamily: '$ui',
fontWeight: 400,
backgroundColor: 'transparent',
outline: 'none',
variants: {
@ -178,6 +179,7 @@ const StyledContextMenuItem = styled(ContextMenu.Item, {
borderRadius: '4px',
fontSize: '$1',
fontFamily: '$ui',
fontWeight: 400,
backgroundColor: 'transparent',
outline: 'none',
bp: {

1
components/panel.tsx
View file

@ -10,6 +10,7 @@ export const Root = styled('div', {
zIndex: 200,
border: '1px solid $panel',
boxShadow: '0px 2px 4px rgba(0,0,0,.2)',
font: '$ui',
variants: {
bp: {

1
components/shared.tsx
View file

@ -86,6 +86,7 @@ export const RowButton = styled('button', {
outline: 'none',
alignItems: 'center',
fontFamily: '$ui',
fontWeight: 400,
fontSize: '$1',
justifyContent: 'space-between',
padding: '4px 6px 4px 12px',

2
components/style-panel/style-panel.tsx
View file

@ -296,8 +296,8 @@ const Row = styled('div', {
'& label': {
fontFamily: '$ui',
fontWeight: 400,
fontSize: '$1',
fontWeight: '$1',
margin: 0,
padding: 0,
},

29
styles/globals.css
View file

@ -1,5 +1,30 @@
@import url('https://fonts.googleapis.com/css2?family=Recursive:wght@500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Recursive:wght,MONO@420,1&display=swap');
@font-face {
font-family: 'Recursive';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/recursive/v23/8vI-7wMr0mhh-RQChyHEH06TlXhq_gukbYrFMk1QuAIcyEwG_X-dpEfaE5YaERmK-CImKsvxvU-MXGX2fSqasNfUlTGZnI14ZeY.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Recursive';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/recursive/v23/8vI-7wMr0mhh-RQChyHEH06TlXhq_gukbYrFMk1QuAIcyEwG_X-dpEfaE5YaERmK-CImKsvxvU-MXGX2fSqasNfUlTGZnI14ZeY.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Recursive Mono';
font-style: normal;
font-weight: 420;
font-display: swap;
src: url(https://fonts.gstatic.com/s/recursive/v23/8vI-7wMr0mhh-RQChyHEH06TlXhq_gukbYrFMk1QuAIcyEwG_X-dpEfaE5YaERmK-CImqvTxvU-MXGX2fSqasNfUlTGZnI14ZeY.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Verveine Regular';

2
styles/stitches.config.ts
View file

@ -37,7 +37,7 @@ const { styled, global, css, theme, getCssString } = createCss({
fonts: {
ui: '"Recursive", system-ui, sans-serif',
body: '"Recursive", system-ui, sans-serif',
mono: '"Recursive", monospace',
mono: '"Recursive Mono", monospace',
},
fontWeights: {},
lineHeights: {},