fix mobile
This commit is contained in:
@@ -48,7 +48,7 @@ function MobileNavLink(
|
|||||||
return (
|
return (
|
||||||
<PopoverButton
|
<PopoverButton
|
||||||
as={Link}
|
as={Link}
|
||||||
className="block text-base/7 tracking-tight text-[#2F3178]"
|
className="block text-base/7 tracking-tight text-white"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
@@ -72,7 +72,7 @@ export function Header() {
|
|||||||
{({ open }) => (
|
{({ open }) => (
|
||||||
<>
|
<>
|
||||||
<PopoverButton
|
<PopoverButton
|
||||||
className="relative z-10 -m-2 inline-flex items-center rounded-lg stroke-gray-900 p-2 hover:bg-gray-200/50 hover:stroke-gray-600 focus:not-data-focus:outline-hidden active:stroke-gray-900"
|
className="relative z-10 -m-2 inline-flex items-center rounded-lg stroke-white p-2 hover:bg-gray-200/50 hover:stroke-gray-400 focus:not-data-focus:outline-hidden active:stroke-white"
|
||||||
aria-label="Toggle site navigation"
|
aria-label="Toggle site navigation"
|
||||||
>
|
>
|
||||||
{({ open }) =>
|
{({ open }) =>
|
||||||
@@ -104,7 +104,7 @@ export function Header() {
|
|||||||
y: -32,
|
y: -32,
|
||||||
transition: { duration: 0.2 },
|
transition: { duration: 0.2 },
|
||||||
}}
|
}}
|
||||||
className="absolute inset-x-0 top-0 z-0 origin-top rounded-b-2xl bg-white px-6 pt-32 pb-6 shadow-2xl shadow-gray-900/20"
|
className="absolute inset-x-0 top-0 z-0 origin-top rounded-b-2xl bg-gray-900 px-6 pt-32 pb-6 shadow-2xl shadow-gray-900/20"
|
||||||
>
|
>
|
||||||
<div className="space-y-4">
|
<div className="space-y-4">
|
||||||
<MobileNavLink href="/#about">
|
<MobileNavLink href="/#about">
|
||||||
|
@@ -32,8 +32,9 @@ export function HomeHero() {
|
|||||||
<div className="absolute inset-0 bg-black/60" />
|
<div className="absolute inset-0 bg-black/60" />
|
||||||
</div>
|
</div>
|
||||||
<div className="relative px-6 lg:px-8">
|
<div className="relative px-6 lg:px-8">
|
||||||
<div className="relative -top-15 mx-auto max-w-8xl h-screen flex items-center justify-center">
|
<div className="relative -top-15 mx-auto flex h-screen max-w-8xl items-center justify-center">
|
||||||
<div className="text-center max-w-5xl">
|
<div className="text-center">
|
||||||
|
<div className="max-w-5xl">
|
||||||
<H1 color="light">
|
<H1 color="light">
|
||||||
<TypeAnimation
|
<TypeAnimation
|
||||||
sequence={[
|
sequence={[
|
||||||
@@ -46,12 +47,28 @@ export function HomeHero() {
|
|||||||
/>
|
/>
|
||||||
</H1>
|
</H1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* Mobile-only PL */}
|
||||||
<motion.div
|
<motion.div
|
||||||
initial={{ opacity: 0 }}
|
initial={{ opacity: 0 }}
|
||||||
animate={{ opacity: 1 }}
|
animate={{ opacity: 1 }}
|
||||||
transition={{ duration: 1, delay: 1 }}
|
transition={{ duration: 1, delay: 1 }}
|
||||||
|
className="lg:hidden"
|
||||||
>
|
>
|
||||||
<PL className="absolute bottom-0 left-0 max-w-xl text-left text-gray-100" color="light">
|
<PL className="mt-8 max-w-xl text-center text-gray-100" color="light">
|
||||||
|
Mycelium's advancements in Agentic infrastructure supports private, secure and autonomous Agents that connect, learn and grow with you.
|
||||||
|
</PL>
|
||||||
|
</motion.div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Desktop-only PL */}
|
||||||
|
<motion.div
|
||||||
|
initial={{ opacity: 0 }}
|
||||||
|
animate={{ opacity: 1 }}
|
||||||
|
transition={{ duration: 1, delay: 1 }}
|
||||||
|
className="hidden lg:block"
|
||||||
|
>
|
||||||
|
<PL className="absolute -bottom-8 left-0 max-w-xl text-left text-gray-100" color="light">
|
||||||
Mycelium's advancements in Agentic infrastructure supports private, secure and autonomous Agents that connect, learn and grow with you.
|
Mycelium's advancements in Agentic infrastructure supports private, secure and autonomous Agents that connect, learn and grow with you.
|
||||||
</PL>
|
</PL>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
|
Reference in New Issue
Block a user