add more components
This commit is contained in:
saml33
parent
04b65602f0
commit
cb6baf6523
|
|
@ -1,73 +1,168 @@
|
|||
import { CurrencyDollarIcon } from '@heroicons/react/20/solid'
|
||||
import { ChevronRightIcon, CurrencyDollarIcon } from '@heroicons/react/20/solid'
|
||||
import { useTranslation } from 'next-i18next'
|
||||
import { ReactNode } from 'react'
|
||||
import Button from '../shared/Button'
|
||||
import BotOne from '../icons/BotOne'
|
||||
import BotThree from '../icons/BotThree'
|
||||
import BotTwo from '../icons/BotTwo'
|
||||
import Button, { LinkButton } from '../shared/Button'
|
||||
import HeadingTagline from '../shared/HeadingTagline'
|
||||
import SectionWrapper from '../shared/SectionWrapper'
|
||||
import Steps from '../shared/Steps'
|
||||
import HomeTopSection from './HomeTopSection'
|
||||
|
||||
const STEPS = [
|
||||
{
|
||||
desc: 'home:get-wallet-desc',
|
||||
imagePath: '/images/img-placeholder.png',
|
||||
title: 'home:get-wallet',
|
||||
},
|
||||
{
|
||||
desc: 'home:fund-wallet-desc',
|
||||
imagePath: '/images/img-placeholder.png',
|
||||
title: 'home:fund-wallet',
|
||||
},
|
||||
]
|
||||
|
||||
const HomePage = () => {
|
||||
const { t } = useTranslation('home')
|
||||
const { t } = useTranslation(['common', 'home'])
|
||||
return (
|
||||
<>
|
||||
<HomeTopSection />
|
||||
<SectionWrapper>
|
||||
<div className="grid grid-cols-6 gap-x-8 gap-y-12">
|
||||
<IconWithText
|
||||
desc={t('competitive-fees-desc')}
|
||||
desc={t('home:competitive-fees-desc')}
|
||||
icon={<CurrencyDollarIcon className="h-6 w-6 text-th-fgd-2" />}
|
||||
title={t('competitive-fees')}
|
||||
title={t('home:competitive-fees')}
|
||||
/>
|
||||
<IconWithText
|
||||
desc={t('lightning-execution-desc')}
|
||||
desc={t('home:lightning-execution-desc')}
|
||||
icon={<CurrencyDollarIcon className="h-6 w-6 text-th-fgd-2" />}
|
||||
title={t('lightning-execution')}
|
||||
title={t('home:lightning-execution')}
|
||||
/>
|
||||
<IconWithText
|
||||
desc={t('deeply-liquid-desc')}
|
||||
desc={t('home:deeply-liquid-desc')}
|
||||
icon={<CurrencyDollarIcon className="h-6 w-6 text-th-fgd-2" />}
|
||||
title={t('deeply-liquid')}
|
||||
title={t('home:deeply-liquid')}
|
||||
/>
|
||||
<IconWithText
|
||||
desc={t('competitive-fees-desc')}
|
||||
desc={t('home:competitive-fees-desc')}
|
||||
icon={<CurrencyDollarIcon className="h-6 w-6 text-th-fgd-2" />}
|
||||
title={t('competitive-fees')}
|
||||
title={t('home:competitive-fees')}
|
||||
/>
|
||||
<IconWithText
|
||||
desc={t('competitive-fees-desc')}
|
||||
desc={t('home:competitive-fees-desc')}
|
||||
icon={<CurrencyDollarIcon className="h-6 w-6 text-th-fgd-2" />}
|
||||
title={t('competitive-fees')}
|
||||
title={t('home:competitive-fees')}
|
||||
/>
|
||||
<IconWithText
|
||||
desc={t('competitive-fees-desc')}
|
||||
desc={t('home:competitive-fees-desc')}
|
||||
icon={<CurrencyDollarIcon className="h-6 w-6 text-th-fgd-2" />}
|
||||
title={t('competitive-fees')}
|
||||
title={t('home:competitive-fees')}
|
||||
/>
|
||||
</div>
|
||||
</SectionWrapper>
|
||||
<SectionWrapper>
|
||||
<div className="grid grid-cols-12 gap-8">
|
||||
<div className="col-span-6 h-96 flex justify-center relative">
|
||||
<div className="col-span-7 h-96 flex justify-center relative">
|
||||
<img
|
||||
className="absolute z-10 w-full h-auto max-w-[440px]"
|
||||
src="/images/swap-mobile.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div className="col-span-6">
|
||||
<h2 className="mb-4">{t('swap-heading')}</h2>
|
||||
<p className="text-lg mb-6">{t('swap-desc')}</p>
|
||||
<h3 className="mb-3">{t('swap-highlight-1-heading')}</h3>
|
||||
<p className="mb-6">{t('swap-highlight-1-desc')}</p>
|
||||
<h3 className="mb-3">{t('swap-highlight-2-heading')}</h3>
|
||||
<p className="mb-6">{t('swap-highlight-2-desc')}</p>
|
||||
<h3 className="mb-3">{t('swap-highlight-3-heading')}</h3>
|
||||
<p className="mb-8">{t('swap-highlight-3-desc')}</p>
|
||||
<Button size="large">{t('swap-now')}</Button>
|
||||
<div className="col-span-5">
|
||||
<h2 className="mb-4">{t('home:swap-heading')}</h2>
|
||||
<p className="text-lg mb-6">{t('home:swap-desc')}</p>
|
||||
<h3 className="mb-3">{t('home:swap-highlight-1-heading')}</h3>
|
||||
<p className="mb-6">{t('home:swap-highlight-1-desc')}</p>
|
||||
<h3 className="mb-3">{t('home:swap-highlight-2-heading')}</h3>
|
||||
<p className="mb-6">{t('home:swap-highlight-2-desc')}</p>
|
||||
<h3 className="mb-3">{t('home:swap-highlight-3-heading')}</h3>
|
||||
<p className="mb-8">{t('home:swap-highlight-3-desc')}</p>
|
||||
<Button size="large">{t('home:swap-now')}</Button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="absolute w-1/2 h-48 -top-20 left-0 bg-th-down mix-blend-screen rounded-full filter blur-3xl opacity-20 animate-blob" />
|
||||
<div className="absolute w-2/3 h-48 -bottom-20 right-0 bg-th-button mix-blend-screen rounded-full filter blur-3xl opacity-10 animate-blob" />
|
||||
</SectionWrapper>
|
||||
<SectionWrapper>
|
||||
<div className="text-center">
|
||||
<h2 className="mb-4">{t('home:built-for-traders-holders')}</h2>
|
||||
<p className="text-lg">{t('home:traders-holders-desc')}</p>
|
||||
</div>
|
||||
<InlineImageWithText
|
||||
desc={t('home:token-listings-desc')}
|
||||
title={t('home:token-listings')}
|
||||
imageSrc="/images/img-placeholder.png"
|
||||
linkPath="#"
|
||||
linkText={t('learn-more')}
|
||||
/>
|
||||
<InlineImageWithText
|
||||
desc={t('home:token-listings-desc')}
|
||||
title={t('home:token-listings')}
|
||||
imageSrc="/images/img-placeholder.png"
|
||||
linkPath="#"
|
||||
linkText={t('learn-more')}
|
||||
reverse
|
||||
/>
|
||||
<InlineImageWithText
|
||||
desc={t('home:token-listings-desc')}
|
||||
title={t('home:token-listings')}
|
||||
imageSrc="/images/img-placeholder.png"
|
||||
linkPath="#"
|
||||
linkText={t('learn-more')}
|
||||
/>
|
||||
<InlineImageWithText
|
||||
desc={t('home:token-listings-desc')}
|
||||
title={t('home:token-listings')}
|
||||
imageSrc="/images/img-placeholder.png"
|
||||
linkPath="#"
|
||||
linkText={t('learn-more')}
|
||||
reverse
|
||||
/>
|
||||
</SectionWrapper>
|
||||
<SectionWrapper>
|
||||
<h2 className="mb-4">{t('home:trading-bots-welcome')}</h2>
|
||||
<p className="text-lg">{t('home:trading-bots-welcome-desc')}</p>
|
||||
<div className="grid grid-cols-6 gap-x-8 gap-y-12 mt-12">
|
||||
<IconWithText
|
||||
desc={t('home:competitive-fees-desc')}
|
||||
icon={<BotOne className="h-16 w-16 mb-4 text-th-fgd-2" />}
|
||||
linkPath="#"
|
||||
linkText={t('home:market-maker-link')}
|
||||
noBorder
|
||||
title={t('home:competitive-fees')}
|
||||
/>
|
||||
<IconWithText
|
||||
desc={t('home:lightning-execution-desc')}
|
||||
icon={<BotTwo className="h-16 w-16 mb-4 text-th-fgd-2" />}
|
||||
linkPath="#"
|
||||
linkText={t('home:liquidator-link')}
|
||||
noBorder
|
||||
title={t('home:lightning-execution')}
|
||||
/>
|
||||
<IconWithText
|
||||
desc={t('home:deeply-liquid-desc')}
|
||||
icon={<BotThree className="h-16 w-16 mb-4 text-th-fgd-2" />}
|
||||
linkPath="#"
|
||||
linkText={t('home:explore-the-code')}
|
||||
noBorder
|
||||
title={t('home:deeply-liquid')}
|
||||
/>
|
||||
</div>
|
||||
</SectionWrapper>
|
||||
<SectionWrapper noPaddingX>
|
||||
<div className="grid grid-cols-12 gap-8 md:gap-12 flex flex-col sm:flex-row items-end mb-8 md:mb-16">
|
||||
<div className="col-span-12 sm:col-span-6 md:col-span-7 lg:px-20 px-6">
|
||||
<HeadingTagline text={t('home:getting-started')} />
|
||||
</div>
|
||||
<div className="col-span-12 sm:col-span-6 md:col-span-5 lg:px-20 px-6">
|
||||
<h2>{t('home:new-to-mango')}</h2>
|
||||
</div>
|
||||
</div>
|
||||
<Steps steps={STEPS} />
|
||||
</SectionWrapper>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -77,19 +172,82 @@ export default HomePage
|
|||
const IconWithText = ({
|
||||
desc,
|
||||
icon,
|
||||
linkPath,
|
||||
linkText,
|
||||
noBorder,
|
||||
title,
|
||||
}: {
|
||||
desc: string
|
||||
icon: ReactNode
|
||||
linkPath?: string
|
||||
linkText?: string
|
||||
noBorder?: boolean
|
||||
title: string
|
||||
}) => {
|
||||
return (
|
||||
<div className="col-span-6 sm:col-span-3 md:col-span-2">
|
||||
<div className="h-10 w-10 rounded-full border-2 border-th-fgd-2 flex items-center justify-center mb-2">
|
||||
<div
|
||||
className={`${
|
||||
noBorder
|
||||
? ''
|
||||
: 'flex items-center justify-center h-10 w-10 rounded-full border-2 border-th-fgd-2'
|
||||
} mb-2`}
|
||||
>
|
||||
{icon}
|
||||
</div>
|
||||
<h3 className="mb-3">{title}</h3>
|
||||
<p>{desc}</p>
|
||||
{linkText ? (
|
||||
<a
|
||||
className="block mt-6"
|
||||
href={linkPath}
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
<LinkButton className="flex items-center">
|
||||
{linkText}
|
||||
<ChevronRightIcon className="h-5 w-5 ml-1" />
|
||||
</LinkButton>
|
||||
</a>
|
||||
) : null}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const InlineImageWithText = ({
|
||||
desc,
|
||||
title,
|
||||
imageSrc,
|
||||
linkPath,
|
||||
linkText,
|
||||
reverse,
|
||||
}: {
|
||||
desc: string
|
||||
title: string
|
||||
imageSrc: string
|
||||
linkPath: string
|
||||
linkText: string
|
||||
reverse?: boolean
|
||||
}) => {
|
||||
return (
|
||||
<div
|
||||
className={`flex flex-col md:flex-row md:items-center md:space-x-10 mt-12 ${
|
||||
reverse ? 'md:flex-row-reverse md:justify-between' : ''
|
||||
}`}
|
||||
>
|
||||
<div className="w-full md:w-1/2 flex justify-center mb-8 md:mb-0">
|
||||
<img className="w-1/2 sm:w-auto h-auto" src={imageSrc} alt="" />
|
||||
</div>
|
||||
<div className="col-span-12 md:col-span-6">
|
||||
<h3 className="mb-3">{title}</h3>
|
||||
<p className="mb-6">{desc}</p>
|
||||
<a href={linkPath} rel="noopener noreferrer" target="_blank">
|
||||
<LinkButton className="flex items-center">
|
||||
{linkText}
|
||||
<ChevronRightIcon className="h-5 w-5 ml-1" />
|
||||
</LinkButton>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
const BotOne = ({ className }: { className?: string }) => {
|
||||
return (
|
||||
<svg
|
||||
className={`${className}`}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 64 74"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M24.2441 17.5252V8.54871H39.5799V17.5252H24.2441ZM25.8967 15.8729H37.9266L37.9271 10.2019H25.8967V15.8729Z"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M59.4205 33.0629C61.965 33.1777 64 35.2619 64 37.8134C64 39.424 63.1888 40.8462 61.9542 41.7084L55.6467 49.4802C56.0046 50.1468 56.2085 50.9055 56.2085 51.7105C56.2085 54.3367 54.0551 56.4717 51.4095 56.4717C48.7633 56.4717 46.611 54.3356 46.611 51.7105C46.611 49.0833 48.7638 46.9477 51.4095 46.9477C52.6332 46.9477 53.748 47.4094 54.5967 48.1604L59.1316 42.5725C56.5171 42.5339 54.4016 40.4164 54.4016 37.8139C54.4016 36.012 55.4153 34.441 56.9077 33.6323L53.2801 31.7989L53.2806 41.9379C53.2806 43.5877 51.9283 44.9306 50.2657 44.9306H35.2273V51.4367C41.7153 52.8941 46.5942 58.5742 46.9304 65.2172L46.9739 66.0784H41.8175C40.8231 70.6574 36.7286 74 31.9135 74C27.099 74 23.0045 70.6574 22.0095 66.0784H16.8531L16.8967 65.2172C17.2333 58.575 22.1111 52.894 28.5987 51.4367V44.9306H13.5617C11.8997 44.9306 10.5467 43.5881 10.5467 41.9379V31.5569L7.0944 33.3018C8.58632 34.1109 9.59996 35.6819 9.59996 37.484C9.59996 40.0864 7.48457 42.205 4.86999 42.2426L9.40394 47.8304C10.2527 47.0794 11.368 46.6177 12.5917 46.6177C15.2384 46.6177 17.3907 48.7553 17.3907 51.3815C17.3907 54.0076 15.2384 56.1432 12.5917 56.1432C9.94497 56.1432 7.79267 54.0066 7.79267 51.3815C7.79267 50.5754 7.99707 49.8177 8.35397 49.1511L2.04859 41.3793C0.811333 40.5168 0 39.094 0 37.484C0 34.9314 2.03557 32.8472 4.58003 32.7325L10.5452 29.7177V27.2162C10.5452 25.5664 11.8975 24.2235 13.5602 24.2235H20.5068V11.3152C20.5068 5.07617 25.6232 0 31.9116 0C38.1999 0 43.3148 5.0767 43.3148 11.3152L43.3154 24.2246H50.2646C51.9266 24.2246 53.2795 25.5671 53.2795 27.2172V29.9596L59.4205 33.0629ZM15.613 50.5611C15.2478 49.2372 14.037 48.2572 12.5902 48.2572C10.855 48.2572 9.44397 49.6588 9.44345 51.3811C9.44345 53.1028 10.855 54.5034 12.5902 54.5034C14.0381 54.5034 15.2478 53.5227 15.613 52.2009H12.5902V50.5611H15.613ZM1.6507 37.4841C1.6507 39.2058 3.06277 40.6064 4.79795 40.6064C6.53312 40.6064 7.94466 39.2058 7.94466 37.4841C7.94466 35.7624 6.53312 34.3613 4.79795 34.3613C3.06224 34.3613 1.6507 35.7624 1.6507 37.4841ZM31.9111 1.63935C26.5336 1.63935 22.159 5.98012 22.159 11.3152L22.1585 24.2235H41.6616V11.3152C41.6616 5.97999 37.2869 1.63935 31.9111 1.63935ZM23.7138 66.0794C24.6724 69.7298 28.0054 72.3617 31.9116 72.3617C35.8173 72.3617 39.1497 69.7298 40.1094 66.0794H23.7138ZM18.6183 64.439H45.205C44.5654 59.0226 40.5398 54.4647 35.2257 53.1135V59.9423H28.5976V53.1135C23.2834 54.4652 19.2584 59.0226 18.6183 64.439ZM30.2498 58.303H33.5724V44.9313H30.2498V58.303ZM50.2639 43.2912C51.0151 43.2912 51.6267 42.6848 51.6267 41.9384L51.6272 27.2171C51.6272 26.4712 51.0156 25.8643 50.2644 25.8643H13.5609C12.8097 25.8643 12.1981 26.4707 12.1981 27.2171L12.1976 41.9384C12.1976 42.6843 12.8082 43.2912 13.5604 43.2912H50.2639ZM59.2015 34.6911C57.4653 34.6911 56.0532 36.0917 56.0532 37.8134C56.0532 39.5346 57.4653 40.9346 59.2015 40.9357C60.9358 40.9357 62.3473 39.5351 62.3473 37.8134C62.3473 36.0917 60.9358 34.6911 59.2015 34.6911ZM48.3861 52.5301C48.7518 53.8525 49.961 54.8315 51.4078 54.8315C53.143 54.8315 54.554 53.4304 54.5545 51.7101C54.5545 49.9884 53.143 48.5873 51.4078 48.5873C49.961 48.5873 48.7513 49.5679 48.3861 50.8902H51.4078V52.5301H48.3861Z"
|
||||
/>
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
export default BotOne
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
const BotThree = ({ className }: { className?: string }) => {
|
||||
return (
|
||||
<svg
|
||||
className={`${className}`}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 38 78"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M13.4492 66.9626C13.4492 63.9183 15.9394 61.4425 19.0001 61.4425C22.0596 61.4425 24.5486 63.9183 24.5492 66.9626C24.5492 70.0069 22.0601 72.4826 19.0001 72.4826C15.9394 72.4826 13.4492 70.0069 13.4492 66.9626ZM15.2556 66.9615C15.2556 69.0156 16.9356 70.6854 19.0001 70.6854C21.0634 70.6854 22.7428 69.0156 22.7428 66.9615C22.7428 64.9075 21.064 63.2377 19.0001 63.2377C16.9344 63.2377 15.2556 64.9081 15.2556 66.9615Z"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M15.1267 22.4034C13.7449 22.4034 12.6211 23.5218 12.6211 24.8957C12.6211 26.2695 13.7449 27.3879 15.1267 27.3879C16.5085 27.3879 17.6329 26.2695 17.6329 24.8957C17.6329 23.5218 16.5085 22.4034 15.1267 22.4034ZM15.1267 25.5915C14.7411 25.5915 14.4276 25.2797 14.4276 24.8962C14.4276 24.5127 14.7417 24.2008 15.1267 24.2008C15.5134 24.2008 15.8264 24.5127 15.8264 24.8962C15.8264 25.2797 15.5128 25.5915 15.1267 25.5915Z"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M20.3672 24.8957C20.3672 23.5218 21.4916 22.4034 22.8734 22.4034C24.2552 22.4034 25.379 23.5218 25.379 24.8957C25.379 26.2695 24.2551 27.3879 22.8734 27.3879C21.4915 27.3879 20.3672 26.2695 20.3672 24.8957ZM22.1737 24.8962C22.1737 25.2797 22.4867 25.5915 22.8734 25.5915C23.2589 25.5915 23.5725 25.2797 23.5725 24.8962C23.5725 24.5127 23.2589 24.2008 22.8734 24.2008C22.4878 24.2008 22.1737 24.5127 22.1737 24.8962Z"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M26.4827 19.5042H11.5148C9.84047 19.5042 8.47852 20.8588 8.47852 22.5242V27.2672C8.47852 28.9326 9.84157 30.2873 11.5148 30.2873H26.4842C28.1585 30.2873 29.5216 28.9326 29.5216 27.2672V22.5242C29.521 20.8588 28.1583 19.5042 26.4827 19.5042ZM27.7137 27.2672C27.7137 27.9417 27.162 28.491 26.4827 28.491H11.5148C10.8367 28.491 10.2844 27.9423 10.2844 27.2672V22.5242C10.2844 21.8497 10.8361 21.3004 11.5148 21.3004H26.4842C27.1635 21.3004 27.7151 21.8491 27.7151 22.5242L27.7137 27.2672Z"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M35.1151 28.958C36.7067 28.958 38 27.6705 38 26.0886V23.7025C38 22.1194 36.7055 20.8324 35.1151 20.8324H34.1478C33.5049 18.4553 32.3079 16.2474 30.6127 14.393L30.3445 14.0992H19.9038V11.8462H23.7747V6.67177H15.5011L14.1788 5.35547C14.6784 4.78586 14.9908 4.051 14.9908 3.23834C14.9908 1.45227 13.5303 0 11.735 0C9.93938 0 8.47931 1.45271 8.47931 3.23834C8.47931 5.02441 9.93981 6.47669 11.735 6.47669C12.0424 6.47669 12.3338 6.42029 12.6156 6.34077L14.7532 8.468H21.9688V10.0488H18.0979V14.0986L7.65563 14.0998L7.38631 14.3936C5.69094 16.248 4.49519 18.4571 3.85217 20.833H2.88487C1.29329 20.833 0 22.1206 0 23.7031V26.0892C0 27.6711 1.29446 28.9586 2.88487 28.9586H3.86294C4.46737 31.1846 5.54292 33.2166 6.99617 34.9328H6.70247C3.06513 34.9328 0.10609 37.8767 0.10609 41.4939V47.5435C0.10609 50.647 2.28568 53.2487 5.20001 53.9271V67.8593H7.9483C8.41097 73.5272 13.1868 78 19.0013 78C24.8158 78 29.591 73.5272 30.0526 67.8593H32.9545L32.9539 53.8877C35.7917 53.154 37.8953 50.5919 37.8953 47.5425V41.4929C37.8953 37.875 34.9355 34.9318 31.2977 34.9318H31.004C32.4561 33.2161 33.5328 31.1836 34.1372 28.9576L35.1151 28.958ZM10.2856 3.23898C10.2856 2.44379 10.936 1.79691 11.7354 1.79691C12.5349 1.79691 13.1852 2.44379 13.1852 3.23898C13.1852 4.03417 12.5349 4.68105 11.7354 4.68105C10.936 4.68105 10.2856 4.03417 10.2856 3.23898ZM35.1151 22.6286C35.7093 22.6286 36.1936 23.1102 36.1936 23.7024V26.0885C36.1936 26.6807 35.7093 27.1612 35.1151 27.1612H34.5107C34.6201 26.419 34.695 25.6662 34.695 24.8958C34.695 24.131 34.623 23.3765 34.5135 22.6304L35.1151 22.6298L35.1151 22.6286ZM2.88438 27.1607C2.29016 27.1607 1.80595 26.6791 1.80595 26.088V23.7019C1.80595 23.1098 2.29016 22.6282 2.88438 22.6282H3.48596C3.37653 23.3749 3.30452 24.1294 3.30452 24.8936C3.30452 25.6651 3.37936 26.418 3.48879 27.1589L2.88438 27.1607ZM19.0005 76.2037C13.8759 76.2037 9.70792 72.0579 9.70792 66.9613C9.70792 61.8653 13.8759 57.719 19.0005 57.719C24.1233 57.719 28.2913 61.8647 28.2913 66.9613C28.2913 72.0579 24.1227 76.2037 19.0005 76.2037ZM30.0513 66.0624C29.5886 60.3945 24.8139 55.9218 18.9999 55.9218C13.1853 55.9218 8.40839 60.3945 7.94695 66.0624H7.00517V54.1052H31.1467V66.063L30.0513 66.0624ZM36.0881 41.4926V47.5422C36.0881 50.1697 33.9385 52.3078 31.2969 52.3078H6.70112C4.05952 52.3078 1.91056 50.1697 1.91056 47.5422V41.4926C1.91056 38.8651 4.05894 36.7276 6.70112 36.7276H8.78999C11.5377 39.076 15.1007 40.5051 18.9993 40.5051C22.8963 40.5051 26.4604 39.076 29.2075 36.7276H31.2964C33.938 36.7282 36.0881 38.8661 36.0881 41.4926ZM19.0005 38.7089C11.3428 38.7087 5.11128 32.5119 5.11128 24.895C5.11128 21.5812 6.29801 18.401 8.46224 15.8952H29.5381C31.7023 18.3999 32.8891 21.58 32.8891 24.895C32.888 32.512 26.6572 38.7089 19.0005 38.7089Z"
|
||||
/>
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
export default BotThree
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
const BotTwo = ({ className }: { className?: string }) => {
|
||||
return (
|
||||
<svg
|
||||
className={`${className}`}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 64 74"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M23.7227 24.8859V15.4214H39.8911V24.8859H23.7227ZM25.5585 23.0575H38.0546V17.2496H25.5585V23.0575Z"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M61.0661 44.3367C62.7462 44.7499 63.9993 46.2512 63.9993 48.049C63.9993 49.8464 62.7469 51.3474 61.0651 51.7605V55.6042C62.7452 56.0174 63.9982 57.518 63.9982 59.3153H62.162C62.162 58.21 61.2589 57.3108 60.1471 57.3108C59.0381 57.3108 58.1355 58.2101 58.1355 59.3153H56.2993C56.2993 57.5185 57.5517 56.0162 59.2289 55.6042V51.7605C57.5517 51.3473 56.2993 49.8462 56.2993 48.05C56.2993 46.2526 57.5517 44.7509 59.2289 44.3377V41.8018C57.8462 41.4622 56.7621 40.3816 56.4214 39.0049H53.4871V56.8965H45.9449L45.9454 63.9507C49.6047 65.4043 52.2508 68.9392 52.3361 73.0669L52.3551 74H32.1718L32.1909 73.0669C32.2761 68.9392 34.9221 65.4054 38.5815 63.9519V56.8965H25.4161L25.4173 63.8291C29.0765 65.2821 31.7226 68.8164 31.8079 72.9441L31.827 73.8772H11.6437L11.6627 72.9441C11.748 68.8158 14.394 65.2815 18.0534 63.8279V56.8959H10.5111V39.2805H7.5768C7.23508 40.6571 6.15208 41.7354 4.76938 42.0757V44.611C6.44653 45.0242 7.69897 46.5248 7.69897 48.3221C7.69897 50.1189 6.44657 51.6212 4.76938 52.0332V55.8768C6.44653 56.2901 7.69897 57.7907 7.69897 59.5879H5.86272C5.86272 58.4826 4.9601 57.5834 3.85118 57.5834C2.73942 57.5834 1.83625 58.4827 1.83625 59.5879H0C0 57.7911 1.25299 56.2888 2.93313 55.8768V52.0332C1.25302 51.6199 0 50.1193 0 48.3221C0 46.5253 1.25299 45.023 2.93313 44.611V42.0745C1.25302 41.6614 0 40.1624 0 38.3651C0 36.2516 1.72795 34.5312 3.85133 34.5312C5.65541 34.5312 7.16312 35.7793 7.57695 37.451H10.5113V31.7234L19.8103 31.724V18.4498C19.8103 15.9725 20.5721 13.6708 21.873 11.7605L19.0868 8.85572C18.4873 9.14781 17.8216 9.32627 17.1104 9.32627C14.6084 9.32627 12.5721 7.30001 12.5721 4.80894C12.5721 2.31787 14.6078 0.291607 17.1104 0.291607C19.6112 0.291607 21.6464 2.31728 21.6464 4.80894C21.6464 5.92556 21.2216 6.93789 20.5438 7.7275L23.0371 10.327C25.2289 7.98165 28.3453 6.50452 31.8081 6.50452C35.1775 6.50452 38.2219 7.90011 40.4035 10.1341L42.9913 7.43589C42.3141 6.64687 41.8887 5.63634 41.8887 4.51733C41.8887 2.02626 43.9227 0 46.4247 0C48.9267 0 50.963 2.02626 50.963 4.51733C50.963 7.0084 48.9273 9.03466 46.4247 9.03466C45.7135 9.03466 45.0478 8.85563 44.4472 8.56297L41.5827 11.5493C42.9769 13.501 43.8051 15.879 43.8051 18.4504V31.7246L53.488 31.7252V37.1767H56.4223C56.8372 35.5057 58.3438 34.2587 60.1479 34.2587C62.2713 34.2587 63.9993 35.9768 63.9993 38.0903C63.9993 39.8883 62.7463 41.3894 61.0661 41.8014V44.3367ZM49.1266 4.51733C49.1266 3.03503 47.9146 1.82823 46.4247 1.82823C44.9353 1.82823 43.7244 3.03503 43.7244 4.51733C43.7244 5.99963 44.9353 7.20643 46.4247 7.20643C47.9145 7.20643 49.1266 6.00019 49.1266 4.51733ZM17.1084 2.12087C15.6186 2.12087 14.4065 3.32711 14.4065 4.80997C14.4065 6.29284 15.6185 7.49964 17.1084 7.49906C18.5978 7.49906 19.8087 6.29283 19.8087 4.80997C19.8087 3.32767 18.5978 2.12087 17.1084 2.12087ZM3.85039 50.3278C4.95934 50.3278 5.86192 49.4285 5.86192 48.3232C5.86192 47.218 4.95931 46.3187 3.85039 46.3187C2.73862 46.3187 1.83545 47.218 1.83545 48.3232C1.83545 49.4286 2.73857 50.3278 3.85039 50.3278ZM1.83545 38.3675C1.83545 39.4716 2.73857 40.3703 3.85039 40.3703C4.95934 40.3703 5.86192 39.4704 5.86192 38.3675C5.86192 37.2612 4.95931 36.3619 3.85039 36.3619C2.73862 36.3619 1.83545 37.2617 1.83545 38.3675ZM31.8076 8.33363C26.2048 8.33363 21.6463 12.8711 21.6463 18.4505L21.6469 31.7247H41.9688V18.4505C41.9688 12.8723 37.4105 8.33363 31.8076 8.33363ZM13.5718 72.0493H29.8981C29.35 68.0564 25.8674 64.9467 21.7342 64.9462C17.6012 64.9462 14.1199 68.0564 13.5718 72.0493ZM21.7334 63.1185C22.364 63.1185 22.9801 63.1834 23.5807 63.297L23.5801 56.897H19.8884L19.8878 63.2958C20.4884 63.1834 21.1034 63.1185 21.7334 63.1185ZM34.1009 72.1721H50.4272C49.8803 68.1792 46.3989 65.0695 42.2657 65.069C38.1314 65.069 34.649 68.1792 34.1009 72.1721ZM44.1092 63.4184C43.5101 63.3061 42.8944 63.2413 42.2648 63.2413C41.6343 63.2413 41.0187 63.3062 40.4175 63.4198V56.8969H44.1092V63.4184ZM12.3479 55.0685H51.6535V33.5543H12.3479V55.0685ZM60.1482 36.0868C59.0393 36.0868 58.1367 36.9855 58.1367 38.0907C58.1367 39.196 59.0393 40.0958 60.1482 40.0952C61.26 40.0952 62.1632 39.196 62.1632 38.0907C62.1632 36.9854 61.26 36.0868 60.1482 36.0868ZM60.1482 46.0431C59.0393 46.0431 58.1367 46.9429 58.1367 48.0487C58.1367 49.154 59.0393 50.0538 60.1482 50.0526C61.26 50.0526 62.1632 49.1539 62.1632 48.0487C62.1632 46.9424 61.26 46.0431 60.1482 46.0431Z"
|
||||
/>
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
export default BotTwo
|
||||
|
|
@ -9,10 +9,21 @@ import {
|
|||
useState,
|
||||
} from 'react'
|
||||
import { useTranslation } from 'next-i18next'
|
||||
import Button from '../shared/Button'
|
||||
import Button, { IconButton } from '../shared/Button'
|
||||
import { useTheme } from 'next-themes'
|
||||
import { MoonIcon, SunIcon } from '@heroicons/react/20/solid'
|
||||
|
||||
const DesktopNavigation = () => {
|
||||
const { t } = useTranslation(['common', 'navigation'])
|
||||
const { theme, setTheme } = useTheme()
|
||||
|
||||
const toggleTheme = () => {
|
||||
if (theme === 'Mango') {
|
||||
setTheme('Light')
|
||||
} else {
|
||||
setTheme('Mango')
|
||||
}
|
||||
}
|
||||
return (
|
||||
<div className="hidden lg:flex lg:items-center space-x-8">
|
||||
<NavigationItem title={t('navigation:about')}>
|
||||
|
|
@ -42,6 +53,13 @@ const DesktopNavigation = () => {
|
|||
<NavigationItem title={t('navigation:careers')}>
|
||||
<div />
|
||||
</NavigationItem>
|
||||
<IconButton hideBg size="medium" onClick={toggleTheme}>
|
||||
{theme === 'Mango' ? (
|
||||
<MoonIcon className="h-5 w-5" />
|
||||
) : (
|
||||
<SunIcon className="h-5 w-5" />
|
||||
)}
|
||||
</IconButton>
|
||||
<a
|
||||
href="https://trade.mango.markets"
|
||||
target="_blank"
|
||||
|
|
|
|||
|
|
@ -112,7 +112,7 @@ export const LinkButton: FunctionComponent<LinkButtonCombinedProps> = ({
|
|||
disabled={disabled}
|
||||
className={`default-transition flex items-center border-0 font-bold ${
|
||||
secondary ? 'text-th-active' : 'text-th-fgd-2'
|
||||
} underline focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:hover:no-underline ${className}`}
|
||||
} focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:hover:text-th-fgd-4 ${className}`}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,10 @@
|
|||
const HeadingTagline = ({ text }: { text: string }) => {
|
||||
return (
|
||||
<div className="flex items-center space-x-4 max-w-[204px]">
|
||||
<div className="border-2 border-th-fgd-4 h-full py-2" />
|
||||
<p className="text-lg">{text}</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default HeadingTagline
|
||||
|
|
@ -3,13 +3,17 @@ import { ReactNode } from 'react'
|
|||
const SectionWrapper = ({
|
||||
children,
|
||||
className,
|
||||
noPaddingX,
|
||||
}: {
|
||||
children: ReactNode
|
||||
className?: string
|
||||
noPaddingX?: boolean
|
||||
}) => {
|
||||
return (
|
||||
<div
|
||||
className={`bg-th-bkg-1 lg:px-20 px-6 py-24 relative overflow-hidden ${className}`}
|
||||
className={`bg-th-bkg-1 ${
|
||||
noPaddingX ? '' : 'lg:px-20 px-6'
|
||||
} py-24 relative overflow-hidden ${className}`}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,92 @@
|
|||
import { Transition } from '@headlessui/react'
|
||||
import { Fragment, ReactNode, useState } from 'react'
|
||||
import { useTranslation } from 'next-i18next'
|
||||
|
||||
const Steps = ({ steps }: { steps: StepItem[] }) => {
|
||||
const [highlighted, setHighlighted] = useState(0)
|
||||
return (
|
||||
<>
|
||||
{steps.map((step, index) => (
|
||||
<StepItem
|
||||
key={step.title + index}
|
||||
item={step}
|
||||
index={index}
|
||||
highlighted={highlighted}
|
||||
setHighlighted={setHighlighted}
|
||||
/>
|
||||
))}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Steps
|
||||
|
||||
interface StepItem {
|
||||
children?: ReactNode
|
||||
desc: string
|
||||
title: string
|
||||
imagePath: string
|
||||
}
|
||||
|
||||
const StepItem = ({
|
||||
item,
|
||||
index,
|
||||
highlighted,
|
||||
setHighlighted,
|
||||
}: {
|
||||
item: StepItem
|
||||
index: number
|
||||
highlighted: number
|
||||
setHighlighted: (x: number) => void
|
||||
}) => {
|
||||
const { t } = useTranslation(['home'])
|
||||
const isHighlighted = highlighted === index
|
||||
const { children, desc, title, imagePath } = item
|
||||
return (
|
||||
<div className="relative">
|
||||
<div
|
||||
className="flex items-center justify-between lg:pr-20 pr-6 z-10 relative"
|
||||
onMouseEnter={() => setHighlighted(index)}
|
||||
onMouseLeave={() => setHighlighted(0)}
|
||||
>
|
||||
<div
|
||||
className={`${
|
||||
isHighlighted ? 'bg-th-bkg-1' : 'opacity-40'
|
||||
} flex-1 flex flex-col md:flex-row items-start md:space-x-6 py-12 lg:px-20 px-6 h-64 default-transition`}
|
||||
>
|
||||
<h3>{`0${index + 1}`}</h3>
|
||||
<div className="hidden md:block border-b-2 border-th-fgd-2 h-4 w-14" />
|
||||
<div>
|
||||
<h3 className="mb-3">{t(title)}</h3>
|
||||
<p>{t(desc)}</p>
|
||||
{children ? children : null}
|
||||
</div>
|
||||
</div>
|
||||
<Transition
|
||||
as={Fragment}
|
||||
show={isHighlighted}
|
||||
enter="transition-all ease-in duration-300"
|
||||
enterFrom="opacity-0 translate-x-4"
|
||||
enterTo="opacity-100 translate-x-0"
|
||||
leave="transition-all ease-out duration-300"
|
||||
leaveFrom="opacity-100"
|
||||
leaveTo="opacity-0"
|
||||
>
|
||||
<img className="w-auto h-40 md:h-64 -ml-32" src={imagePath} alt="" />
|
||||
</Transition>
|
||||
</div>
|
||||
<Transition
|
||||
// as={Fragment}
|
||||
show={isHighlighted}
|
||||
enter="transition-all ease-in duration-500"
|
||||
enterFrom="opacity-0"
|
||||
enterTo="opacity-100"
|
||||
leave="transition-all ease-out duration-500"
|
||||
leaveFrom="opacity-100"
|
||||
leaveTo="opacity-0"
|
||||
>
|
||||
<div className="absolute w-2/3 h-64 top-0 left-0 bg-th-button mix-blend-screen rounded-full filter blur-3xl opacity-20" />
|
||||
</Transition>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<svg width="38" height="78" viewBox="0 0 38 78" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.4492 66.9626C13.4492 63.9183 15.9394 61.4425 19.0001 61.4425C22.0596 61.4425 24.5486 63.9183 24.5492 66.9626C24.5492 70.0069 22.0601 72.4826 19.0001 72.4826C15.9394 72.4826 13.4492 70.0069 13.4492 66.9626ZM15.2556 66.9615C15.2556 69.0156 16.9356 70.6854 19.0001 70.6854C21.0634 70.6854 22.7428 69.0156 22.7428 66.9615C22.7428 64.9075 21.064 63.2377 19.0001 63.2377C16.9344 63.2377 15.2556 64.9081 15.2556 66.9615Z" fill="#E5E3EC"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.1267 22.4034C13.7449 22.4034 12.6211 23.5218 12.6211 24.8957C12.6211 26.2695 13.7449 27.3879 15.1267 27.3879C16.5085 27.3879 17.6329 26.2695 17.6329 24.8957C17.6329 23.5218 16.5085 22.4034 15.1267 22.4034ZM15.1267 25.5915C14.7411 25.5915 14.4276 25.2797 14.4276 24.8962C14.4276 24.5127 14.7417 24.2008 15.1267 24.2008C15.5134 24.2008 15.8264 24.5127 15.8264 24.8962C15.8264 25.2797 15.5128 25.5915 15.1267 25.5915Z" fill="#E5E3EC"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.3672 24.8957C20.3672 23.5218 21.4916 22.4034 22.8734 22.4034C24.2552 22.4034 25.379 23.5218 25.379 24.8957C25.379 26.2695 24.2551 27.3879 22.8734 27.3879C21.4915 27.3879 20.3672 26.2695 20.3672 24.8957ZM22.1737 24.8962C22.1737 25.2797 22.4867 25.5915 22.8734 25.5915C23.2589 25.5915 23.5725 25.2797 23.5725 24.8962C23.5725 24.5127 23.2589 24.2008 22.8734 24.2008C22.4878 24.2008 22.1737 24.5127 22.1737 24.8962Z" fill="#E5E3EC"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M26.4827 19.5042H11.5148C9.84047 19.5042 8.47852 20.8588 8.47852 22.5242V27.2672C8.47852 28.9326 9.84157 30.2873 11.5148 30.2873H26.4842C28.1585 30.2873 29.5216 28.9326 29.5216 27.2672V22.5242C29.521 20.8588 28.1583 19.5042 26.4827 19.5042ZM27.7137 27.2672C27.7137 27.9417 27.162 28.491 26.4827 28.491H11.5148C10.8367 28.491 10.2844 27.9423 10.2844 27.2672V22.5242C10.2844 21.8497 10.8361 21.3004 11.5148 21.3004H26.4842C27.1635 21.3004 27.7151 21.8491 27.7151 22.5242L27.7137 27.2672Z" fill="#E5E3EC"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M35.1151 28.958C36.7067 28.958 38 27.6705 38 26.0886V23.7025C38 22.1194 36.7055 20.8324 35.1151 20.8324H34.1478C33.5049 18.4553 32.3079 16.2474 30.6127 14.393L30.3445 14.0992H19.9038V11.8462H23.7747V6.67177H15.5011L14.1788 5.35547C14.6784 4.78586 14.9908 4.051 14.9908 3.23834C14.9908 1.45227 13.5303 0 11.735 0C9.93938 0 8.47931 1.45271 8.47931 3.23834C8.47931 5.02441 9.93981 6.47669 11.735 6.47669C12.0424 6.47669 12.3338 6.42029 12.6156 6.34077L14.7532 8.468H21.9688V10.0488H18.0979V14.0986L7.65563 14.0998L7.38631 14.3936C5.69094 16.248 4.49519 18.4571 3.85217 20.833H2.88487C1.29329 20.833 0 22.1206 0 23.7031V26.0892C0 27.6711 1.29446 28.9586 2.88487 28.9586H3.86294C4.46737 31.1846 5.54292 33.2166 6.99617 34.9328H6.70247C3.06513 34.9328 0.10609 37.8767 0.10609 41.4939V47.5435C0.10609 50.647 2.28568 53.2487 5.20001 53.9271V67.8593H7.9483C8.41097 73.5272 13.1868 78 19.0013 78C24.8158 78 29.591 73.5272 30.0526 67.8593H32.9545L32.9539 53.8877C35.7917 53.154 37.8953 50.5919 37.8953 47.5425V41.4929C37.8953 37.875 34.9355 34.9318 31.2977 34.9318H31.004C32.4561 33.2161 33.5328 31.1836 34.1372 28.9576L35.1151 28.958ZM10.2856 3.23898C10.2856 2.44379 10.936 1.79691 11.7354 1.79691C12.5349 1.79691 13.1852 2.44379 13.1852 3.23898C13.1852 4.03417 12.5349 4.68105 11.7354 4.68105C10.936 4.68105 10.2856 4.03417 10.2856 3.23898ZM35.1151 22.6286C35.7093 22.6286 36.1936 23.1102 36.1936 23.7024V26.0885C36.1936 26.6807 35.7093 27.1612 35.1151 27.1612H34.5107C34.6201 26.419 34.695 25.6662 34.695 24.8958C34.695 24.131 34.623 23.3765 34.5135 22.6304L35.1151 22.6298L35.1151 22.6286ZM2.88438 27.1607C2.29016 27.1607 1.80595 26.6791 1.80595 26.088V23.7019C1.80595 23.1098 2.29016 22.6282 2.88438 22.6282H3.48596C3.37653 23.3749 3.30452 24.1294 3.30452 24.8936C3.30452 25.6651 3.37936 26.418 3.48879 27.1589L2.88438 27.1607ZM19.0005 76.2037C13.8759 76.2037 9.70792 72.0579 9.70792 66.9613C9.70792 61.8653 13.8759 57.719 19.0005 57.719C24.1233 57.719 28.2913 61.8647 28.2913 66.9613C28.2913 72.0579 24.1227 76.2037 19.0005 76.2037ZM30.0513 66.0624C29.5886 60.3945 24.8139 55.9218 18.9999 55.9218C13.1853 55.9218 8.40839 60.3945 7.94695 66.0624H7.00517V54.1052H31.1467V66.063L30.0513 66.0624ZM36.0881 41.4926V47.5422C36.0881 50.1697 33.9385 52.3078 31.2969 52.3078H6.70112C4.05952 52.3078 1.91056 50.1697 1.91056 47.5422V41.4926C1.91056 38.8651 4.05894 36.7276 6.70112 36.7276H8.78999C11.5377 39.076 15.1007 40.5051 18.9993 40.5051C22.8963 40.5051 26.4604 39.076 29.2075 36.7276H31.2964C33.938 36.7282 36.0881 38.8661 36.0881 41.4926ZM19.0005 38.7089C11.3428 38.7087 5.11128 32.5119 5.11128 24.895C5.11128 21.5812 6.29801 18.401 8.46224 15.8952H29.5381C31.7023 18.3999 32.8891 21.58 32.8891 24.895C32.888 32.512 26.6572 38.7089 19.0005 38.7089Z" fill="#E5E3EC"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.8 KiB |
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="64" height="74" viewBox="0 0 64 74" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M23.7227 24.8859V15.4214H39.8911V24.8859H23.7227ZM25.5585 23.0575H38.0546V17.2496H25.5585V23.0575Z" fill="#E5E3EC"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M61.0661 44.3367C62.7462 44.7499 63.9993 46.2512 63.9993 48.049C63.9993 49.8464 62.7469 51.3474 61.0651 51.7605V55.6042C62.7452 56.0174 63.9982 57.518 63.9982 59.3153H62.162C62.162 58.21 61.2589 57.3108 60.1471 57.3108C59.0381 57.3108 58.1355 58.2101 58.1355 59.3153H56.2993C56.2993 57.5185 57.5517 56.0162 59.2289 55.6042V51.7605C57.5517 51.3473 56.2993 49.8462 56.2993 48.05C56.2993 46.2526 57.5517 44.7509 59.2289 44.3377V41.8018C57.8462 41.4622 56.7621 40.3816 56.4214 39.0049H53.4871V56.8965H45.9449L45.9454 63.9507C49.6047 65.4043 52.2508 68.9392 52.3361 73.0669L52.3551 74H32.1718L32.1909 73.0669C32.2761 68.9392 34.9221 65.4054 38.5815 63.9519V56.8965H25.4161L25.4173 63.8291C29.0765 65.2821 31.7226 68.8164 31.8079 72.9441L31.827 73.8772H11.6437L11.6627 72.9441C11.748 68.8158 14.394 65.2815 18.0534 63.8279V56.8959H10.5111V39.2805H7.5768C7.23508 40.6571 6.15208 41.7354 4.76938 42.0757V44.611C6.44653 45.0242 7.69897 46.5248 7.69897 48.3221C7.69897 50.1189 6.44657 51.6212 4.76938 52.0332V55.8768C6.44653 56.2901 7.69897 57.7907 7.69897 59.5879H5.86272C5.86272 58.4826 4.9601 57.5834 3.85118 57.5834C2.73942 57.5834 1.83625 58.4827 1.83625 59.5879H0C0 57.7911 1.25299 56.2888 2.93313 55.8768V52.0332C1.25302 51.6199 0 50.1193 0 48.3221C0 46.5253 1.25299 45.023 2.93313 44.611V42.0745C1.25302 41.6614 0 40.1624 0 38.3651C0 36.2516 1.72795 34.5312 3.85133 34.5312C5.65541 34.5312 7.16312 35.7793 7.57695 37.451H10.5113V31.7234L19.8103 31.724V18.4498C19.8103 15.9725 20.5721 13.6708 21.873 11.7605L19.0868 8.85572C18.4873 9.14781 17.8216 9.32627 17.1104 9.32627C14.6084 9.32627 12.5721 7.30001 12.5721 4.80894C12.5721 2.31787 14.6078 0.291607 17.1104 0.291607C19.6112 0.291607 21.6464 2.31728 21.6464 4.80894C21.6464 5.92556 21.2216 6.93789 20.5438 7.7275L23.0371 10.327C25.2289 7.98165 28.3453 6.50452 31.8081 6.50452C35.1775 6.50452 38.2219 7.90011 40.4035 10.1341L42.9913 7.43589C42.3141 6.64687 41.8887 5.63634 41.8887 4.51733C41.8887 2.02626 43.9227 0 46.4247 0C48.9267 0 50.963 2.02626 50.963 4.51733C50.963 7.0084 48.9273 9.03466 46.4247 9.03466C45.7135 9.03466 45.0478 8.85563 44.4472 8.56297L41.5827 11.5493C42.9769 13.501 43.8051 15.879 43.8051 18.4504V31.7246L53.488 31.7252V37.1767H56.4223C56.8372 35.5057 58.3438 34.2587 60.1479 34.2587C62.2713 34.2587 63.9993 35.9768 63.9993 38.0903C63.9993 39.8883 62.7463 41.3894 61.0661 41.8014V44.3367ZM49.1266 4.51733C49.1266 3.03503 47.9146 1.82823 46.4247 1.82823C44.9353 1.82823 43.7244 3.03503 43.7244 4.51733C43.7244 5.99963 44.9353 7.20643 46.4247 7.20643C47.9145 7.20643 49.1266 6.00019 49.1266 4.51733ZM17.1084 2.12087C15.6186 2.12087 14.4065 3.32711 14.4065 4.80997C14.4065 6.29284 15.6185 7.49964 17.1084 7.49906C18.5978 7.49906 19.8087 6.29283 19.8087 4.80997C19.8087 3.32767 18.5978 2.12087 17.1084 2.12087ZM3.85039 50.3278C4.95934 50.3278 5.86192 49.4285 5.86192 48.3232C5.86192 47.218 4.95931 46.3187 3.85039 46.3187C2.73862 46.3187 1.83545 47.218 1.83545 48.3232C1.83545 49.4286 2.73857 50.3278 3.85039 50.3278ZM1.83545 38.3675C1.83545 39.4716 2.73857 40.3703 3.85039 40.3703C4.95934 40.3703 5.86192 39.4704 5.86192 38.3675C5.86192 37.2612 4.95931 36.3619 3.85039 36.3619C2.73862 36.3619 1.83545 37.2617 1.83545 38.3675ZM31.8076 8.33363C26.2048 8.33363 21.6463 12.8711 21.6463 18.4505L21.6469 31.7247H41.9688V18.4505C41.9688 12.8723 37.4105 8.33363 31.8076 8.33363ZM13.5718 72.0493H29.8981C29.35 68.0564 25.8674 64.9467 21.7342 64.9462C17.6012 64.9462 14.1199 68.0564 13.5718 72.0493ZM21.7334 63.1185C22.364 63.1185 22.9801 63.1834 23.5807 63.297L23.5801 56.897H19.8884L19.8878 63.2958C20.4884 63.1834 21.1034 63.1185 21.7334 63.1185ZM34.1009 72.1721H50.4272C49.8803 68.1792 46.3989 65.0695 42.2657 65.069C38.1314 65.069 34.649 68.1792 34.1009 72.1721ZM44.1092 63.4184C43.5101 63.3061 42.8944 63.2413 42.2648 63.2413C41.6343 63.2413 41.0187 63.3062 40.4175 63.4198V56.8969H44.1092V63.4184ZM12.3479 55.0685H51.6535V33.5543H12.3479V55.0685ZM60.1482 36.0868C59.0393 36.0868 58.1367 36.9855 58.1367 38.0907C58.1367 39.196 59.0393 40.0958 60.1482 40.0952C61.26 40.0952 62.1632 39.196 62.1632 38.0907C62.1632 36.9854 61.26 36.0868 60.1482 36.0868ZM60.1482 46.0431C59.0393 46.0431 58.1367 46.9429 58.1367 48.0487C58.1367 49.154 59.0393 50.0538 60.1482 50.0526C61.26 50.0526 62.1632 49.1539 62.1632 48.0487C62.1632 46.9424 61.26 46.0431 60.1482 46.0431Z" fill="#E5E3EC"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.5 KiB |
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="64" height="74" viewBox="0 0 64 74" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M24.2441 17.5252V8.54871H39.5799V17.5252H24.2441ZM25.8967 15.8729H37.9266L37.9271 10.2019H25.8967V15.8729Z" fill="#E5E3EC"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M59.4205 33.0629C61.965 33.1777 64 35.2619 64 37.8134C64 39.424 63.1888 40.8462 61.9542 41.7084L55.6467 49.4802C56.0046 50.1468 56.2085 50.9055 56.2085 51.7105C56.2085 54.3367 54.0551 56.4717 51.4095 56.4717C48.7633 56.4717 46.611 54.3356 46.611 51.7105C46.611 49.0833 48.7638 46.9477 51.4095 46.9477C52.6332 46.9477 53.748 47.4094 54.5967 48.1604L59.1316 42.5725C56.5171 42.5339 54.4016 40.4164 54.4016 37.8139C54.4016 36.012 55.4153 34.441 56.9077 33.6323L53.2801 31.7989L53.2806 41.9379C53.2806 43.5877 51.9283 44.9306 50.2657 44.9306H35.2273V51.4367C41.7153 52.8941 46.5942 58.5742 46.9304 65.2172L46.9739 66.0784H41.8175C40.8231 70.6574 36.7286 74 31.9135 74C27.099 74 23.0045 70.6574 22.0095 66.0784H16.8531L16.8967 65.2172C17.2333 58.575 22.1111 52.894 28.5987 51.4367V44.9306H13.5617C11.8997 44.9306 10.5467 43.5881 10.5467 41.9379V31.5569L7.0944 33.3018C8.58632 34.1109 9.59996 35.6819 9.59996 37.484C9.59996 40.0864 7.48457 42.205 4.86999 42.2426L9.40394 47.8304C10.2527 47.0794 11.368 46.6177 12.5917 46.6177C15.2384 46.6177 17.3907 48.7553 17.3907 51.3815C17.3907 54.0076 15.2384 56.1432 12.5917 56.1432C9.94497 56.1432 7.79267 54.0066 7.79267 51.3815C7.79267 50.5754 7.99707 49.8177 8.35397 49.1511L2.04859 41.3793C0.811333 40.5168 0 39.094 0 37.484C0 34.9314 2.03557 32.8472 4.58003 32.7325L10.5452 29.7177V27.2162C10.5452 25.5664 11.8975 24.2235 13.5602 24.2235H20.5068V11.3152C20.5068 5.07617 25.6232 0 31.9116 0C38.1999 0 43.3148 5.0767 43.3148 11.3152L43.3154 24.2246H50.2646C51.9266 24.2246 53.2795 25.5671 53.2795 27.2172V29.9596L59.4205 33.0629ZM15.613 50.5611C15.2478 49.2372 14.037 48.2572 12.5902 48.2572C10.855 48.2572 9.44397 49.6588 9.44345 51.3811C9.44345 53.1028 10.855 54.5034 12.5902 54.5034C14.0381 54.5034 15.2478 53.5227 15.613 52.2009H12.5902V50.5611H15.613ZM1.6507 37.4841C1.6507 39.2058 3.06277 40.6064 4.79795 40.6064C6.53312 40.6064 7.94466 39.2058 7.94466 37.4841C7.94466 35.7624 6.53312 34.3613 4.79795 34.3613C3.06224 34.3613 1.6507 35.7624 1.6507 37.4841ZM31.9111 1.63935C26.5336 1.63935 22.159 5.98012 22.159 11.3152L22.1585 24.2235H41.6616V11.3152C41.6616 5.97999 37.2869 1.63935 31.9111 1.63935ZM23.7138 66.0794C24.6724 69.7298 28.0054 72.3617 31.9116 72.3617C35.8173 72.3617 39.1497 69.7298 40.1094 66.0794H23.7138ZM18.6183 64.439H45.205C44.5654 59.0226 40.5398 54.4647 35.2257 53.1135V59.9423H28.5976V53.1135C23.2834 54.4652 19.2584 59.0226 18.6183 64.439ZM30.2498 58.303H33.5724V44.9313H30.2498V58.303ZM50.2639 43.2912C51.0151 43.2912 51.6267 42.6848 51.6267 41.9384L51.6272 27.2171C51.6272 26.4712 51.0156 25.8643 50.2644 25.8643H13.5609C12.8097 25.8643 12.1981 26.4707 12.1981 27.2171L12.1976 41.9384C12.1976 42.6843 12.8082 43.2912 13.5604 43.2912H50.2639ZM59.2015 34.6911C57.4653 34.6911 56.0532 36.0917 56.0532 37.8134C56.0532 39.5346 57.4653 40.9346 59.2015 40.9357C60.9358 40.9357 62.3473 39.5351 62.3473 37.8134C62.3473 36.0917 60.9358 34.6911 59.2015 34.6911ZM48.3861 52.5301C48.7518 53.8525 49.961 54.8315 51.4078 54.8315C53.143 54.8315 54.554 53.4304 54.5545 51.7101C54.5545 49.9884 53.143 48.5873 51.4078 48.5873C49.961 48.5873 48.7513 49.5679 48.3861 50.8902H51.4078V52.5301H48.3861Z" fill="#E5E3EC"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue