style(affiliation): fix icon and logo visibility in dark mode

This commit is contained in:
MichalC
2026-09-18 00:08:15 +02:00
parent 12126a0920
commit 1da3850759
+3 -4
View File
@@ -22,14 +22,13 @@ export const AffiliationBlock: React.FC<Props> = ({ eyebrow, title, description,
<div className="container-premium"> <div className="container-premium">
<div className="grid grid-cols-1 lg:grid-cols-12 gap-16 lg:gap-24 items-center"> <div className="grid grid-cols-1 lg:grid-cols-12 gap-16 lg:gap-24 items-center">
{/* Lewa kolumna: Logo (Stamp) */}
<div className="lg:col-span-5 flex justify-center lg:justify-end order-1"> <div className="lg:col-span-5 flex justify-center lg:justify-end order-1">
<motion.div <motion.div
initial={{ opacity: 0, scale: 1.5, rotate: -15 }} initial={{ opacity: 0, scale: 1.5, rotate: -15 }}
whileInView={{ opacity: 1, scale: 1, rotate: 0 }} whileInView={{ opacity: 1, scale: 1, rotate: 0 }}
viewport={{ once: true, margin: "-50px" }} viewport={{ once: true, margin: "-50px" }}
transition={{ type: "spring", stiffness: 100, damping: 15 }} transition={{ type: "spring", stiffness: 100, damping: 15 }}
className="w-48 h-48 md:w-64 md:h-64 relative bg-card rounded-full p-8 shadow-xl border-4 border-accent/20 flex items-center justify-center shrink-0" className={`w-48 h-48 md:w-64 md:h-64 relative ${logoUrl ? 'bg-white' : 'bg-card'} rounded-full p-8 shadow-xl border-4 border-accent/20 flex items-center justify-center shrink-0`}
> >
{logoUrl ? ( {logoUrl ? (
/* eslint-disable-next-line @next/next/no-img-element */ /* eslint-disable-next-line @next/next/no-img-element */
@@ -39,8 +38,8 @@ export const AffiliationBlock: React.FC<Props> = ({ eyebrow, title, description,
className="max-w-full max-h-full object-contain mix-blend-multiply" className="max-w-full max-h-full object-contain mix-blend-multiply"
/> />
) : ( ) : (
<div className="w-full h-full flex flex-col items-center justify-center text-border bg-card rounded-full"> <div className="w-full h-full flex flex-col items-center justify-center text-accent rounded-full">
<Landmark size={48} strokeWidth={1.5} /> <Landmark className="w-20 h-20 md:w-28 md:h-28" strokeWidth={1.5} />
</div> </div>
)} )}
</motion.div> </motion.div>