sysadminix/rentalcalculator
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

RC-4: corrected layout2 components

Browse Source
This commit is contained in:
evgeniywas
2023-06-22 19:40:24 +01:00
parent 97fec278e6
commit 4dd5ce2275
3 changed files with 22 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/theme-layouts/layout2/Layout2.js
View File

@@ -5,6 +5,7 @@ import i18next from 'i18next';
import { memo, useContext } from 'react'; import { memo, useContext } from 'react';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
import { useRoutes } from 'react-router-dom'; import { useRoutes } from 'react-router-dom';
import { useAuth } from 'src/app/auth/AuthContext';
import FooterLayout2 from './components/FooterLayout2'; import FooterLayout2 from './components/FooterLayout2';
import HeaderLayout2 from './components/HeaderLayout2'; import HeaderLayout2 from './components/HeaderLayout2';
@@ -14,12 +15,13 @@ i18next.addResourceBundle('en', 'layout2', en);
function Layout2(props) { function Layout2(props) {
const config = useSelector(selectFuseCurrentLayoutConfig); const config = useSelector(selectFuseCurrentLayoutConfig);
const authContext = useAuth();
const appContext = useContext(AppContext); const appContext = useContext(AppContext);
const { routes } = appContext; const { routes } = appContext;
return ( return (
<> <>
{config.header.display && <HeaderLayout2 />} {config.header.display && <HeaderLayout2 isAuthenticated={authContext.isAuthenticated} />}
<main id="fuse-main" className="flex flex-col min-h-full min-w-full mt-72"> <main id="fuse-main" className="flex flex-col min-h-full min-w-full mt-72">
<FuseSuspense>{useRoutes(routes)}</FuseSuspense> <FuseSuspense>{useRoutes(routes)}</FuseSuspense>
{props.children} {props.children}

4
src/app/theme-layouts/layout2/components/FooterLayout2.js
View File

@@ -7,8 +7,8 @@ function FooterLayout2() {
const { t } = useTranslation('layout2'); const { t } = useTranslation('layout2');
return ( return (
<footer className="w-full bg-gray-900"> <footer className="flex items-center justify-center w-full bg-gray-900">
<div className="flex gap-96 max-w-screen-2xl px-10 py-52"> <div className="flex gap-96 w-full max-w-screen-xl px-10 py-52">
<ul className="flex flex-col gap-16 mr-96"> <ul className="flex flex-col gap-16 mr-96">
<li> <li>
<Link to="/"> <Link to="/">

32
src/app/theme-layouts/layout2/components/HeaderLayout2.js
View File

@@ -4,12 +4,12 @@ import { useTranslation } from 'react-i18next';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import linksConfigLayout2 from './linksLayout2Config'; import linksConfigLayout2 from './linksLayout2Config';
function HeaderLayout2() { function HeaderLayout2(props) {
const { t } = useTranslation('layout2'); const { t } = useTranslation('layout2');
return ( return (
<header className="fixed z-50 flex items-center justify-center w-full h-72 px-10 bg-white"> <header className="fixed z-50 flex items-center justify-center w-full h-72 px-10 bg-white">
<div className="flex justify-between max-w-screen-2xl w-full"> <div className="flex justify-between max-w-screen-xl w-full">
<Link to="/"> <Link to="/">
<img <img
className="max-w-[88px] max-h-[45px]" className="max-w-[88px] max-h-[45px]"
@@ -17,7 +17,7 @@ function HeaderLayout2() {
alt={t('logo_alt')} alt={t('logo_alt')}
/> />
</Link> </Link>
<nav className="flex gap-72 items-center"> <nav className="flex grow justify-center gap-72 items-center">
{linksConfigLayout2.map((path) => ( {linksConfigLayout2.map((path) => (
<Link <Link
className="text-lg leading-5 text-slate-800 no-underline" className="text-lg leading-5 text-slate-800 no-underline"
@@ -28,18 +28,20 @@ function HeaderLayout2() {
</Link> </Link>
))} ))}
</nav> </nav>
<div className="flex gap-32 items-center"> {props.isAuthenticated || (
<Link className="text-indigo-400" to="/sign-up"> <div className="flex gap-32 items-center">
{t('sign_up')} <Link className="text-indigo-400" to="/sign-in">
</Link> {t('sign_in')}
<Link </Link>
className="flex gap-7 items-center px-24 py-10 text-lg leading-5 text-white bg-indigo-400 rounded-2xl" <Link
to="/sign-in" className="flex gap-7 items-center px-24 py-10 text-lg leading-5 text-white bg-indigo-400 rounded-2xl"
> to="/sign-up"
<span>{t('sign_in')}</span> >
<FuseSvgIcon>heroicons-outline:login</FuseSvgIcon> <span>{t('sign_up')}</span>
</Link> <FuseSvgIcon>heroicons-outline:login</FuseSvgIcon>
</div> </Link>
</div>
)}
</div> </div>
</header> </header>
); );