BasegBot/InvestWeb
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

less bad temp landing page

Browse source
This commit is contained in:
3zachm 2023-01-16 19:34:11 -08:00
parent f503591c44
commit 10e7901c76
1 changed files with 18 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
pages/index.tsx
View file

@ -2,11 +2,10 @@ import { m } from "framer-motion";
import { ReactElement, useEffect, useState } from "react"; import { ReactElement, useEffect, useState } from "react";
import HomeLayout from "../layouts/HomeLayout"; import HomeLayout from "../layouts/HomeLayout";
import { homeMain } from "../layouts/NavTemplates"; import { homeMain } from "../layouts/NavTemplates";
import type { NextPageWithLayout } from "./_app";
import Image from "next/image"; import Image from "next/image";
import Head from "next/head"; import Head from "next/head";
const Home: NextPageWithLayout = () => { function Home() {
let api7tvEmotes = `/api/7tv/emotes?c=61ad997effa9aba101bcfddf`; let api7tvEmotes = `/api/7tv/emotes?c=61ad997effa9aba101bcfddf`;
const [emotesUrls, setEmotes] = useState([]); const [emotesUrls, setEmotes] = useState([]);
const [currentEmote, setCurrentEmote] = useState(0); const [currentEmote, setCurrentEmote] = useState(0);
@ -79,49 +78,25 @@ const Home: NextPageWithLayout = () => {
<title>Home - toffee</title> <title>Home - toffee</title>
</Head> </Head>
<div className="flex h-full w-full flex-col items-center justify-center"> <div className="flex h-full w-full flex-col items-center justify-center">
<div className="inline-grid grid-cols-1 gap-10 text-white md:grid-cols-3"> <div className="gap inline-grid grid-cols-1 gap-20 text-white md:grid-cols-3">
<m.div <m.div
className="flex flex-col from-purple-400 to-pink-600 font-plusJakarta text-7xl font-semibold sm:text-8xl md:col-span-2" className="flex flex-col from-purple-400 to-pink-600 font-plusJakarta md:col-span-2"
variants={sloganContainerVariants} variants={sloganContainerVariants}
initial="initial" initial="initial"
animate="animate" animate="animate"
> >
<m.div <div className="flex flex-row text-8xl font-bold italic">
className="flex flex-row items-center" <m.h1 variants={sloganHeaderVariants}>t</m.h1>
variants={sloganHeaderVariants} <m.h1 className="text-orange-400" variants={sloganHeaderVariants}>
>
<h1 className="bg-gradient-to-b bg-clip-text text-transparent">
t
</h1>
<h1>ax-free</h1>
</m.div>
<m.div
className="flex flex-row items-center"
variants={sloganHeaderVariants}
>
<h1 className="bg-gradient-to-tl bg-clip-text text-transparent">
off off
</h1> </m.h1>
<h1>line</h1> <m.h1 variants={sloganHeaderVariants}>ee</m.h1>
</m.div> </div>
<m.div <div className="text-xl italic">
className="flex flex-row items-center" <m.h2 variants={sloganHeaderVariants}>
variants={sloganHeaderVariants} a tax-free offline emote exchange utility
> </m.h2>
<h1 className="bg-gradient-to-l bg-clip-text text-transparent"> </div>
e
</h1>
<h1>mote</h1>
</m.div>
<m.div
className="flex flex-row items-center"
variants={sloganHeaderVariants}
>
<h1 className="bg-gradient-to-bl bg-clip-text text-transparent">
e
</h1>
<h1>xchange</h1>
</m.div>
</m.div> </m.div>
<m.div <m.div
className="flex items-center justify-center" className="flex items-center justify-center"
@ -146,7 +121,7 @@ const Home: NextPageWithLayout = () => {
</div> </div>
</> </>
); );
}; }
const sloganContainerVariants = { const sloganContainerVariants = {
initial: { initial: {
@ -163,7 +138,7 @@ const sloganContainerVariants = {
bounce: 0.5, bounce: 0.5,
stiffness: 150, stiffness: 150,
delayChildren: 1.0, delayChildren: 1.0,
staggerChildren: 0.45, staggerChildren: 0.1,
}, },
}, },
}; };
@ -171,9 +146,11 @@ const sloganContainerVariants = {
const sloganHeaderVariants = { const sloganHeaderVariants = {
initial: { initial: {
opacity: 0, opacity: 0,
y: -15,
}, },
animate: { animate: {
opacity: 1, opacity: 1,
y: 0,
}, },
}; };