Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-03-10 22:22:45 -05:00
Code Issues Activity

fix(ui): fix drawer overflow bug (#984)

Browse source 
fix drawer overflow bug
This commit is contained in:
simeng-li 2022-05-30 13:58:27 +08:00 • committed by GitHub
parent 1420bb28ce
commit b9131e9765
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
packages/ui/src/components/Drawer/index.module.scss
View file

@ -1,10 +1,21 @@
@use '@/scss/underscore' as _;
.drawer {
position: fixed;
left: 0;
right: 0;
bottom: 0;
outline: none;
padding-bottom: env(safe-area-inset-bottom);
}
.container {
border-top-left-radius: 16px;
border-top-right-radius: 16px;
padding: _.unit(5);
padding: _.unit(5) _.unit(5) 0;
background: var(--color-dialogue);
max-height: 411px;
@include _.flex-column(stretch, normal);
}
.header {
@ -20,16 +31,15 @@
}
}
.drawer {
position: fixed;
left: 0;
right: 0;
bottom: 0;
max-height: 411px;
outline: none;
padding-bottom: env(safe-area-inset-bottom);
}
.content {
flex: 1;
overflow-y: auto;
padding-bottom: _.unit(5);
&::-webkit-scrollbar {
display: none;
}
}
/* stylelint-disable selector-class-pattern */
:global {

2
packages/ui/src/components/Drawer/index.tsx
View file

@ -33,7 +33,7 @@ const Drawer = ({ className, isOpen = false, children, onClose }: Props) => {
<CloseIcon />
</IconButton>
</div>
{children}
<div className={styles.content}>{children}</div>
</div>
</ReactModal>
);