Merge pull request #6 from digadoo/develop

Updates to Helping Hands landing page completed - all sections should now have current text, data, styling. The only outstanding item on the landing page is the three larger SVGs illustrations. Need to update these at some point to create a more cohesive landing page, but for now they'll work.

1 files changed, 32 insertions, 89 deletions

diff --git a/components/footer.js b/components/footer.js
index ea77b36..c43c69e 100644
--- a/components/footer.js
+++ b/components/footer.js
@@ -4,14 +4,12 @@ import React from "react";
 import Container from "./container";
 
 export default function Footer() {
-  const navigation = [
-    "Product",
-    "Features",
-    "Pricing",
-    "Company",
-    "Blog",
+  const navigation = [,
+    "About",
+    "Contact Us",
+    "Careers",
   ];
-  const legal = ["Terms", "Privacy", "Legal"];
+  const myAccount = ["Help Center", "Terms of Service", "Privacy Policy"];
   return (
     <div className="relative">
       <Container>
@@ -31,32 +29,21 @@ export default function Footer() {
               </Link>
             </div>
 
-            <div className="max-w-md mt-4 text-gray-500 dark:text-gray-400">
-              Helping Hands is a free landing page & marketing website
-              template for startups and indie projects. Its built with
-              Next.js & TailwindCSS. And its completely open-source.
-            </div>
-
-            <div className="mt-5">
-              <a
-                href="https://vercel.com/?utm_source=web3templates&utm_campaign=oss"
-                target="_blank"
-                rel="noopener"
-                className="relative block w-44">
-                <Image
-                  src="/img/vercel.svg"
-                  alt="Powered by Vercel"
-                  width="212"
-                  height="44"
-                />
-              </a>
+            <div className="max-w-md mt-2.5 text-gray-500 dark:text-gray-400">
+                Connect. Volunteer. Make a Difference.
             </div>
+              <div className="max-w-md mt-2 text-gray-500 dark:text-gray-400">
+                  Join us in our mission to connect volunteers with meaningful opportunities to make a difference. Together, we can create positive change in communities worldwide.
+              </div>
           </div>
 
           <div>
             <div className="flex flex-wrap w-full -mt-2 -ml-3 lg:ml-0">
+              <div className="w-full px-4 py-2 font-bold uppercase text-indigo-500 dark:text-gray-300 hover:text-indigo-500 focus:bg-indigo-100 focus:outline-none dark:focus:bg-trueGray-700">
+                Company
+              </div>
               {navigation.map((item, index) => (
-                <Link key={index} href="/" className="w-full px-4 py-2 text-gray-500 rounded-md dark:text-gray-300 hover:text-indigo-500 focus:text-indigo-500 focus:bg-indigo-100 focus:outline-none dark:focus:bg-trueGray-700">                 
+                <Link key={index} href="/" className="w-full px-4 py-0.5 text-gray-500 rounded-md dark:text-gray-300 hover:text-indigo-500 focus:text-indigo-500 focus:bg-indigo-100 focus:outline-none dark:focus:bg-trueGray-700">
                     {item}
                 </Link>
               ))}
@@ -64,39 +51,43 @@ export default function Footer() {
           </div>
           <div>
             <div className="flex flex-wrap w-full -mt-2 -ml-3 lg:ml-0">
-              {legal.map((item, index) => (
-                <Link key={index} href="/" className="w-full px-4 py-2 text-gray-500 rounded-md dark:text-gray-300 hover:text-indigo-500 focus:text-indigo-500 focus:bg-indigo-100 focus:outline-none dark:focus:bg-trueGray-700">      
+              <div className="w-full px-4 py-2 font-bold uppercase text-indigo-500 rounded-md dark:text-gray-300 hover:text-indigo-500 focus:bg-indigo-100 focus:outline-none dark:focus:bg-trueGray-700">
+                Resources
+              </div>
+              {myAccount.map((item, index) => (
+                <Link key={index} href="/" className="w-full px-4 py-0.5 text-gray-500 rounded-md dark:text-gray-300 hover:text-indigo-500 focus:text-indigo-500 focus:bg-indigo-100 focus:outline-none dark:focus:bg-trueGray-700">
                     {item}
                 </Link>
               ))}
             </div>
           </div>
-          <div className="">
-            <div>Follow us</div>
-            <div className="flex mt-5 space-x-5 text-gray-400 dark:text-gray-500">
+            <div className="flex flex-wrap w-full -mt-2 -ml-3 lg:ml-0">
+            <div className="w-full px-4 py-2 font-bold uppercase text-indigo-500 rounded-md dark:text-gray-300 hover:text-indigo-500 focus:bg-indigo-100 focus:outline-none dark:focus:bg-trueGray-700">
+            Connect With Us
+          <div className="flex mt-2.5 space-x-2 text-gray-400 dark:text-gray-500">
               <a
-                href="https://twitter.com/web3templates"
+                href="https://twitter.com/helpinghands"
                 target="_blank"
                 rel="noopener">
                 <span className="sr-only">Twitter</span>
                 <Twitter />
               </a>
               <a
-                href="https://facebook.com/web3templates"
+                href="https://facebook.com/helpinghands"
                 target="_blank"
                 rel="noopener">
                 <span className="sr-only">Facebook</span>
                 <Facebook />
               </a>
               <a
-                href="https://instagram.com/web3templates"
+                href="https://instagram.com/helpinghands"
                 target="_blank"
                 rel="noopener">
                 <span className="sr-only">Instagram</span>
                 <Instagram />
               </a>
               <a
-                href="https://linkedin.com/"
+                href="https://linkedin.com/helpinghands"
                 target="_blank"
                 rel="noopener">
                 <span className="sr-only">Linkedin</span>
@@ -105,30 +96,13 @@ export default function Footer() {
             </div>
           </div>
         </div>
-
-        <div className="my-10 text-sm text-center text-gray-600 dark:text-gray-400">
-          Copyright © {new Date().getFullYear()}. Made with ♥ by{" "}
-          <a
-            href="https://web3templates.com/"
-            target="_blank"
-            rel="noopener">
-            Web3Templates.
-          </a>{" "}
-          Illustrations from{" "}
-          <a
-            href="https://www.glazestock.com/"
-            target="_blank"
-            rel="noopener ">
-            Glazestock
-          </a>
         </div>
-      </Container>
-      {/* Do not remove this */}
-      <Backlink />
-    </div>
+          <div className="my-10 text-sm text-center text-gray-600 dark:text-gray-400">
+          Copyright Helping Hands© 2024.
+        </div>
+      </Container></div>
   );
 }
-
 const Twitter = ({ size = 24 }) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
@@ -170,35 +144,4 @@ const Linkedin = ({ size = 24 }) => (
     fill="currentColor">
     <path d="M22.23 0H1.77C.8 0 0 .77 0 1.72v20.56C0 23.23.8 24 1.77 24h20.46c.98 0 1.77-.77 1.77-1.72V1.72C24 .77 23.2 0 22.23 0zM7.27 20.1H3.65V9.24h3.62V20.1zM5.47 7.76h-.03c-1.22 0-2-.83-2-1.87 0-1.06.8-1.87 2.05-1.87 1.24 0 2 .8 2.02 1.87 0 1.04-.78 1.87-2.05 1.87zM20.34 20.1h-3.63v-5.8c0-1.45-.52-2.45-1.83-2.45-1 0-1.6.67-1.87 1.32-.1.23-.11.55-.11.88v6.05H9.28s.05-9.82 0-10.84h3.63v1.54a3.6 3.6 0 0 1 3.26-1.8c2.39 0 4.18 1.56 4.18 4.89v6.21z" />
   </svg>
-);
-
-const Backlink = () => {
-  return (
-    <a
-      href="https://web3templates.com"
-      target="_blank"
-      rel="noopener"
-      className="absolute flex px-3 py-1 space-x-2 text-sm font-semibold text-gray-900 bg-white border border-gray-300 rounded shadow-sm place-items-center left-5 bottom-5 dark:bg-trueGray-900 dark:border-trueGray-700 dark:text-trueGray-300">
-      <svg
-        width="20"
-        height="20"
-        viewBox="0 0 30 30"
-        fill="none"
-        className="w-4 h-4"
-        xmlns="http://www.w3.org/2000/svg">
-        <rect
-          width="30"
-          height="29.5385"
-          rx="2.76923"
-          fill="#362F78"
-        />
-        <path
-          d="M10.14 21.94H12.24L15.44 12.18L18.64 21.94H20.74L24.88 8H22.64L19.58 18.68L16.36 8.78H14.52L11.32 18.68L8.24 8H6L10.14 21.94Z"
-          fill="#F7FAFC"
-        />
-      </svg>
-
-      <span>Web3Templates</span>
-    </a>
-  );
-};
+);
\ No newline at end of file