kylefang/react
1
0
Fork 0
mirror of https://github.com/zhigang1992/react.git synced 2026-04-28 20:25:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: fix min-width in mobile screen

Browse Source
This commit is contained in:
unix
2020-03-23 09:35:01 +08:00
parent 37a26988a2
commit df9762cad0
4 changed files with 20 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
components/display/display.tsx
View File

@@ -6,7 +6,7 @@ interface Props {
caption?: ReactNode | string
shadow?: boolean
className?: string
minWidth?: string
width?: string
}
const defaultProps = {
@@ -18,7 +18,7 @@ const defaultProps = {
export type DisplayProps = Props & typeof defaultProps & React.HTMLAttributes<any>
const Display: React.FC<React.PropsWithChildren<DisplayProps>> = React.memo(({
children, caption, shadow, className, minWidth, ...props
children, caption, shadow, className, width, ...props
}) => {
const theme = useTheme()
return (
@@ -34,21 +34,17 @@ const Display: React.FC<React.PropsWithChildren<DisplayProps>> = React.memo(({
}
.content {
display: flex;
justify-content: center;
align-items: center;
display: block;
margin: 0 auto;
border-radius: 4px;
overflow: hidden;
width: fit-content;
min-width: ${minWidth ? minWidth : 'unset'};
width: ${width ? width : 'fit-content'};
box-shadow: ${shadow ? theme.expressiveness.shadowLarge : 'none'};
}
.content :global(pre) {
margin: 0;
transition: min-width ease .2s;
min-width: ${minWidth ? minWidth : 'unset'};
}
.caption {