/
githubmirror
/
material-ui
Обзор
Документация
Войти
/
githubmirror
/
material-ui
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
docs/data/system/getting-started/the-sx-prop/Example.tsx
54 строки
1 KB
Brijesh Bittu
[code-infra] Remove React import requirement for jsx (#47146)
29 окт 2025, 20:55
Не верифицирован
29 окт 2025, 20:55
6c9e82f
Код
Авторство
О чём код?
import { Box, ThemeProvider, createTheme } from '@mui/system'; const theme = createTheme({ palette: { background: { paper: '#fff', }, text: { primary: '#173A5E', secondary: '#46505A', }, action: { active: '#001E3C', }, success: { dark: '#009688', }, }, }); export default function Example() { return ( <ThemeProvider theme={theme}> <Box sx={{ bgcolor: 'background.paper', boxShadow: 1, borderRadius: 2, p: 2, minWidth: 300, }} > <Box sx={{ color: 'text.secondary' }}>Sessions</Box> <Box sx={{ color: 'text.primary', fontSize: 34, fontWeight: 'medium' }}> 98.3 K </Box> <Box sx={{ color: 'success.dark', display: 'inline', fontWeight: 'bold', mx: 0.5, fontSize: 14, }} > +18.77% </Box> <Box sx={{ color: 'text.secondary', display: 'inline', fontSize: 14 }}> vs. last week </Box> </Box> </ThemeProvider> ); }