updated sponsor page

sitcon-tw · Jan 12, 2024 · 6364862 · 6364862
1 parent 5a8cbfa
commit 6364862
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/app/(website)/sponsor/page.tsx b/app/(website)/sponsor/page.tsx
@@ -23,7 +23,16 @@ function Sponsors({
       )}
     >
       {sponsors.map((sponsor, i) => (
-        <SponsorCard data={sponsor} key={i} />
+        <div key={i} className="group/sponsor relative rounded-lg bg-white">
+          <div
+            className="absolute inset-0 scale-0 opacity-0 blur-xl transition-all duration-300 group-hover/sponsor:scale-100 group-hover/sponsor:opacity-50"
+            style={{
+              backgroundImage: `linear-gradient(90deg, rgba(56, 90, 172, 0.80) 0%, rgba(148, 110, 52, 0.75) 58.96%, #462002 100%)`,
+            }}
+          />
+          <div className="absolute inset-0 rounded-lg bg-white" />
+          <SponsorCard data={sponsor} />
+        </div>
       ))}
     </div>
   );

diff --git a/components/website/SponsorCard.tsx b/components/website/SponsorCard.tsx
@@ -18,12 +18,11 @@ export default function SponsorCard({
       <motion.img
         src={`/2024/sponsor/${data.image}`}
         className={twMerge(
-          "mx-auto w-full cursor-pointer rounded transition-all hover:drop-shadow-lg",
+          "relative mx-auto w-full cursor-pointer rounded transition-all",
           className,
         )}
         alt={data.title}
         onClick={() => setIsDialogOpen(true)}
-        whileHover={{ scale: 1.05 }}
         whileTap={{ scale: 0.95 }}
       />
       <Dialog open={isDialogOpen} setOpen={setIsDialogOpen}>