Add overlays

This commit is contained in:
inpsyde-maticluznar 2024-11-05 13:30:27 +01:00
parent 6b9b024d64
commit 6a5fc51c02
No known key found for this signature in database
GPG key ID: D005973F231309F6
9 changed files with 348 additions and 21 deletions

View file

@ -3,23 +3,31 @@ import PaymentMethodIcon from './PaymentMethodIcon';
const PaymentMethodModal = ( props ) => {
let className = 'ppcp-r-modal';
let classNameContainer = 'ppcp-r-modal__container';
if ( props?.className ) {
className += ' ' + props.className;
}
if ( props?.container && props.container === 'small' ) {
classNameContainer += ' ppcp-r-modal__container--small';
}
return (
<Modal
className={ className }
onRequestClose={ () => props.setModalIsVisible( false ) }
>
<div className="ppcp-r-modal__header">
<PaymentMethodIcon
icons={ [ props.icon ] }
type={ props.icon }
/>
<span className="ppcp-r-modal__title">{ props.title }</span>
<div className={ classNameContainer }>
<div className="ppcp-r-modal__header">
<PaymentMethodIcon
icons={ [ props.icon ] }
type={ props.icon }
/>
<span className="ppcp-r-modal__title">{ props.title }</span>
</div>
<div className="ppcp-r-modal__content">{ props.children }</div>
</div>
<div className="ppcp-r-modal__content">{ props.children }</div>
</Modal>
);
};