back to home page btn added
This commit is contained in:
@@ -1,5 +1,7 @@
|
|||||||
import React, { useEffect, useState } from 'react'
|
import React, { useEffect, useState } from 'react'
|
||||||
import { useLocation, useNavigate } from 'react-router-dom'
|
import { useLocation, useNavigate } from 'react-router-dom'
|
||||||
|
import { IoIosArrowBack } from "react-icons/io";
|
||||||
|
|
||||||
import myLinks from '../myLinks'
|
import myLinks from '../myLinks'
|
||||||
import Label from './Label'
|
import Label from './Label'
|
||||||
import InputText from './InputText'
|
import InputText from './InputText'
|
||||||
@@ -18,9 +20,14 @@ export default function LoginCom() {
|
|||||||
return (
|
return (
|
||||||
<div className={`h-screen bg-sky-300 flex flex-col items-center justify-center bg-[url('./assets/first-background.jpg')] bg-cover bg-center bg-no-repeat`}>
|
<div className={`h-screen bg-sky-300 flex flex-col items-center justify-center bg-[url('./assets/first-background.jpg')] bg-cover bg-center bg-no-repeat`}>
|
||||||
<div className='flex flex-col gap-4 w-[80%] sm:w-[400px] min-h-[500px] bg-white rounded-xl p-4 sm:p-8 shadow'>
|
<div className='flex flex-col gap-4 w-[80%] sm:w-[400px] min-h-[500px] bg-white rounded-xl p-4 sm:p-8 shadow'>
|
||||||
<div className="pb-3 card-title w-full text-center border-b-2">
|
<div className="relative pb-3 card-title w-full border-b-2 flex gap-4 items-center">
|
||||||
|
<div className='absolute left-2 top-1/2 -translate-y-1/2 p-1 cursor-pointer' onClick={()=>navigate(myLinks.home, {state:{proceed:'true'}})}>
|
||||||
|
<IoIosArrowBack className='text-3xl sm:text-5xl font-bold text-red-500' />
|
||||||
|
</div>
|
||||||
|
<div className='w-full text-center'>
|
||||||
<h1 className="mb-[1px] text-2xl font-bold">{state?.user.name}</h1>
|
<h1 className="mb-[1px] text-2xl font-bold">{state?.user.name}</h1>
|
||||||
<span className={`text-base font-bold p-1 rounded`}>BVN: {state?.user.bvn}</span>
|
<span className={`text-base font-bold p-1 rounded`}>BVN: {state?.user.bvn}</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='mt-3 flex justify-center items-center'>
|
<div className='mt-3 flex justify-center items-center'>
|
||||||
|
|||||||
@@ -40,7 +40,7 @@ export default function HomeCom() {
|
|||||||
<p className='text-red-500'>{error.message}</p>
|
<p className='text-red-500'>{error.message}</p>
|
||||||
</div>
|
</div>
|
||||||
:
|
:
|
||||||
<TableWrapper data={demoUsers} itemsPerPage={8}>
|
<TableWrapper data={demoUsers} itemsPerPage={16}>
|
||||||
{({ data }) => (
|
{({ data }) => (
|
||||||
<div className="grid gap-5 sm:gap-[40px] grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
|
<div className="grid gap-5 sm:gap-[40px] grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
|
||||||
{data.map((user, index) => {
|
{data.map((user, index) => {
|
||||||
|
|||||||
@@ -53,6 +53,7 @@ export default function TableWrapper({
|
|||||||
);
|
);
|
||||||
setIsLoading(false)
|
setIsLoading(false)
|
||||||
},1000)
|
},1000)
|
||||||
|
|
||||||
}, [currentPage, filteredData]);
|
}, [currentPage, filteredData]);
|
||||||
|
|
||||||
useEffect(()=>{
|
useEffect(()=>{
|
||||||
|
|||||||
@@ -2,6 +2,10 @@
|
|||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
|
html{
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
*{
|
*{
|
||||||
transition: all .3s;
|
transition: all .3s;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user