diff --git a/apps/landing/components/sections/About.tsx b/apps/landing/components/sections/About.tsx new file mode 100644 index 000000000..4b7866c58 --- /dev/null +++ b/apps/landing/components/sections/About.tsx @@ -0,0 +1,58 @@ +import {type ReactElement, useState} from 'react'; +import {cl} from '@builtbymom/web3/utils'; + +export function About(): ReactElement { + const [isReadMore, set_isReadMore] = useState(false); + return ( +
+
+

{'WTF IS YEARN VAULT?'}

+
+

+ { + 'In ‘traditional finance’ (boo, hiss) you can earn yield on your savings by depositing them in a bank' + } + {'- who use the capital for loans and other productive money growing means.'} +

+
+
+

{'Yearn Vaults are like crypto savings accounts floating in cyberspace. You deposit'}

{' '} +

+ {'your assets, andYearn puts them to work within the DeFi ecosystem, returning the earned'} + {'yield back to you.'} +

+
+
+ +

+ { + 'Unlike a bank account - none of this takes place behind closed doors (no offence to doors). DeFi' + } + { + 'runs on public blockchains, so you are in control of your assets and can see where they are at all' + } + {'times.'} +

+
+ {!isReadMore && ( + + )} +
+
+ ); +} diff --git a/apps/landing/components/sections/Hero.tsx b/apps/landing/components/sections/Hero.tsx index 6ac0e6c6d..eedc2dc1d 100644 --- a/apps/landing/components/sections/Hero.tsx +++ b/apps/landing/components/sections/Hero.tsx @@ -19,7 +19,7 @@ export function Hero(): ReactElement {

{'THE DEFI WAY'}

{'TO EARN CRYPTO'}

-

+

{'Yearn is DeFi’s longest running, most battle tested, and most trusted yield protocol.'}

diff --git a/apps/landing/components/sections/Partners.tsx b/apps/landing/components/sections/Partners.tsx new file mode 100644 index 000000000..5ff063c05 --- /dev/null +++ b/apps/landing/components/sections/Partners.tsx @@ -0,0 +1,67 @@ +import Marquee from 'react-fast-marquee'; +import Image from 'next/image'; + +import type {ReactElement} from 'react'; + +export function Partners(): ReactElement { + return ( +
+
+ +
+ {'Ajna'} +
{' '} +
+ {'Ajna'} +
+
+ {'Ajna'} +
+
+ {'Ajna'} +
+
+ {'Ajna'} +
+
+ {'Ajna'} +
+ +
+
+ ); +} diff --git a/bun.lockb b/bun.lockb index b1fe6dc24..eebfe5e9c 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/package.json b/package.json index ff5993f0e..c57391069 100644 --- a/package.json +++ b/package.json @@ -35,9 +35,11 @@ "nprogress": "^0.2.0", "react": "^18.3.1", "react-dom": "^18.3.1", + "react-fast-marquee": "^1.6.5", "react-paginate": "^8.2.0", "recharts": "^2.12.7", "swr": "^2.2.5", + "tailwind-gradient-mask-image": "^1.2.0", "viem": "2.17.3", "vite": "^5.2.13", "wagmi": "2.10.10", diff --git a/pages/landing.tsx b/pages/landing.tsx index 1ba954b80..d10b32bd0 100644 --- a/pages/landing.tsx +++ b/pages/landing.tsx @@ -1,13 +1,17 @@ +import {About} from 'apps/landing/components/sections/About'; import {Hero} from 'apps/landing/components/sections/Hero'; +import {Partners} from 'apps/landing/components/sections/Partners'; import {WaysToEarn} from 'apps/landing/components/sections/WaysToEarn'; import type {ReactElement} from 'react'; function Landing(): ReactElement { return ( -
+
+ +
); } diff --git a/public/landing/about-bg.png b/public/landing/about-bg.png new file mode 100644 index 000000000..0531d59a5 Binary files /dev/null and b/public/landing/about-bg.png differ diff --git a/public/landing/about_bg.png b/public/landing/about_bg.png new file mode 100644 index 000000000..73c9e4216 Binary files /dev/null and b/public/landing/about_bg.png differ diff --git a/public/landing/partners/aave.png b/public/landing/partners/aave.png new file mode 100644 index 000000000..aba0e03d1 Binary files /dev/null and b/public/landing/partners/aave.png differ diff --git a/public/landing/partners/ajna.png b/public/landing/partners/ajna.png new file mode 100644 index 000000000..09020f2b7 Binary files /dev/null and b/public/landing/partners/ajna.png differ diff --git a/public/landing/partners/compound.png b/public/landing/partners/compound.png new file mode 100644 index 000000000..7234b97a5 Binary files /dev/null and b/public/landing/partners/compound.png differ diff --git a/public/landing/partners/curve.png b/public/landing/partners/curve.png new file mode 100644 index 000000000..1ab94b829 Binary files /dev/null and b/public/landing/partners/curve.png differ diff --git a/public/landing/partners/lido.png b/public/landing/partners/lido.png new file mode 100644 index 000000000..747aba41c Binary files /dev/null and b/public/landing/partners/lido.png differ diff --git a/public/landing/partners/pendle.png b/public/landing/partners/pendle.png new file mode 100644 index 000000000..e53e3dc03 Binary files /dev/null and b/public/landing/partners/pendle.png differ diff --git a/public/landing/partners/sky.png b/public/landing/partners/sky.png new file mode 100644 index 000000000..3500d46e1 Binary files /dev/null and b/public/landing/partners/sky.png differ diff --git a/public/landing/partners/spark.png b/public/landing/partners/spark.png new file mode 100644 index 000000000..8688c8a46 Binary files /dev/null and b/public/landing/partners/spark.png differ diff --git a/public/landing/partners/swell.png b/public/landing/partners/swell.png new file mode 100644 index 000000000..a3e02f1a1 Binary files /dev/null and b/public/landing/partners/swell.png differ diff --git a/tailwind.config.js b/tailwind.config.js index f07bcf2e9..9346761e7 100755 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -82,5 +82,5 @@ module.exports = { } } }, - plugins: [] + plugins: [require('tailwind-gradient-mask-image')] };