Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-21 03:22:11 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

drop usage of global class name modal-container

Browse source
This commit is contained in:
NikolaBorislavovHristov 2019-04-08 16:05:21 +03:00
parent 3d19c828ed
commit ddd546e3df
4 changed files with 15 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/common/Modal/Modal.js
View file

@ -11,9 +11,7 @@ const onModalsContainerDomTreeChange = ({ modalsContainerElement, contentElement
const Modal = ({ modalsContainer, children }) => { const Modal = ({ modalsContainer, children }) => {
return ReactDOM.createPortal( return ReactDOM.createPortal(
<FocusableProvider onModalsContainerDomTreeChange={onModalsContainerDomTreeChange}> <FocusableProvider onModalsContainerDomTreeChange={onModalsContainerDomTreeChange}>
<div className={'modal-container'}> <div>{children}</div>
{children}
</div>
</FocusableProvider>, </FocusableProvider>,
modalsContainer modalsContainer
); );

2
src/common/Popup/Popup.js
View file

@ -237,7 +237,7 @@ class Popup extends Component {
return ( return (
<Modal> <Modal>
<div className={classnames(styles['modal-container'], this.props.className)} onClick={this.modalBackgroundOnClick}> <div className={classnames(styles['modal-content-container'], this.props.className)} onClick={this.modalBackgroundOnClick}>
<div ref={this.menuContainerRef} className={styles['menu-container']} onClick={this.menuContainerOnClick}> <div ref={this.menuContainerRef} className={styles['menu-container']} onClick={this.menuContainerOnClick}>
<div ref={this.menuScrollRef} className={styles['menu-scroll-container']}> <div ref={this.menuScrollRef} className={styles['menu-scroll-container']}>
{React.cloneElement(children, { ref: this.menuChildrenRef })} {React.cloneElement(children, { ref: this.menuChildrenRef })}

2
src/common/Popup/styles.less
View file

@ -1,4 +1,4 @@
.modal-container { .modal-content-container {
width: 100%; width: 100%;
height: 100%; height: 100%;

24
src/common/Router/Route/ModalsContainerProvider/styles.less
View file

@ -1,13 +1,13 @@
.modals-container { .modals-container {
width: 0; width: 0;
height: 0; height: 0;
>:global(.modal-container) { >* {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
z-index: 1; z-index: 1;
} }
} }