feat: footer styling

src/app/globals.css

@@ -13,10 +13,13 @@
   --font-montserrat: var(--font-montserrat);
   --color-colorExt1: #0a0a0a;
   --color-colorExt2:  #ffffff;
-  --color-colorExt3: #d2ebf1;
+  --color-colorExt3: #967244;
   --color-colorExt4: #31323c;
   --color-colorHeader: var(--color-colorExt1);
   --color-colorHeaderText: var(--color-colorExt2);
+  --color-colorFooter: var(--color-colorExt1);
+  --color-colorFooterText: var(--color-colorExt2);
+  --color-colorFooterTextHover: var(--color-colorExt3);
   --color-colorFormInput: var(--color-colorExt2);
   --color-colorContactForm: var(--color-colorExt4);
 }

src/components/layouts/Footer.tsx

@@ -1,7 +1,7 @@
 export default function Footer() {
   return (
     <>
-      <section className="section section-md bg-gray-31 context-dark">
+      <section className="section section-md bg-colorFooter context-dark">
         <div className="container">
           <div className="row row-40 justify-content-lg-between">
             <div className="col-md-6 col-lg-4 col-xl-3">
@@ -14,7 +14,9 @@ export default function Footer() {
                 </div>
                 <div className="post-minimal-body">
                   <div className="post-minimal-title">
-                    <span> Retail Store Southwest 186th Street</span>
+                    <span className="text-colorFooterText! hover:text-colorFooterTextHover!">
+                      Retail Store Southwest 186th Street
+                    </span>
                   </div>
                   <div className="post-minimal-text">
                     <span>From $120/month</span>
@@ -27,7 +29,9 @@ export default function Footer() {
                 </div>
                 <div className="post-minimal-body">
                   <div className="post-minimal-title">
-                    <span> Apartment Building with Subunits</span>
+                    <span className="text-colorFooterText! hover:text-colorFooterTextHover!">
+                      Apartment Building with Subunits
+                    </span>
                   </div>
                   <div className="post-minimal-text">
                     <span>From $120/month</span>
@@ -39,24 +43,30 @@ export default function Footer() {
               <h3 className="heading-square font-weight-sbold" data-item=".heading-square-item">
                 <span className="heading-square-item"></span>Contact Us
               </h3>
-              <div className="link-with-icon heading-4 text-spacing-150 font-sec" data-item=".icon">
+              <div className="link-with-icon heading-5 text-spacing-150 font-sec" data-item=".icon">
                 <span className="icon icon-1 mdi mdi-phone"></span>
-                <a href="tel:#">1-800-700-6200</a>
+                <a className="text-colorFooterText! hover:text-colorFooterTextHover!" href="tel:(478) 225 9061">
+                  (478) 225 9061
+                </a>
               </div>
               <div className="link-with-icon text-spacing-100" data-item=".icon">
                 <span className="icon icon-2 mdi mdi-email-outline"></span>
-                <a href="mailto:#">info@demolink.org</a>
+                <a
+                  className="text-colorFooterText! hover:text-colorFooterTextHover!"
+                  href="mailto:dynamic@dynamicrealtyga.com"
+                >
+                  dynamic@dynamicrealtyga.com
+                </a>
               </div>
               <div className="link-with-icon text-spacing-100" data-item=".icon">
                 <span className="icon icon-3 mdi mdi-map-marker"></span>
-                <a href="#">
+                <a className="text-colorFooterText! hover:text-colorFooterTextHover!" href="#">
-                  3015 Grand Ave, Coconut
+                  100 N Houston Lake Blvd. Centerville, GA 31028, United States
-                  <br className="leading-0" /> Grove,Merrick Way, FL 12345
                 </a>
               </div>
             </div>
             <div className="col-lg-4">
-              <h3 className="heading-square font-weight-sbold" data-item=".heading-square-item">
+              {/* <h3 className="heading-square font-weight-sbold" data-item=".heading-square-item">
                 <span className="heading-square-item"></span>Newsletter Signup
               </h3>
               <p className="rd-mailform-label">Enter your e-mail to get the latest news of MyHome</p>
@@ -84,26 +94,26 @@ export default function Footer() {
                     Subscribe
                   </button>
                 </div>
-              </form>
+              </form> */}
-              <ul className="list-inline-1">
+              <ul className="list-inline-1 space-x-5">
                 <li>
-                  <a className="icon fa-facebook" href="#"></a>
+                  <a className="icon fa-facebook text-4xl!" href="#"></a>
                 </li>
                 <li>
-                  <a className="icon fa-twitter" href="#"></a>
+                  <a className="icon fa-twitter text-4xl!" href="#"></a>
                 </li>
                 <li>
-                  <a className="icon fa-google-plus" href="#"></a>
+                  <a className="icon fa-google-plus text-4xl!" href="#"></a>
                 </li>
                 <li>
-                  <a className="icon fa-pinterest-p" href="#"></a>
+                  <a className="icon fa-pinterest-p text-4xl!" href="#"></a>
                 </li>
               </ul>
             </div>
           </div>
         </div>
       </section>
-      <footer className="section footer-classic context-dark bg-gray-21">
+      <footer className="section footer-classic context-dark bg-colorFooter">
         <div className="container">
           <div className="row row-10 justify-content-sm-between">
             <div className="col-sm-6">
@@ -116,9 +126,9 @@ export default function Footer() {
             </div>
             <div className="col-sm-6 text-sm-right">
               <div className="right-1">
-                <a href="#">
+                {/* <a href="#">
                   <span className="icon mdi mdi-plus"></span>Submit Property
-                </a>
+                </a> */}
               </div>
             </div>
           </div>

src/components/layouts/Header.tsx

@@ -34,7 +34,7 @@ export default function Header() {
                       <span className="icon text-middle mdi mdi-phone"></span>
                     </div>
                     <div className="unit-body">
-                      <a href="tel:#">(478) 225 9061</a>
+                      <a href="tel:(478) 225 9061">(478) 225 9061</a>
                     </div>
                   </div>
                 </li>
@@ -44,7 +44,7 @@ export default function Header() {
                       <span className="icon text-middle mdi mdi-email-outline"></span>
                     </div>
                     <div className="unit-body">
-                      <a href="mailto:#">dynamic@dynamicrealtyga.com</a>
+                      <a href="mailto:dynamic@dynamicrealtyga.com">dynamic@dynamicrealtyga.com</a>
                     </div>
                   </div>
                 </li>