DigiFi/digifi-www
1
0
Fork 0
Code Issues Pull Requests Releases Activity

added pages for top header nav links

Browse Source
This commit is contained in:
Ebube
2024-03-18 17:42:36 +01:00
parent df6fe828e3
commit dde4072593
9 changed files with 73 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Header/TopHeader.tsx
+19 -9
View File
@@ -1,5 +1,7 @@
import { top_header_data } from "../../utils/data";
import { Link } from "react-router-dom";
import styles from "./header.module.css";
import { RouteHandler } from "../../router/routes";
const TopHeader = () => {
return (
@@ -7,28 +9,36 @@ const TopHeader = () => {
<div className="flex flex-col sm:hidden bg-[#5c2684]">
<ul className="flex flex-col justify-center items-center pt-[0.4rem] text-[13px] font-light">
{["Open An Account", "Internet Banking", "Contact Us"].map((text) => (
<li key={text} className="w-full">
<a href="#" className={`p-2 cursor-pointer text-white w-full items-center justify-center flex`}>
<li key={text} className="w-full">
<a
href="#"
className={`p-2 cursor-pointer text-white w-full items-center justify-center flex`}
>
{text}
</a>
</li>
))}
<li className="w-full flex items-center justify-center">
<a href="#" className={`p-2 mt-2 flex gap-2 bg-[#74449E] cursor-pointer text-white w-full items-center justify-center`}>
<a
href="#"
className={`p-2 mt-2 flex gap-2 bg-[#74449E] cursor-pointer text-white w-full items-center justify-center`}
>
<p className="uppercase">Today's Share price:</p>
<span className="text-[#F8B51F] text-base md:text-lg">$ 4.00</span>
</a>
</li>
<span className="text-[#F8B51F] text-base md:text-lg">
$ 4.00
</span>
</a>
</li>
</ul>
</div>
<div className={styles.top_header}>
<div className="containerMode flex justify-between w-full text-white font-medium text-[11px] md:text-[13px]">
<ul className="flex items-center py-[0.4rem] flex-wrap">
{top_header_data.map(({ id, name }) => (
{top_header_data.map(({ id, name, href }) => (
<li key={id}>
<a href="#" className={`py-[11px] px-[15px]`}>
<Link to={href} className={`py-[11px] px-[15px]`}>
{name}
</a>
</Link>
</li>
))}
</ul>