Skip to content

Commit

Permalink
chore: mobile view, fix: avatars
Browse files Browse the repository at this point in the history
  • Loading branch information
@adetyaz
adetyaz committed Nov 30, 2024
1 parent d1f20d0 commit b2590e1
Show file tree
Hide file tree
Showing 13 changed files with 349 additions and 174 deletions.
Binary file modified .yarn/install-state.gz
View file
Binary file not shown.
4 changes: 3 additions & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
"lint": "next lint"
},
"dependencies": {
"@pinecone-database/pinecone": "^4.0.0",
"@rainbow-me/rainbowkit": "^2.1.3",
"@react-three/drei": "^9.107.0",
"@react-three/fiber": "^8.16.8",
Expand All @@ -24,10 +25,11 @@
"clsx": "^2.1.1",
"ethers": "^6.13.1",
"framer-motion": "^11.11.11",
"langchain": "^0.3.6",
"lucide-react": "^0.394.0",
"moralis": "^2.26.7",
"next": "13.5.4",
"openai": "^4.52.1",
"openai": "^4.73.0",
"permissionless": "^0.1.34",
"react": "^18",
"react-dom": "^18",
Expand Down
4 changes: 2 additions & 2 deletions src/app/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import { CallToAction } from '@/components/call-to-action'

export default function Home() {
return (
<div className='bg-black'>
<main className='bg-black overflow-x-hidden'>
<Header home />
<Hero />

Expand Down Expand Up @@ -46,6 +46,6 @@ export default function Home() {
<div className='bg-gradient-to-b from-[#121212] to-[#121212] '>
<Footer />
</div>
</div>
</main>
)
}
14 changes: 7 additions & 7 deletions src/components/avatar-leaderboard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -228,20 +228,20 @@ const AvatarLeaderboard = () => {
)}

{/* Background with Trophies */}
<div className='bg-gray-800 relative'>
<div className='bg-gray-800 md:relative'>
<Image
width={100}
height={100}
width={150}
height={150}
src='/trophy1.png'
alt='Left Trophy'
className='absolute -top-14 md:top-0 -left-1 md:left-10 w-24 h-24'
className='absolute top-[14%] md:top-0 right-1 md:right-[unset] md:left-10 w-24 h-24'
/>
<Image
width={100}
height={100}
width={150}
height={150}
src='/trophy2.png'
alt='Right Trophy'
className='absolute -top-14 md:top-0 -right-1 md:right-10 w-24 h-24'
className='absolute top-[85%] md:top-0 left-1 md:left-[unset] md:right-10 w-24 h-24'
/>
<h1
className='text-center text-3xl md:text-4xl font-bold gradient-text-banner-2 text-transparent py-4 px-2 md:px-0'
Expand Down
2 changes: 1 addition & 1 deletion src/components/call-to-action.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import Link from 'next/link'

export const CallToAction = () => {
return (
<div className='flex items-center justify-center min-h-screen relative z-10 '>
<div className='flex items-center justify-center relative z-10 py-16 md:py-20'>
<div className='p-2 w-96 h-80 flex items-center justify-center bg-gradient-to-b from-blue-500 to-pink-500 rounded-3xl'>
<div className='text-center size-full flex flex-col items-center justify-center bg-[#121212] rounded-2xl'>
<h1 className='text-white font-bold mb-4 text-3xl'>Create Profile</h1>
Expand Down
172 changes: 42 additions & 130 deletions src/components/footer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,159 +4,71 @@ import Link from 'next/link' // Use Link for navigation

const Footer = () => {
return (
<div>
<footer
style={{
background:
'linear-gradient(90deg, #30D8FF 0%, #A32CC4 50%, #C243FE 100%)',
padding: '40px 60px',
}}
>
<section
style={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
}}
>
<div className='brand' style={{ textAlign: 'left' }}>
<Link href='https://myriadflow.com/' passHref>
<Image
src='/MFlogo.png'
width={200}
height={200}
alt='logo'
className="mb-5"
/>
</Link>
<p style={{ color: 'white', maxWidth: '350px', fontSize: '14px' }}>
Innovative next-gen platform for exploring and launching NFT
Xperiences with AI-powered brand ambassadors and no-code tools.
</p>
<p style={{ marginTop: '30px', color: 'white', fontSize: '12px' }}>
© Copyright 2024 MyriadFlow. All rights reserved
</p>
</div>
<footer className='text-white bg-gradient-to-b md:bg-gradient-to-r from-[#30D8FF] via-[#A32CC4] to-[#C243FE] py-10 px-8 md:px-16 grid gap-y-12'>
<div className='grid gap-16 md:gap-y-0 md:grid-cols-3 items-start'>
<div>
<Link href='https://myriadflow.com/' passHref>
<Image
src='/MFlogo.png'
width={350}
height={350}
alt='logo'
className='mb-6'
/>
</Link>
<p className='md:w-[350px] text-sm'>
Innovative next-gen platform for exploring and launching NFT
Xperiences with AI-powered brand ambassadors and no-code tools.
</p>
</div>

<div
className='links'
style={{ textAlign: 'left', color: 'white', fontSize: '14px' }}
>
<h3 className='text-2xl font-semibold'>About</h3>
<Link
href='/MyriadFlow_Terms_of_Service.pdf'
target='_blank'
style={{
color: 'white',
textDecoration: 'none',
display: 'block',
marginTop: '28px',
}}
>
<div className='flex justify-between items-start'>
<div className='text-sm grid gap-y-2'>
<h3 className='text-2xl font-semibold mb-6'>About</h3>
<Link href='/MyriadFlow_Terms_of_Service.pdf' target='_blank'>
Terms of Service
</Link>
<Link
href='/MyriadFlow_Creator_Terms_and_Conditions.pdf'
target='_blank'
style={{
color: 'white',
textDecoration: 'none',
display: 'block',
}}
>
Creator Terms and Conditions
</Link>
<Link
href='/MyriadFlow_Privacy_Policy.pdf'
target='_blank'
style={{
color: 'white',
textDecoration: 'none',
display: 'block',
}}
>
<Link href='/MyriadFlow_Privacy_Policy.pdf' target='_blank'>
Privacy Policy
</Link>
<Link
href='/MyriadFlow_Community_Guidelines.pdf'
target='_blank'
style={{
color: 'white',
textDecoration: 'none',
display: 'block',
}}
>
<Link href='/MyriadFlow_Community_Guidelines.pdf' target='_blank'>
Community Guidelines
</Link>
</div>

<div
className='platform'
style={{ textAlign: 'left', color: 'white', fontSize: '14px' }}
>
<h3 className='text-2xl font-semibold'>Platform</h3>
<Link
href='https://studio.myriadflow.com'
style={{
color: 'white',
textDecoration: 'none',
display: 'block',
marginTop: '28px',
}}
>
Studio
</Link>
<Link
href='https://discover.myriadflow.com'
style={{
color: 'white',
textDecoration: 'none',
display: 'block',
}}
>
Discover
</Link>
<Link
href='https://webxr.myriadflow.com'
style={{
color: 'white',
textDecoration: 'none',
display: 'block',
}}
>
WebXR
</Link>
<div className='text-sm grid gap-y-2'>
<h3 className='text-2xl font-semibold mb-6'>Platform</h3>
<Link href='https://studio.myriadflow.com'>Studio</Link>
<Link href='https://discover.myriadflow.com'>Discover</Link>
<Link href='https://webxr.myriadflow.com'>WebXR</Link>
</div>
</div>

<section
id='connect'
className='social-links'
style={{ display: 'flex', justifyContent: 'flex-end', gap: '20px' }}
>
{[
'/Vector3.png',
'/Vector4.png',
'/Vector2.png',
'/Vector5.png',
].map((icon, index) => (
<div className='flex justify-end gap-6 self-center'>
{['/Vector3.png', '/Vector4.png', '/Vector2.png', '/Vector5.png'].map(
(icon, index) => (
<div
key={index}
style={{
borderRadius: '50%',
border: '2px solid #0E46A3',
padding: '16px',
backgroundColor: '#15063C',
}}
className='rounded-full size-14 border-2 border-white p-4 bg-[#282A33]'
>
<Link href='#' target='_blank'>
<Image src={icon} width={20} height={20} alt='Social Icon' />
</Link>
</div>
))}
</section>
</section>
</footer>
</div>
)
)}
</div>
</div>
<div>
<hr className='sm:hidden' />
<p>© Copyright 2024 MyriadFlow. All rights reserved</p>
</div>
</footer>
)
}

Expand Down
13 changes: 9 additions & 4 deletions src/components/header.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import Link from 'next/link'
import { usePathname } from 'next/navigation'
import { toast, ToastContainer } from 'react-toastify'
import { useAccount, useDisconnect, useConnect } from 'wagmi'
import { BadgeInfo } from 'lucide-react'
import { BadgeInfo, Menu } from 'lucide-react'

import Image from 'next/image'

Expand Down Expand Up @@ -179,7 +179,7 @@ const Header = ({
</svg>
</Link>
</div>
<div className='flex gap-4 items-baseline'>
<div className='flex gap-4 items-center'>
<div className='flex items-center space-x-4'>
{address ? (
<>
Expand Down Expand Up @@ -311,9 +311,14 @@ const Header = ({
className='sm:hidden text-2xl'
onClick={() => setIsDropdownOpen(!isDropdownOpen)}
>
<img src='/menu.png' alt='Menu' className='w-6 h-6 ml-4' />
<Menu />
</button>
<BadgeInfo className='cursor-pointer md:hidden' onClick={onClick} />
{!home && (
<BadgeInfo
className='cursor-pointer md:hidden'
onClick={onClick}
/>
)}
{userType === 'owner' && (
<div onClick={showAttestation} className='cursor-pointer'>
<Image src='/receipt.png' alt='Create' width={38} height={38} />
Expand Down
4 changes: 2 additions & 2 deletions src/components/hero.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ export const Hero = () => {
className='flex flex-col justify-between sm:block bg-[#111] text-white relative bg-cover bg-center pt-12'
style={{ backgroundImage: isWideScreen ? 'url(/webXR.jpg)' : 'none' }}
>
<div className=' md:w-1/2 h-full px-8 md:px-16 2xl:pr-36 py-20 md:py-56 flex flex-col justify-start'>
<div className='md:w-1/2 h-full px-8 md:px-16 2xl:pr-36 pt-20 sm:py-20 md:py-56 flex flex-col justify-start'>
<h1
className='text-5xl md:text-7xl font-bold text-center sm:text-left gradient-text text-transparent'
style={{ WebkitTextFillColor: 'transparent' }}
Expand All @@ -52,7 +52,7 @@ export const Hero = () => {
className='sm:hidden mx-auto'
src='/webxr.png'
alt='lady with oculus gear image'
height={300}
height={100}
width={300}
/>
</section>
Expand Down
11 changes: 7 additions & 4 deletions src/components/leaderboard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,10 @@ const Leaderboard = ({
return avatarsWithNames
},
})
const avatars = result.data
const avatars = result.data?.sort(
(a: AvatarType, b: AvatarType) =>
new Date(b.created_at).getTime() - new Date(a.created_at).getTime()
)

return (
<>
Expand All @@ -64,9 +67,9 @@ const Leaderboard = ({
<p className='text-xl font-semibold mt-6 text-white'>{subtitle}</p>
</div>

{reversed ? (
{!reversed ? (
<div className='pt-20 flex gap-9 flex-wrap justify-center'>
{avatars?.slice(0, 12).map(
{avatars?.slice(0, 8).map(
(
avatar: AvatarType & {
phygitalName: string
Expand All @@ -88,7 +91,7 @@ const Leaderboard = ({
) : (
<div className='pt-20 flex gap-9 flex-wrap justify-center'>
{avatars
?.slice(0, 12)
?.slice(6, 10)
.reverse()
.map(
(
Expand Down
3 changes: 3 additions & 0 deletions src/components/voiceAsssitantRag.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export const VoiceAsssitantRag = () => {
return <div>VoiceAsssitantRag</div>
}
Empty file added src/lib/pinecone.ts
View file
Empty file.
Loading

0 comments on commit b2590e1

Please sign in to comment.