allow pointer events

This commit is contained in:
Dhravya 2024-06-28 18:10:19 -05:00
parent 6888cc45f0
commit 2e6d9d5385
5 changed files with 13 additions and 11 deletions

View file

@ -4,16 +4,14 @@ export const Gradient = ({ opacity = 50 }: { opacity?: number }) => {
return (
<div
className={cn(
"absolute top-0 -left-[10rem] w-[56.625rem] h-[56.625rem] mix-blend-color-dodge pointer-events-none",
`opacity-${opacity}`
"absolute top-0 -left-[10rem] w-[56.625rem] h-[56.625rem] mix-blend-color-dodge",
`opacity-${opacity}`,
)}
>
<div
className="top-0 -left-[10rem] w-[56.625rem] h-[56.625rem] overflow-x-hidden bg-[rgb(54,157,253)] bg-opacity-40 blur-[337.4px]"
style={{ transform: "rotate(-30deg)" }}
/>
</div>
);
};

View file

@ -25,7 +25,7 @@ const Services = () => {
src="/images/tailwind-bg-gradient.avif"
className="absolute top-0 right-0 opacity-100 z-2"
/>
<div className="absolute top-0 left-0 w-full h-full pointer-events-none md:w-3/5 xl:w-auto">
<div className="absolute top-0 left-0 w-full h-full md:w-3/5 xl:w-auto">
<img
className="object-cover w-full h-full md:object-right"
width={800}
@ -138,7 +138,7 @@ const Services = () => {
className="absolute top-0 right-0 opacity-60 z-2"
/>
<div className="absolute top-0 right-0 left-0 mx-auto w-full h-full pointer-events-none xl:w-auto">
<div className="absolute top-0 right-0 left-0 mx-auto w-full h-full xl:w-auto">
<img
className="object-cover z-40 w-full h-full border-r-2 md:scale-110 border-r-white/5"
width={800}

View file

@ -58,10 +58,10 @@ const SlideTabs = () => {
</Tab>
<Link
href="/#waitlist"
href="/signin"
className="inline-flex gap-x-2 justify-start items-start py-3 px-5 ml-3 w-full rounded-3xl border duration-200 sm:w-auto group bg-page-gradient border-white/30 text-md font-geistSans hover:border-zinc-600 hover:bg-transparent/10 hover:text-zinc-100"
>
Join waitlist
Sign in
<div className="flex overflow-hidden relative justify-center items-center ml-1 w-5 h-5">
<ArrowUpRight className="absolute transition-all duration-500 group-hover:translate-x-4 group-hover:-translate-y-5" />
<ArrowUpRight className="absolute transition-all duration-500 -translate-x-4 -translate-y-5 group-hover:translate-x-0 group-hover:translate-y-0" />

View file

@ -114,7 +114,11 @@ function Feature({
}) {
return (
<div
className={clsx(className ,"focus:outline-none", !isActive && "opacity-75 hover:opacity-100")}
className={clsx(
className,
"focus:outline-none",
!isActive && "opacity-75 hover:opacity-100",
)}
{...props}
>
<div
@ -213,7 +217,7 @@ function FeaturesDesktop() {
</TabPanel>
))}
</div>
<div className="pointer-events-none absolute inset-0 rounded-4xl ring-1 ring-inset ring-gray-200/10" />
<div className="absolute inset-0 rounded-4xl ring-1 ring-inset ring-gray-200/10" />
</TabPanels>
</>
)}

View file

@ -25,7 +25,7 @@ export default async function Home() {
<>
<BackgroundPlus />
<main className="flex overflow-x-hidden relative flex-col items-center px-2 min-h-screen md:px-0 font-geistSans bg-hero-gradient">
<div className="absolute top-0 z-10 min-h-screen w-screen overflow-hidden bg-inherit bg-[radial-gradient(ellipse_20%_80%_at_50%_-20%,rgba(120,119,198,0.3),rgba(255,255,255,0))]"></div>
<div className="absolute top-0 -z-10 min-h-screen w-screen overflow-hidden bg-inherit bg-[radial-gradient(ellipse_20%_80%_at_50%_-20%,rgba(120,119,198,0.3),rgba(255,255,255,0))]"></div>
<Navbar />