mirror of
https://github.com/zhigang1992/react.git
synced 2026-01-29 17:18:13 +08:00
7facec3849
* feat(scaleable): add scaleable props to each component * chore(scaleable): update the exported type * feat: apply scaleable to components chore: remove with-default test: improve testcase for scaleable chore: resolve test warning ci: upgrade nodejs to latest lts docs: fix type error in document site * docs: update documents to be compatible with scaleable chore: fix build errors * chore: remove all size-related attributes docs: improve guide document * docs: add scaleable documentation test: update snapshots chore: remove unused * feat: add scaleable to grid components * docs: improve docs * test: update snapshots * fix(grid): fix basic component props
44 lines
988 B
TypeScript
44 lines
988 B
TypeScript
import React from 'react'
|
|
import { useTheme, Grid } from 'components'
|
|
import CustomizationCodes from './codes'
|
|
import Demo from './demo'
|
|
|
|
const CustomizationLayout: React.FC<React.PropsWithChildren<unknown>> = ({
|
|
children,
|
|
}) => {
|
|
const theme = useTheme()
|
|
|
|
return (
|
|
<div className="layout">
|
|
<Grid.Container>
|
|
<Grid xs={24}>
|
|
<Demo />
|
|
<div className="content">{children}</div>
|
|
</Grid>
|
|
<Grid xs={24}>
|
|
<CustomizationCodes />
|
|
</Grid>
|
|
</Grid.Container>
|
|
|
|
<style jsx>{`
|
|
.layout {
|
|
min-height: calc(100vh - 108px);
|
|
max-width: ${theme.layout.pageWidthWithMargin};
|
|
margin: 0 auto;
|
|
padding: 0 ${theme.layout.gap};
|
|
display: flex;
|
|
flex-direction: column;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.content {
|
|
flex: 1;
|
|
overflow: hidden;
|
|
}
|
|
`}</style>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default CustomizationLayout
|