adding missing components
This commit is contained in:
parent
dc51187596
commit
f8eb328e0d
|
@ -0,0 +1,187 @@
|
||||||
|
import MangoPill from '../components/MangoPill'
|
||||||
|
import Button from './Button'
|
||||||
|
|
||||||
|
const FooterSection = () => {
|
||||||
|
return (
|
||||||
|
<div className="bg-bg-texture bg-cover bg-bottom bg-no-repeat">
|
||||||
|
<div className="max-w-7xl mx-auto ">
|
||||||
|
<section className="py-8 px-4">
|
||||||
|
<div className="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:py-16 lg:px-8">
|
||||||
|
<h2 className="inline text-3xl font-extrabold sm:block sm:text-4xl">
|
||||||
|
Want product news and updates?{' '}
|
||||||
|
<span className="text-transparent bg-clip-text bg-gradient-to-r from-mango-red via-mango-yellow to-mango-green sm:block sm:text-4xl">
|
||||||
|
Sign up for our newsletter.
|
||||||
|
</span>
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<form className="mt-8 sm:flex">
|
||||||
|
<label className="sr-only">Email address</label>
|
||||||
|
<input
|
||||||
|
id="email-address"
|
||||||
|
name="email"
|
||||||
|
type="email"
|
||||||
|
autoComplete="email"
|
||||||
|
required
|
||||||
|
className="w-full px-5 py-2 placeholder-gray-500 sm:max-w-xs border-gray-300 rounded-full"
|
||||||
|
placeholder="Enter your email"
|
||||||
|
/>
|
||||||
|
<div className="mt-3 rounded-md shadow sm:mt-0 sm:ml-3 sm:flex-shrink-0">
|
||||||
|
<Button><span className="">Sign me up!</span></Button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
<div className="w-full mt-4">
|
||||||
|
<p className="text-xl text-gray-400">
|
||||||
|
We promise to never spam and only send alpha.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer className="py-20">
|
||||||
|
<div className="container px-4 mx-auto">
|
||||||
|
<div className="flex flex-wrap -mx-4 mb-8 lg:mb-16">
|
||||||
|
<div className="w-full lg:w-1/3 px-4 mb-12 lg:mb-0">
|
||||||
|
<a className="text-gray-600 text-2xl leading-none" href="#">
|
||||||
|
<img
|
||||||
|
className="h-8"
|
||||||
|
src="img/logoMango.png"
|
||||||
|
alt=""
|
||||||
|
width="auto"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
<p className="mt-5 mb-6 max-w-xs text-gray-500 leading-loose">
|
||||||
|
Mango is a decentralized autonomous organization.{' '}
|
||||||
|
</p>
|
||||||
|
<div>
|
||||||
|
<a
|
||||||
|
className="inline-block h-6 mr-8"
|
||||||
|
href="https://github.com/blockworks-foundation"
|
||||||
|
>
|
||||||
|
<img className="mx-auto" src="socials/github.svg" />
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
className="inline-block h-6 mr-8"
|
||||||
|
href="https://discord.gg/67jySBhxrg"
|
||||||
|
>
|
||||||
|
<img className="mx-auto" src="socials/discord.svg" />
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
className="inline-block h-6"
|
||||||
|
href="https://twitter.com/mangomarkets"
|
||||||
|
>
|
||||||
|
<img className="mx-auto" src="socials/twitter.svg" />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="w-full lg:w-2/3 px-4">
|
||||||
|
<div className="flex flex-wrap justify-between">
|
||||||
|
<div className="w-1/2 lg:w-1/4 mb-8 lg:mb-0">
|
||||||
|
<h3 className="mb-6 text-lg font-bold font-heading">
|
||||||
|
Products
|
||||||
|
</h3>
|
||||||
|
<ul className="text-sm">
|
||||||
|
<li className="mb-4">
|
||||||
|
<a
|
||||||
|
className="text-gray-500 hover:text-gray-600"
|
||||||
|
href="https://trade.mango.markets/"
|
||||||
|
>
|
||||||
|
Spot Markets
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li className="mb-4">
|
||||||
|
<a
|
||||||
|
className="text-gray-500 hover:text-gray-600"
|
||||||
|
href="#"
|
||||||
|
>
|
||||||
|
Perpetual Futures
|
||||||
|
</a>{' '}
|
||||||
|
<MangoPill />
|
||||||
|
</li>
|
||||||
|
<li className="mb-4">
|
||||||
|
<a
|
||||||
|
className="text-gray-500 hover:text-gray-600"
|
||||||
|
href="https://trade.mango.markets/borrow"
|
||||||
|
>
|
||||||
|
Decentralized Lending
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li className="mb-4">
|
||||||
|
<a
|
||||||
|
className="text-gray-500 hover:text-gray-600"
|
||||||
|
href="#"
|
||||||
|
>
|
||||||
|
Liquidator Program
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div className="w-1/2 lg:w-1/4 mb-8 lg:mb-0">
|
||||||
|
<h3 className="mb-6 text-lg font-bold font-heading">
|
||||||
|
Developers
|
||||||
|
</h3>
|
||||||
|
<ul className="text-sm">
|
||||||
|
<li className="mb-4">
|
||||||
|
<a
|
||||||
|
className="text-gray-500 hover:text-gray-600"
|
||||||
|
href="https://docs.mango.markets/"
|
||||||
|
>
|
||||||
|
Explore the docs
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li className="mb-4">
|
||||||
|
<a
|
||||||
|
className="text-gray-500 hover:text-gray-600"
|
||||||
|
href="https://trello.com/c/0iz8GfW6/32-how-to-use-this-board"
|
||||||
|
>
|
||||||
|
Start contributing
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li className="mb-4">
|
||||||
|
<a
|
||||||
|
className="text-gray-500 hover:text-gray-600"
|
||||||
|
href="https://gitlab.com/OpinionatedGeek/mango-explorer/-/blob/master/mango/marketmaking/simplemarketmaker.py"
|
||||||
|
>
|
||||||
|
Become a market maker
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div className="w-1/2 lg:w-1/4">
|
||||||
|
<h3 className="mb-6 text-lg font-bold font-heading">
|
||||||
|
Contact
|
||||||
|
</h3>
|
||||||
|
<ul className="text-sm">
|
||||||
|
<li className="mb-4">
|
||||||
|
<a
|
||||||
|
className="text-gray-500 hover:text-gray-600"
|
||||||
|
href="https://discord.gg/67jySBhxrg"
|
||||||
|
>
|
||||||
|
Discord
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li className="mb-4">
|
||||||
|
<a
|
||||||
|
className="text-gray-500 hover:text-gray-600"
|
||||||
|
href="https://twitter.com/mangomarkets"
|
||||||
|
>
|
||||||
|
Twitter
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="pt-8">
|
||||||
|
<p className="lg:text-center text-sm text-gray-400">
|
||||||
|
All rights reserved © Blockworks Foundation 2021
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default FooterSection
|
|
@ -0,0 +1,14 @@
|
||||||
|
const MangoPill = () => {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
className="inline-flex items-center relative h-6 px-2 py-1 bg-gradient-to-br from-mango-red to-yellow-500
|
||||||
|
rounded-full lg:-top-3 md:-top-3 sm:-top-3 xs:top-2"
|
||||||
|
>
|
||||||
|
<p className="text-white text-xs uppercase font-bold tracking-widest subpixel-antialiased">
|
||||||
|
Soon
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default MangoPill
|
|
@ -0,0 +1,14 @@
|
||||||
|
const MangoSale = () => {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
className="inline-flex items-center relative h-6 -top-4 px-2 py-1 bg-gradient-to-br from-mango-red to-yellow-500
|
||||||
|
rounded-full"
|
||||||
|
>
|
||||||
|
<p className="text-white text-xs uppercase font-bold tracking-widest subpixel-antialiased">
|
||||||
|
Sale
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default MangoSale
|
Loading…
Reference in New Issue