Hi! pls. allow the height of axa-modal content to be user-configurable.
(OR maybe better: expand the contents automatically to its full height)
Currently it is hardcoded to 70% which isn't enough sometimes:
https://github.com/axa-ch-webhub-cloud/pattern-library/blob/develop/src/components/30-organisms/modal/index.scss#L119
Thanks.
Here's a workaround I am using now in React to expand Modal's height:
import * as React from 'react';
/**
* Within <axa-modal> adjusts its height
*/
export const ModalHeight: React.FC<{ height?: string }> = ({ height = '90vh' }) => {
const nodeRef = React.useRef<HTMLElement | null>(null);
React.useEffect(
() => {
const update = () => {
const modalContent = nodeRef.current?.closest('axa-modal')?.shadowRoot?.querySelector('.o-modal__content');
if (modalContent) {
(modalContent as HTMLElement).style.maxHeight = height;
}
};
window.setTimeout(update, 0); // defer to next tick to allow modal content creation
},
[],
);
return (
<span ref={nodeRef}/>
);
};
Hi! pls. allow the height of axa-modal content to be user-configurable.
(OR maybe better: expand the contents automatically to its full height)
Currently it is hardcoded to 70% which isn't enough sometimes:
https://github.com/axa-ch-webhub-cloud/pattern-library/blob/develop/src/components/30-organisms/modal/index.scss#L119
Thanks.
Here's a workaround I am using now in React to expand Modal's height: