Some checks failed
No response / noResponse (push) Has been cancelled
CI / Continuous releases (push) Has been cancelled
CI / test-dev (macos-latest) (push) Has been cancelled
CI / test-dev (ubuntu-latest) (push) Has been cancelled
CI / test-dev (windows-latest) (push) Has been cancelled
Maintenance / main (push) Has been cancelled
Scorecards supply-chain security / Scorecards analysis (push) Has been cancelled
CodeQL / Analyze (push) Has been cancelled
29 lines
847 B
JavaScript
29 lines
847 B
JavaScript
import { CssVarsProvider, extendTheme } from '@mui/joy/styles';
|
|
import Typography from '@mui/joy/Typography';
|
|
|
|
const customTheme = extendTheme({
|
|
typography: {
|
|
kbd: {
|
|
background:
|
|
'linear-gradient(to top, var(--joy-palette-background-level2), var(--joy-palette-background-surface))',
|
|
border: '1px solid var(--joy-palette-neutral-outlinedBorder)',
|
|
borderRadius: 'var(--joy-radius-xs)',
|
|
boxShadow: 'var(--joy-shadow-sm)',
|
|
padding: '0.125em 0.375em',
|
|
},
|
|
},
|
|
});
|
|
|
|
export default function NewTypographyLevel() {
|
|
return (
|
|
<CssVarsProvider theme={customTheme}>
|
|
<div>
|
|
<Typography>
|
|
Press <Typography level="kbd">⌘</Typography> +{' '}
|
|
<Typography level="kbd">k</Typography> to search the documentation.
|
|
</Typography>
|
|
</div>
|
|
</CssVarsProvider>
|
|
);
|
|
}
|