diff --git a/package.json b/package.json index 3a7e05d65a..9d688b0cc6 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,8 @@ }, "resolutions": { "@types/react": "^17", - "@types/react-dom": "^17" + "@types/react-dom": "^17", + "csstype": "3.0.9" }, "version": "1.14.0", "dependencies": { diff --git a/packages/core-components/src/layout/Sidebar/Page.tsx b/packages/core-components/src/layout/Sidebar/Page.tsx index 5f660547d1..a1564c0409 100644 --- a/packages/core-components/src/layout/Sidebar/Page.tsx +++ b/packages/core-components/src/layout/Sidebar/Page.tsx @@ -33,23 +33,23 @@ import { SidebarPinStateProvider } from './SidebarPinStateContext'; export type SidebarPageClassKey = 'root'; -const useStyles = makeStyles< - BackstageTheme, - { sidebarConfig: SidebarConfig; isPinned: boolean } ->( +type PageStyleProps = { sidebarConfig: SidebarConfig; isPinned: boolean }; + +const useStyles = makeStyles( theme => ({ root: { width: '100%', transition: 'padding-left 0.1s ease-out', isolation: 'isolate', [theme.breakpoints.up('sm')]: { - paddingLeft: props => + paddingLeft: (props: PageStyleProps) => props.isPinned ? props.sidebarConfig.drawerWidthOpen : props.sidebarConfig.drawerWidthClosed, }, [theme.breakpoints.down('xs')]: { - paddingBottom: props => props.sidebarConfig.mobileSidebarHeight, + paddingBottom: (props: PageStyleProps) => + props.sidebarConfig.mobileSidebarHeight, }, }, content: { diff --git a/packages/theme/src/base/palettes.ts b/packages/theme/src/base/palettes.ts index c230ce94c0..5e70afd7b8 100644 --- a/packages/theme/src/base/palettes.ts +++ b/packages/theme/src/base/palettes.ts @@ -25,7 +25,7 @@ export const palettes = { mode: 'light' as const, background: { default: '#F8F8F8', - paper: '#FAFAFA', + paper: '#FFFFFF', }, status: { ok: '#1DB954', diff --git a/packages/theme/src/v5/defaultComponentThemes.ts b/packages/theme/src/v5/defaultComponentThemes.ts index bd29ad38c5..14656b007d 100644 --- a/packages/theme/src/v5/defaultComponentThemes.ts +++ b/packages/theme/src/v5/defaultComponentThemes.ts @@ -32,6 +32,8 @@ export const defaultComponentThemes: ThemeOptions['components'] = { height: '100%', fontFamily: theme.typography.fontFamily, overscrollBehaviorY: 'none', + fontSize: '0.875rem', + lineHeight: 1.43, }, a: { color: 'inherit', diff --git a/yarn.lock b/yarn.lock index 38d9819ae7..b884ebd728 100644 --- a/yarn.lock +++ b/yarn.lock @@ -21750,17 +21750,10 @@ __metadata: languageName: node linkType: hard -"csstype@npm:^2.0.0, csstype@npm:^2.5.2, csstype@npm:^2.6.7": - version: 2.6.21 - resolution: "csstype@npm:2.6.21" - checksum: 2ce8bc832375146eccdf6115a1f8565a27015b74cce197c35103b4494955e9516b246140425ad24103864076aa3e1257ac9bab25a06c8d931dd87a6428c9dccf - languageName: node - linkType: hard - -"csstype@npm:^3.0.2, csstype@npm:^3.0.6, csstype@npm:^3.1.1, csstype@npm:^3.1.2": - version: 3.1.2 - resolution: "csstype@npm:3.1.2" - checksum: e1a52e6c25c1314d6beef5168da704ab29c5186b877c07d822bd0806717d9a265e8493a2e35ca7e68d0f5d472d43fac1cdce70fd79fd0853dff81f3028d857b5 +"csstype@npm:3.0.9": + version: 3.0.9 + resolution: "csstype@npm:3.0.9" + checksum: 199f9af7e673f9f188525c3102a329d637ff46c52f6385a4427ff5cb17adcb736189150170a7af7c5701d18d7704bdad130273f4aa7e44c6c4f9967e6115dc93 languageName: node linkType: hard