Router position/size fixed

This commit is contained in:
NikolaBorislavovHristov 2019-05-16 15:29:47 +03:00
parent 54cc6df15e
commit 412de96cfd
2 changed files with 25 additions and 16 deletions

View file

@ -1,9 +1,11 @@
const React = require('react');
const PropTypes = require('prop-types');
const classnames = require('classnames');
const PathToRegexp = require('path-to-regexp');
const UrlUtils = require('url');
const { RoutesContainerProvider } = require('../RoutesContainerContext');
const Route = require('./Route');
const styles = require('./styles');
const Router = React.memo(({ className, homePath, ...props }) => {
const onPathNotMatch = React.useRef(props.onPathNotMatch);
@ -96,7 +98,7 @@ const Router = React.memo(({ className, homePath, ...props }) => {
}, []);
return (
<RoutesContainerProvider containerClassName={className}>
<RoutesContainerProvider containerClassName={classnames(className, styles['router-container'])}>
{
views
.filter(({ routeConfig }) => routeConfig !== null)

View file

@ -1,34 +1,41 @@
.route-container {
.router-container {
position: relative;
z-index: 0;
width: 100%;
height: 100%;
overflow: hidden;
&:not(:last-child) {
display: none;
}
.route-content {
.route-container {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 0;
}
overflow: hidden;
.modals-container {
width: 0;
height: 0;
&:not(:last-child) {
display: none;
}
>* {
.route-content {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
z-index: 0;
}
.modals-container {
width: 0;
height: 0;
>* {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
}
}
}
}