StarMC/Astral-nook
StarMC/Astral-nook
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix modal layout positioning

Browse source
This commit is contained in:
Dane Everitt 2020-04-03 16:39:55 -07:00
parent 85e3945cd7
commit 807cd815ea
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
3 changed files with 7 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

6
resources/scripts/components/elements/Modal.tsx
View file

@ -3,11 +3,13 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faTimes } from '@fortawesome/free-solid-svg-icons/faTimes';
import { CSSTransition } from 'react-transition-group';
import Spinner from '@/components/elements/Spinner';
import classNames from 'classnames';
export interface RequiredModalProps {
visible: boolean;
onDismissed: () => void;
appear?: boolean;
top?: boolean;
}
type Props = RequiredModalProps & {
@ -18,7 +20,7 @@ type Props = RequiredModalProps & {
children: React.ReactNode;
}
export default ({ visible, appear, dismissable, showSpinnerOverlay, closeOnBackground = true, closeOnEscape = true, onDismissed, children }: Props) => {
export default ({ visible, appear, dismissable, showSpinnerOverlay, top = true, closeOnBackground = true, closeOnEscape = true, onDismissed, children }: Props) => {
const [render, setRender] = useState(visible);
const isDismissable = useMemo(() => {
@ -58,7 +60,7 @@ export default ({ visible, appear, dismissable, showSpinnerOverlay, closeOnBackg
}
}
}}>
<div className={'modal-container top'}>
<div className={classNames('modal-container', { top })}>
{isDismissable &&
<div className={'modal-close-icon'} onClick={() => setRender(false)}>
<FontAwesomeIcon icon={faTimes}/>