Skip to content

Commit

Permalink
Merge pull request #66 from hanzoai/issue/21
Browse files Browse the repository at this point in the history
footer pixel perfect
  • Loading branch information
zoosos committed Jul 7, 2024
2 parents b8c6605 + db9fbfe commit edf996f
Show file tree
Hide file tree
Showing 19 changed files with 348 additions and 234 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@types/react": "^18.3.2",
"@types/react-dom": "^18.3.0",
"supports-color": "8.1.1",
"@hanzo/brand": "link:./packages/brand",
"@hanzo/brand": "0.1.20",
"@luxfi/data": "1.0.6",
"@hanzo/auth": "2.4.12",
"@hanzo/commerce": "7.1.5",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,7 @@ const DesktopNavHanzo: React.FC<{
onMouseEnter={handleMouseEnter}
onMouseLeave={handleMouseLeave}
>
<div className="flex flex-row w-full justify-center border-r-0">
<div className="flex flex-row w-full justify-center border-r-0 flex-wrap md:flex-auto">
{GroupChildMenu(el.childMenu)}
</div>
</NavigationMenuContent>
Expand Down
158 changes: 85 additions & 73 deletions packages/brand/components/footer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -48,16 +48,16 @@ const Footer: React.FC<{

const handleSubmit = async () => {
let valid = true
if (!isValidEmail(email)) {
setEmail('Invalid Email Address');
if (!isValidEmail(email)) {
setEmail('Invalid Email Address');
valid = false
}

if (username.length < 1 || username == 'Name') {
setUsername('Invalid Username');
valid = false
if (username.length < 1 || username == 'Name') {
setUsername('Invalid Username');
valid = false
}

if (valid) {
try {
const response = await fetch('/api/join-newsletter', {
Expand Down Expand Up @@ -95,96 +95,108 @@ const Footer: React.FC<{
'md:w-full sm:justify-items-center md:mx-0 lg:w-full' +
'md:flex md:flex-row md:justify-between '
}>
<div className=' lg:grid grid-cols-4 !pointer-events-autow-full w-full' key={0}>
<div className=''>
<div className='flex md:flex-row flex-col !pointer-events-autow-full w-full gap-8' key={0}>
<div className='md:flex-1 flex flex-col 2xl:gap-10 gap-5'>
<span className='text-2xl font-normal leading-5'>
Shortcuts
</span>
<div className='grid grid-cols-3 gap-3 text-muted-1 lg:items-center text-base max-w-[222px] mt-9'>
<Link className='max-w-[83px]' href={"#"}>
Home
</Link>
<Link className='max-w-[83px]' href={"#"}>
Help
</Link>
<Link className='max-w-[83px]' href={"#"}>
Changelog
</Link>
<Link className='max-w-[83px]' href={"#"}>
Docs
</Link>
<Link className='max-w-[83px]' href={"#"}>
Sales
</Link>
<Link className='max-w-[83px]' href={"#"}>
Pricing
</Link>
<Link className='max-w-[83px]' href={"#"}>
Guides
</Link>
<Link className='max-w-[83px]' href={"#"}>
Blog
</Link>
<Link className='max-w-[83px]' href={"#"}>
Legal
</Link>
<div className='flex flex-row gap-6 text-muted-1 lg:items-center text-base'>
<div className='flex flex-col gap-3'>
<Link className='hover:text-primary transition duration-500' href={"#"}>
Home
</Link>
<Link className='hover:text-primary transition duration-500' href={"#"}>
Docs
</Link>
<Link className='hover:text-primary transition duration-500' href={"#"}>
Guides
</Link>
</div>
<div className='flex flex-col gap-3'>
<Link className='hover:text-primary transition duration-500' href={"#"}>
Help
</Link>
<Link className='hover:text-primary transition duration-500' href={"#"}>
Sales
</Link>
<Link className='hover:text-primary transition duration-500' href={"#"}>
Blog
</Link>
</div>
<div className='flex flex-col gap-3'>
<Link className='hover:text-primary transition duration-500' href={"#"}>
Changelog
</Link>
<Link className='hover:text-primary transition duration-500' href={"#"}>
Pricing
</Link>
<Link className='hover:text-primary transition duration-500' href={"#"}>
Legal
</Link>
</div>
</div>
</div>
<div className='lg:mt-0 mt-[41.52px]'>
<span className=' text-2xl leading-5 font-normal'>
<div className='md:flex-1 flex flex-col 2xl:gap-10 gap-5'>
<span className='text-2xl leading-5 font-normal'>
Connect with us
</span>
<div>
<Link href={"mailto:info@hanzo.ai"} className='lg:mt-[33.8px] mt-5 underline'>
<Link href={"mailto:info@hanzo.ai"} className='underline text-base font-light text-muted-1 hover:text-primary transition duration-500'>
info@hanzo.ai
</Link>
</div>
</div>
<div className='lg:mt-0 mt-[52px] lg:-ml-[150px]' >
<span className=' text-2xl'>
<div className='md:flex-1 flex flex-col 2xl:gap-10 gap-5' >
<span className='text-2xl font-normal leading-5'>
Join our newsletter
</span>
<div className='flex flex-col max-w-[416px] lg:mt-[31.57px] mt-[21px]'>
<div className='flex flex-col gap-6'>
<input type='text' value={username} placeholder='Name' onChange={(e) => handleName(e)} className=' bg-transparent text-base outline-none text-muted-1 border-b' />
<div className='flex gap-[58px] w-full justify-between lg:mt-[31.57px] mt-[8.57px] lg:border-b-0 border-b'>
<input type='text' value={email} placeholder='E-mail' onChange={(e) => handleEmail(e)} className='w-full bg-transparent text-base outline-none text-muted-1 lg:border-b max-w-[329px]' />
<div className='flex flex-row gap-4 w-full md:border-b-0 border-b'>
<input type='text' value={email} placeholder='E-mail' onChange={(e) => handleEmail(e)} className='w-full bg-transparent text-base outline-none text-muted-1 md:border-b' />
<button className='bg-transparent' onClick={handleSubmit}>
<Goto className='lg:bg-muted-1 bg-primary' />
<Goto />
</button>
</div>
</div>
</div>
<div className='lg:mt-0 mt-12'>
<span className=' text-2xl '>
Follow Us
</span>
<div className='grid grid-cols-2 gap-3 text-[16px] lg:mt-[43.1px] mt-[30px]'>
<Link className='social-link' href={"https://x.com/hanzoai"}>
X
</Link>
<Link className='social-link' href={"https://linkedin.com/company/hanzoai"}>
Linkedin
</Link>
<Link className='social-link' href={"https://facebook.com/hanzoinc"}>
Facebook
</Link>
<Link className='social-link' href={"https://github.com/hanzoai"}>
Github
</Link>
<Link className='social-link' href={"https://instagram.com/hanzoinc"}>
Instagram
</Link>
<div className='md:flex-1 flex md:justify-center'>
<div className='flex flex-col 2xl:gap-10 gap-5'>
<span className='text-2xl font-normal leading-5'>
Follow Us
</span>
<div className='flex flex-row gap-6 text-[16px] text-muted-1'>
<div className='flex flex-col gap-3'>
<Link className='social-link hover:text-primary transition duration-500' href={"https://x.com/hanzoai"}>
X
</Link>
<Link className='social-link hover:text-primary transition duration-500' href={"https://facebook.com/hanzoinc"}>
Facebook
</Link>
<Link className='social-link hover:text-primary transition duration-500' href={"https://instagram.com/hanzoinc"}>
Instagram
</Link>
</div>
<div className='flex flex-col gap-3'>
<Link className='social-link hover:text-primary transition duration-500' href={"https://linkedin.com/company/hanzoai"}>
Linkedin
</Link>
<Link className='social-link hover:text-primary transition duration-500' href={"https://github.com/hanzoai"}>
Github
</Link>
</div>
</div>
</div>
</div>
</div>
</div>
<div className='md:mt-[2vh] flex justify-start gap-8 lg:pl-[27px] mb-0'>
<Nvidia />
<Techstars />
<Stripe />
<Google />
<Amazon />
<Microsoft />
<div className='mt-8 flex flex-row md:justify-start justify-between md:gap-8'>
<Nvidia />
<Techstars />
<Stripe />
<Google />
<Amazon />
<Microsoft />
</div>
</div>
</footer>
)
Expand Down
2 changes: 1 addition & 1 deletion packages/brand/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@hanzo/brand",
"version": "0.1.16",
"version": "0.1.20",
"description": "Library that contains shared UI primitives, support for a common design system, and other boilerplate support.",
"publishConfig": {
"registry": "https://registry.npmjs.org/",
Expand Down
Loading

1 comment on commit edf996f

@vercel
Copy link

@vercel vercel bot commented on edf996f Jul 7, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

hanzo-ai – ./sites/landing

hanzo-ai-hanzo-ai.vercel.app
hanzo-ai.vercel.app
hanzo.ai
hanzo-ai-git-main-hanzo-ai.vercel.app
www.hanzo.ai

Please sign in to comment.