rzmk/qsvpro.dathere.com
1
0
Fork 0
mirror of https://github.com/dathere/qsvpro.dathere.com.git synced 2025-12-26 19:17:00 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: initial commit!

Browse source
This commit is contained in:
rzmk 2023-12-04 22:02:40 -05:00
commit 3c04acba10
No known key found for this signature in database
53 changed files with 21596 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

126
src/components/Footer.jsx Normal file
View file

@ -0,0 +1,126 @@
import { FacebookIcon } from "../assets/icons/FacebookIcon";
import { InstagramIcon } from "../assets/icons/InstagramIcon";
import datHereLogoFull from "../assets/logos/datHere-logo-light.png";
import { TwitterIcon } from "../assets/icons/TwitterIcon";
const footerData = [
{
title: "Products",
items: ["Services", "About Us", "News and Stories", "Roadmap"],
},
{
title: "Important Links",
items: [
"Organization Team",
"Our Journeys",
"Pricing Plans",
"Roadmap",
"Terms & Conditions",
"Privacy Policy",
],
},
{
title: "Company",
items: ["About Us", "Jobs", "Press", "Contact Us"],
},
];
export const Footer = () => {
return (
<footer>
<div className="pt-10 lg:pt-20 lg:pb-12 bg-customDarkBg1 radius-for-skewed">
<div className="container mx-auto px-4 w-4/5 md:w-11/12 lg:w-10/12 xl:w-4/5 2xl:w-2/3">
<div className="flex flex-wrap">
<div className="w-full lg:w-1/3 mb-16 lg:mb-0">
<div className="flex justify-center lg:justify-start items-center grow basis-0">
<div className="text-white mr-2 text-6xl">
<img
src={datHereLogoFull}
alt="datHere Logo"
className="w-48"
/>
</div>
</div>
<p className="mb-10 mt-4 sm:w-[22rem] lg:w-[20rem] xl:w-[24rem] text-gray-400 leading-loose text-center lg:text-left mx-auto lg:mx-0">
Making data Useful, Usable, and Used.
</p>
{/* <div className="w-36 mx-auto lg:mx-0">
<a
className="inline-block w-10 h-10 mr-2 p-2 bg-customDarkBg2 custom-border-gray hover:bg-gray-700 rounded-xl"
href="#"
>
<TwitterIcon />
</a>
<a
className="inline-block w-10 h-10 mr-2 p-2 bg-customDarkBg2 custom-border-gray hover:bg-gray-700 rounded-xl"
href="#"
>
<InstagramIcon />
</a>
</div> */}
</div>
<div className="w-full lg:w-2/3 lg:pl-16 hidden lg:flex flex-wrap justify-between">
{/* <div className="w-full md:w-1/3 lg:w-auto mb-16 md:mb-0">
<h3 className="mb-6 text-2xl font-bold text-white">
Products
</h3>
<ul>
{footerData[0].items.map((item, i) => (
<li key={i} className="mb-4">
<a
className="text-gray-400 hover:text-gray-300"
href="#"
aria-label=""
>
{item}
</a>
</li>
))}
</ul>
</div> */}
{/* <div className="w-full md:w-1/3 lg:w-auto mb-16 md:mb-0">
<h3 className="mb-6 text-2xl font-bold text-white">
Important Links
</h3>
<ul>
{footerData[1].items.map((item, i) => (
<li key={i} className="mb-4">
<a
className="text-gray-400 hover:text-gray-300"
href="#"
aria-label=""
>
{item}
</a>
</li>
))}
</ul>
</div> */}
{/* <div className="w-full md:w-1/3 lg:w-auto">
<h3 className="mb-6 text-2xl font-bold text-white">
Company
</h3>
<ul>
{footerData[2].items.map((item, i) => (
<li key={i} className="mb-4">
<a
className="text-gray-400 hover:text-gray-300"
href="#"
aria-label=""
>
{item}
</a>
</li>
))}
</ul>
</div> */}
</div>
</div>
<p className="lg:text-center text-sm text-gray-400 border-t border-[rgb(255,255,255,0.2)] pt-4 hidden lg:block">
&copy; 2023 datHere Inc.
</p>
</div>
</div>
</footer>
);
};