Web: Client: add confirm wrapper
This commit is contained in:
parent
6f156d449a
commit
55624e0d9f
@ -0,0 +1,26 @@
|
|||||||
|
import React from "react";
|
||||||
|
import styled, { css } from "styled-components";
|
||||||
|
import { isIOS, isFirefox, isMobileOnly } from "react-device-detect";
|
||||||
|
|
||||||
|
const StyledWrapper = styled.div`
|
||||||
|
height: ${isIOS && !isFirefox ? "calc(var(--vh, 1vh) * 100)" : "100vh"};
|
||||||
|
width: 100vw;
|
||||||
|
z-index: 0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
${isMobileOnly &&
|
||||||
|
css`
|
||||||
|
height: auto;
|
||||||
|
min-height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
`}
|
||||||
|
`;
|
||||||
|
|
||||||
|
const ConfirmWrapper = (props) => {
|
||||||
|
const { children, className } = props;
|
||||||
|
return <StyledWrapper className={className}>{children}</StyledWrapper>;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ConfirmWrapper;
|
@ -1,6 +1,7 @@
|
|||||||
import React, { lazy } from "react";
|
import React, { lazy } from "react";
|
||||||
import { Switch } from "react-router-dom";
|
import { Switch } from "react-router-dom";
|
||||||
import ConfirmRoute from "../../../helpers/confirmRoute";
|
import ConfirmRoute from "../../../helpers/confirmRoute";
|
||||||
|
import ConfirmWrapper from "./ConfirmWrapper";
|
||||||
|
|
||||||
const ActivateUserForm = lazy(() => import("./sub-components/activateUser"));
|
const ActivateUserForm = lazy(() => import("./sub-components/activateUser"));
|
||||||
const CreateUserForm = lazy(() => import("./sub-components/createUser"));
|
const CreateUserForm = lazy(() => import("./sub-components/createUser"));
|
||||||
@ -19,56 +20,58 @@ const Confirm = ({ match }) => {
|
|||||||
//console.log("Confirm render");
|
//console.log("Confirm render");
|
||||||
const path = match.path;
|
const path = match.path;
|
||||||
return (
|
return (
|
||||||
<Switch>
|
<ConfirmWrapper className="with-background-pattern">
|
||||||
<ConfirmRoute
|
<Switch>
|
||||||
forUnauthorized
|
<ConfirmRoute
|
||||||
path={`${path}/LinkInvite`}
|
forUnauthorized
|
||||||
component={CreateUserForm}
|
path={`${path}/LinkInvite`}
|
||||||
/>
|
component={CreateUserForm}
|
||||||
<ConfirmRoute
|
/>
|
||||||
forUnauthorized
|
<ConfirmRoute
|
||||||
path={`${path}/Activation`}
|
forUnauthorized
|
||||||
component={ActivateUserForm}
|
path={`${path}/Activation`}
|
||||||
/>
|
component={ActivateUserForm}
|
||||||
<ConfirmRoute
|
/>
|
||||||
exact
|
<ConfirmRoute
|
||||||
path={`${path}/EmailActivation`}
|
exact
|
||||||
component={ActivateEmailForm}
|
path={`${path}/EmailActivation`}
|
||||||
/>
|
component={ActivateEmailForm}
|
||||||
<ConfirmRoute
|
/>
|
||||||
exact
|
<ConfirmRoute
|
||||||
path={`${path}/EmailChange`}
|
exact
|
||||||
component={ChangeEmailForm}
|
path={`${path}/EmailChange`}
|
||||||
/>
|
component={ChangeEmailForm}
|
||||||
<ConfirmRoute
|
/>
|
||||||
forUnauthorized
|
<ConfirmRoute
|
||||||
path={`${path}/PasswordChange`}
|
forUnauthorized
|
||||||
component={ChangePasswordForm}
|
path={`${path}/PasswordChange`}
|
||||||
/>
|
component={ChangePasswordForm}
|
||||||
<ConfirmRoute
|
/>
|
||||||
exact
|
<ConfirmRoute
|
||||||
path={`${path}/ProfileRemove`}
|
exact
|
||||||
component={ProfileRemoveForm}
|
path={`${path}/ProfileRemove`}
|
||||||
/>
|
component={ProfileRemoveForm}
|
||||||
<ConfirmRoute
|
/>
|
||||||
exact
|
<ConfirmRoute
|
||||||
path={`${path}/PhoneActivation`}
|
exact
|
||||||
component={ChangePhoneForm}
|
path={`${path}/PhoneActivation`}
|
||||||
/>
|
component={ChangePhoneForm}
|
||||||
<ConfirmRoute
|
/>
|
||||||
exact
|
<ConfirmRoute
|
||||||
path={`${path}/PortalOwnerChange`}
|
exact
|
||||||
component={ChangeOwnerForm}
|
path={`${path}/PortalOwnerChange`}
|
||||||
/>
|
component={ChangeOwnerForm}
|
||||||
<ConfirmRoute exact path={`${path}/TfaAuth`} component={TfaAuthForm} />
|
/>
|
||||||
<ConfirmRoute
|
<ConfirmRoute exact path={`${path}/TfaAuth`} component={TfaAuthForm} />
|
||||||
exact
|
<ConfirmRoute
|
||||||
path={`${path}/TfaActivation`}
|
exact
|
||||||
component={TfaActivationForm}
|
path={`${path}/TfaActivation`}
|
||||||
/>
|
component={TfaActivationForm}
|
||||||
|
/>
|
||||||
|
|
||||||
{/* <Route component={Error404} /> */}
|
{/* <Route component={Error404} /> */}
|
||||||
</Switch>
|
</Switch>
|
||||||
|
</ConfirmWrapper>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user