Skip to content

Commit

Permalink
implement footer #2 fixed
Browse files Browse the repository at this point in the history
  • Loading branch information
@CoderRedwing
CoderRedwing committed Oct 4, 2023
1 parent c5e56c1 commit bb38723
Show file tree
Hide file tree
Showing 2 changed files with 247 additions and 0 deletions.
241 changes: 241 additions & 0 deletions src/components/Footer/footer.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,241 @@
import React from "react";

export default function FooterFour() {
return (
<section className="relative overflow-hidden py-10">
<div className="relative z-10 mx-auto max-w-8xl px-6 bg-blue-100">
<div className="-m-6 flex flex-wrap">
<div className="w-full p-6 md:w-1/2 lg:w-5/12">
<div className="flex h-full flex-col justify-between">
<div>
<svg
width="154"
height="66"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M0 13.148C0 6.686 6.037 1.921 12.323 3.422l16.61 3.967 16.61-3.967c6.286-1.501 12.323 3.264 12.323 9.726v39.704c0 6.462-6.037 11.227-12.322 9.726l-14.288-3.412a10 10 0 0 0-4.646 0l-14.287 3.412C6.037 64.079 0 59.314 0 52.852V13.148Z"
fill="url(#a)"
/>
<path
d="m28.816 11.706.116.027.117-.027 2.73-.652-.117-.487 6.824-1.63.116.487 2.73-.652a9.612 9.612 0 0 1 1.887-.258l-.018-.5a9.906 9.906 0 0 1 4.846 1.07l-.227.446a9.6 9.6 0 0 1 2.974 2.347l.382-.324a9.907 9.907 0 0 1 2.166 4.465l-.49.098c.122.61.186 1.244.186 1.896v2.22h.5v5.552h-.5v4.44h.5v5.552h-.5v4.44h.5v5.552h-.5v2.22c0 .653-.064 1.286-.187 1.896l.49.098a9.906 9.906 0 0 1-2.166 4.465l-.38-.324a9.602 9.602 0 0 1-2.975 2.348l.227.446a9.906 9.906 0 0 1-4.846 1.07l.018-.5a9.614 9.614 0 0 1-1.887-.259l-2.214-.528-.116.486-5.533-1.322.116-.486-2.214-.529a10.49 10.49 0 0 0-1.075-.198l-.065.496a10.002 10.002 0 0 0-2.597 0l-.065-.496c-.361.047-.72.113-1.076.198l-2.213.529.116.486-5.534 1.322-.116-.486-2.213.528a9.614 9.614 0 0 1-1.887.258l.018.5a9.906 9.906 0 0 1-4.846-1.07l.226-.445a9.602 9.602 0 0 1-2.974-2.348l-.38.324a9.906 9.906 0 0 1-2.167-4.465l.49-.098a9.611 9.611 0 0 1-.187-1.896v-2.22h-.5v-5.551h.5v-4.441h-.5v-5.551h.5v-4.441h-.5v-5.551h.5v-2.22c0-.653.065-1.287.187-1.897l-.49-.098a9.906 9.906 0 0 1 2.166-4.465l.381.324a9.6 9.6 0 0 1 2.974-2.347l-.226-.446a9.906 9.906 0 0 1 4.846-1.07l-.018.5a9.612 9.612 0 0 1 1.887.258l2.73.652.116-.486 6.824 1.63-.116.486 2.73.652Z"
stroke="#fff"
stroke-opacity=".5"
stroke-dasharray="4 5"
/>
<path
d="M27.748 52.786c-.152-.208-.285-.436-.455-.606-6.153-6.154-12.307-12.326-18.48-18.46-.416-.417-.51-.796-.378-1.326 1.174-4.563 5.245-7.555 10.167-7.441 4.317.095 8.275 3.503 9.165 7.914.113.55.189 1.099.189 1.648.019 5.926 0 11.833 0 17.76 0 .113-.02.246-.02.36-.056.056-.113.094-.188.151Z"
fill="#fff"
/>
<path
d="M29.912 52.786V35.14c0-6.098 4.715-10.547 10.793-10.168 4.07.246 7.99 3.635 8.766 7.63.057.284-.038.72-.227.928-6.305 6.343-12.648 12.667-18.972 18.99-.076.058-.17.114-.36.266Z"
fill="#FA4A6F"
/>
<path
d="M13.018 18.27c-.02-2.746 2.215-5.018 4.98-5.056 2.745-.037 5.093 2.272 5.093 5.037 0 2.726-2.272 5.017-4.999 5.055-2.726.038-5.055-2.253-5.074-5.036Z"
fill="#fff"
/>
<path
d="M44.851 18.346c-.075 2.802-2.404 5.055-5.15 4.96-2.764-.076-5.017-2.461-4.923-5.207.095-2.707 2.405-4.922 5.093-4.885 2.803.038 5.056 2.367 4.98 5.132Z"
fill="#FA4A6F"
/>
<path
d="M88.827 30.565h-5.584l-3.96-5.552H76.49v5.552h-4.805V7.839h7.337c3.117 0 5.497.747 7.142 2.24 1.645 1.472 2.468 3.582 2.468 6.33 0 3.789-1.505 6.342-4.513 7.663l4.707 6.493ZM76.49 12.287v8.278h2.533c3.095 0 4.642-1.385 4.642-4.155 0-2.749-1.547-4.123-4.642-4.123H76.49ZM107.053 12.254h-9.447v5.52h8.408v4.285h-8.408v4.09h9.447v4.416H92.801V7.839h14.252v4.415ZM125.659 30.565l-1.234-3.766h-8.798l-1.234 3.766h-5l7.89-22.726h5.519l7.889 22.726h-5.032Zm-8.669-7.824h6.104l-2.987-9.058h-.13l-2.987 9.058ZM138.251 26.085h9.026v4.48h-13.831V7.839h4.805v18.246ZM91.457 35.435h5.097V58.16H91.88V44.687h-.13l-6.2 13.474H82.69l-6.2-13.474h-.098v13.474h-4.707V35.435h5.097l7.272 15.518h.13l7.272-15.518ZM115.577 58.16l-1.234-3.765h-8.798l-1.234 3.766h-5l7.889-22.726h5.52l7.889 22.726h-5.032Zm-8.669-7.824h6.104l-2.987-9.057h-.13l-2.987 9.057ZM136.437 35.435v4.48h-6.233V58.16h-4.805V39.915h-6.201v-4.48h17.239ZM153.786 39.85h-9.447v5.52h8.408v4.285h-8.408v4.09h9.447v4.416h-14.252V35.435h14.252v4.415Z"
fill="#23273A"
/>
<defs>
<linearGradient
id="a"
x1="29"
y1="19.5"
x2="28.933"
y2="65.521"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#0EB7BE" />
<stop offset=".641" stop-color="#FA4A6F" />
</linearGradient>
</defs>
</svg>
</div>
{
<div className="flex">
<div className="w-auto p-1.5">
<a href="#">
<div className="flex h-8 w-8 items-center justify-center rounded-full border border-gray-300 hover:border-gray-400">
<svg
width="8"
height="14"
viewBox="0 0 8 14"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M5.55736 5.2L5.55736 3.88C5.55736 3.308 5.69631 3 6.66894 3H7.87315V0.800003L6.02052 0.800003C3.70473 0.800003 2.77841 2.252 2.77841 3.88V5.2H0.925781L0.925781 7.4H2.77841L2.77841 14H5.55736L5.55736 7.4H7.59526L7.87315 5.2H5.55736Z"
fill="#27272A"
></path>
</svg>
</div>
</a>
</div>
<div className="w-auto p-1.5">
<a href="#">
<div className="flex h-8 w-8 items-center justify-center rounded-full border border-gray-300 hover:border-gray-400">
<svg
width="14"
height="11"
viewBox="0 0 14 11"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M13.6655 1.39641C13.1901 1.60149 12.6728 1.74907 12.1399 1.80656C12.6931 1.47788 13.1074 0.958619 13.3051 0.346204C12.7859 0.655036 12.2172 0.871595 11.6241 0.986274C11.3762 0.721276 11.0764 0.510168 10.7434 0.366102C10.4104 0.222036 10.0512 0.1481 9.68836 0.148902C8.22024 0.148902 7.03953 1.33893 7.03953 2.79928C7.03953 3.00436 7.06439 3.20943 7.10478 3.40673C4.90649 3.29177 2.94589 2.24155 1.64246 0.633614C1.40495 1.03927 1.2805 1.50117 1.28203 1.97123C1.28203 2.89094 1.74965 3.70191 2.46274 4.17885C2.0425 4.1623 1.63211 4.0468 1.26494 3.84173V3.87435C1.26494 5.16226 2.17533 6.22956 3.38866 6.47502C3.16084 6.5342 2.92649 6.56447 2.69111 6.56513C2.51866 6.56513 2.35554 6.54804 2.19086 6.52474C2.52643 7.57495 3.50362 8.33775 4.66724 8.3626C3.75685 9.07569 2.61654 9.49515 1.37835 9.49515C1.15619 9.49515 0.951119 9.48738 0.738281 9.46253C1.91278 10.216 3.30632 10.651 4.80706 10.651C9.67904 10.651 12.345 6.61484 12.345 3.11155C12.345 2.99659 12.345 2.88162 12.3372 2.76666C12.853 2.38914 13.3051 1.92152 13.6655 1.39641Z"
fill="#27272A"
></path>
</svg>
</div>
</a>
</div>
<div className="w-auto p-1.5">
<a href="#">
<div className="flex h-8 w-8 items-center justify-center rounded-full border border-gray-300 hover:border-gray-400">
<svg
width="16"
height="15"
viewBox="0 0 16 15"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.00094 0.360001C6.09046 0.360001 5.85022 0.368801 5.09958 0.402241C4.34894 0.437441 3.83766 0.555361 3.38974 0.729601C2.9199 0.906321 2.49433 1.18353 2.14278 1.54184C1.78468 1.89357 1.50751 2.31909 1.33054 2.7888C1.1563 3.23584 1.0375 3.748 1.00318 4.496C0.969738 5.2484 0.960937 5.48776 0.960937 7.40088C0.960937 9.31224 0.969738 9.5516 1.00318 10.3022C1.03838 11.052 1.1563 11.5633 1.33054 12.0112C1.51094 12.4741 1.75118 12.8666 2.14278 13.2582C2.5335 13.6498 2.92598 13.8909 3.38886 14.0704C3.83766 14.2446 4.34806 14.3634 5.09782 14.3978C5.84934 14.4312 6.0887 14.44 8.00094 14.44C9.91318 14.44 10.1517 14.4312 10.9032 14.3978C11.6521 14.3626 12.1651 14.2446 12.613 14.0704C13.0826 13.8936 13.5078 13.6164 13.8591 13.2582C14.2507 12.8666 14.4909 12.4741 14.6713 12.0112C14.8447 11.5633 14.9635 11.052 14.9987 10.3022C15.0321 9.5516 15.0409 9.31224 15.0409 7.4C15.0409 5.48776 15.0321 5.2484 14.9987 4.49688C14.9635 3.748 14.8447 3.23584 14.6713 2.7888C14.4944 2.31908 14.2172 1.89356 13.8591 1.54184C13.5077 1.1834 13.0821 0.906169 12.6121 0.729601C12.1633 0.555361 11.6512 0.436561 10.9023 0.402241C10.1508 0.368801 9.9123 0.360001 7.99918 0.360001H8.00182H8.00094ZM7.36998 1.62896H8.00182C9.8815 1.62896 10.1041 1.63512 10.846 1.66944C11.5324 1.70024 11.9055 1.81552 12.1537 1.91144C12.4819 2.03904 12.7169 2.19216 12.9633 2.43856C13.2097 2.68496 13.3619 2.91904 13.4895 3.24816C13.5863 3.49544 13.7007 3.86856 13.7315 4.55496C13.7658 5.2968 13.7729 5.51944 13.7729 7.39824C13.7729 9.27704 13.7658 9.50056 13.7315 10.2424C13.7007 10.9288 13.5854 11.301 13.4895 11.5492C13.3766 11.8549 13.1965 12.1313 12.9624 12.3579C12.716 12.6043 12.4819 12.7566 12.1528 12.8842C11.9064 12.981 11.5333 13.0954 10.846 13.127C10.1041 13.1605 9.8815 13.1684 8.00182 13.1684C6.12214 13.1684 5.89862 13.1605 5.15678 13.127C4.47038 13.0954 4.09814 12.981 3.84998 12.8842C3.54418 12.7715 3.26753 12.5916 3.04038 12.3579C2.80608 12.1309 2.62565 11.8543 2.51238 11.5483C2.41646 11.301 2.30118 10.9279 2.27038 10.2415C2.23694 9.49968 2.2299 9.27704 2.2299 7.39648C2.2299 5.5168 2.23694 5.29504 2.27038 4.5532C2.30206 3.8668 2.41646 3.49368 2.51326 3.24552C2.64086 2.91728 2.79398 2.68232 3.04038 2.43592C3.28678 2.18952 3.52086 2.03728 3.84998 1.90968C4.09814 1.81288 4.47038 1.69848 5.15678 1.6668C5.80622 1.63688 6.0579 1.62808 7.36998 1.6272V1.62896ZM11.7594 2.7976C11.6485 2.7976 11.5386 2.81945 11.4361 2.86191C11.3336 2.90436 11.2405 2.96659 11.1621 3.04504C11.0836 3.12348 11.0214 3.21661 10.9789 3.31911C10.9365 3.42161 10.9146 3.53146 10.9146 3.6424C10.9146 3.75334 10.9365 3.8632 10.9789 3.96569C11.0214 4.06819 11.0836 4.16132 11.1621 4.23976C11.2405 4.31821 11.3336 4.38044 11.4361 4.42289C11.5386 4.46535 11.6485 4.4872 11.7594 4.4872C11.9835 4.4872 12.1984 4.3982 12.3568 4.23976C12.5152 4.08133 12.6042 3.86646 12.6042 3.6424C12.6042 3.41835 12.5152 3.20347 12.3568 3.04504C12.1984 2.88661 11.9835 2.7976 11.7594 2.7976ZM8.00182 3.78496C7.52228 3.77748 7.04604 3.86547 6.60084 4.0438C6.15563 4.22214 5.75035 4.48726 5.40859 4.82373C5.06683 5.1602 4.79542 5.5613 4.61016 6.00367C4.4249 6.44604 4.32949 6.92084 4.32949 7.40044C4.32949 7.88004 4.4249 8.35484 4.61016 8.79721C4.79542 9.23958 5.06683 9.64068 5.40859 9.97715C5.75035 10.3136 6.15563 10.5787 6.60084 10.7571C7.04604 10.9354 7.52228 11.0234 8.00182 11.0159C8.95093 11.0011 9.85616 10.6137 10.5221 9.93726C11.1881 9.26084 11.5613 8.34967 11.5613 7.40044C11.5613 6.45121 11.1881 5.54004 10.5221 4.86362C9.85616 4.1872 8.95093 3.79977 8.00182 3.78496ZM8.00182 5.05304C8.62427 5.05304 9.22123 5.30031 9.66137 5.74045C10.1015 6.18059 10.3488 6.77755 10.3488 7.4C10.3488 8.02245 10.1015 8.61941 9.66137 9.05955C9.22123 9.49969 8.62427 9.74696 8.00182 9.74696C7.37937 9.74696 6.78241 9.49969 6.34227 9.05955C5.90213 8.61941 5.65486 8.02245 5.65486 7.4C5.65486 6.77755 5.90213 6.18059 6.34227 5.74045C6.78241 5.30031 7.37937 5.05304 8.00182 5.05304Z"
fill="#27272A"
></path>
</svg>
</div>
</a>
</div>
</div>
}
</div>
</div>
<div className="w-full p-6 md:w-1/2 lg:w-2/12">
<div className="h-full">
<h3 className="tracking-px mb-9 text-xs font-semibold uppercase text-gray-500">
Company
</h3>
<ul>
<li className="mb-4">
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Features
</a>
</li>
<li className="mb-4">
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Pricing
</a>
</li>
<li className="mb-4">
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Affiliate Program
</a>
</li>
<li>
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Press Kit
</a>
</li>
</ul>
</div>
</div>
<div className="w-full p-6 md:w-1/2 lg:w-2/12">
<div className="h-full">
<h3 className="tracking-px mb-9 text-xs font-semibold uppercase text-gray-500">
Support
</h3>
<ul>
<li className="mb-4">
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Account
</a>
</li>
<li className="mb-4">
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Help
</a>
</li>
<li className="mb-4">
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Contact Us
</a>
</li>
<li>
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Customer Support
</a>
</li>
</ul>
</div>
</div>
<div className="w-full p-6 md:w-1/2 lg:w-3/12">
<div className="h-full">
<h3 className="tracking-px mb-9 text-xs font-semibold uppercase text-gray-500">
Legals
</h3>
<ul>
<li className="mb-4">
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Terms &amp; Conditions
</a>
</li>
<li className="mb-4">
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Privacy Policy
</a>
</li>
<li>
<a
className=" text-base font-medium text-gray-900 hover:text-gray-700"
href="#"
>
Licensing
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
);
}
6 changes: 6 additions & 0 deletions src/pages/_app.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import ExampleNavbarOne from '@/components/Headers/MainHeader'
import FooterFour from '@/components/Footer/footer'
import '@/styles/globals.css'
import Head from 'next/head'

Expand All @@ -9,6 +10,11 @@ export default function App({ Component, pageProps }) {
<link rel="shortcut icon" href="/assets/favicon.svg" type="image/x-icon" />
</Head>
<ExampleNavbarOne/>
<div className='mb-96'>


</div>
<FooterFour/>
<Component {...pageProps} />
</>
}

0 comments on commit bb38723

Please sign in to comment.