67 lines
3.0 KiB
TypeScript
67 lines
3.0 KiB
TypeScript
import React from 'react';
|
|
import type { ReactElement } from 'react';
|
|
import Head from 'next/head';
|
|
import Link from 'next/link';
|
|
import BaseButton from '../components/BaseButton';
|
|
import CardBox from '../components/CardBox';
|
|
import SectionFullScreen from '../components/SectionFullScreen';
|
|
import LayoutGuest from '../layouts/Guest';
|
|
import BaseButtons from '../components/BaseButtons';
|
|
import { getPageTitle } from '../config';
|
|
import { useAppSelector } from '../stores/hooks';
|
|
import CardBoxComponentTitle from "../components/CardBoxComponentTitle";
|
|
|
|
export default function Starter() {
|
|
const textColor = useAppSelector((state) => state.style.linkColor);
|
|
const title = 'MFT SELF HELP GROUP'
|
|
return (
|
|
<div>
|
|
<Head>
|
|
<title>{getPageTitle('Starter Page')}</title>
|
|
</Head>
|
|
|
|
<SectionFullScreen bg='violet'>
|
|
<div className={`flex flex-row min-h-screen w-full`}>
|
|
<div className='flex items-center justify-center flex-col space-y-4 w-full lg:w-full'>
|
|
<CardBox className='w-full md:w-3/5 lg:w-2/3'>
|
|
<CardBoxComponentTitle title="Welcome to your MFT SELF HELP GROUP app!"/>
|
|
|
|
<div className="space-y-3">
|
|
<p className='text-center text-gray-500'>This is a React.js/Node.js app generated by the <a className={`${textColor}`} href="https://flatlogic.com/generator">Flatlogic Web App Generator</a></p>
|
|
<p className='text-center text-gray-500'>For guides and documentation please check
|
|
your local README.md and the <a className={`${textColor}`} href="https://flatlogic.com/documentation">Flatlogic documentation</a></p>
|
|
</div>
|
|
|
|
<BaseButtons>
|
|
<BaseButton
|
|
href='/login'
|
|
label='Login'
|
|
color='info'
|
|
className='w-full'
|
|
/>
|
|
|
|
</BaseButtons>
|
|
<div className='grid grid-cols-1 gap-2 lg:grid-cols-4 mt-2'>
|
|
<div className='text-center'><a className={`${textColor}`} href='https://react.dev/'>React.js</a></div>
|
|
<div className='text-center'><a className={`${textColor}`} href='https://tailwindcss.com/'>Tailwind CSS</a></div>
|
|
<div className='text-center'><a className={`${textColor}`} href='https://nodejs.org/en'>Node.js</a></div>
|
|
<div className='text-center'><a className={`${textColor}`} href='https://flatlogic.com/forum'>Flatlogic Forum</a></div>
|
|
</div>
|
|
</CardBox>
|
|
</div>
|
|
</div>
|
|
</SectionFullScreen>
|
|
<div className='bg-black text-white flex flex-col text-center justify-center md:flex-row'>
|
|
<p className='py-6 text-sm'>© 2024 <span>{title}</span>. All rights reserved</p>
|
|
<Link className='py-6 ml-4 text-sm' href='/privacy-policy/'>
|
|
Privacy Policy
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
Starter.getLayout = function getLayout(page: ReactElement) {
|
|
return <LayoutGuest>{page}</LayoutGuest>;
|
|
};
|