This commit is contained in:
tree🌴 2023-04-28 13:25:11 +02:00
parent 72c41b520f
commit c1752ab662
2 changed files with 7 additions and 6 deletions

View file

@ -201,9 +201,10 @@
.person-item {
@apply cursor-help transition-all duration-500;
}
.partner-item { @apply transition-all; }
.partner-item .partner-img { @apply grayscale; }
.partner-item:hover .partner-img { @apply grayscale-0; }
.partner-item .partner-text { @apply invisible; }
.partner-item:hover .partner-text { @apply visible; }
.partner-item .partner-text { @apply text-white/0 transition-all duration-300; }
.partner-item .partner-text .text-mild { @apply text-white/0; }
.partner-item:hover .partner-text { @apply text-white; }
.partner-item:hover .partner-text .text-mild { @apply text-white/50 duration-1000; }
}

View file

@ -67,11 +67,11 @@
<div class="section-header" on:mouseenter={animateText}>Partners</div>
<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6 gap-4 mb-12">
{#each data.config.partners as partner}
<div class="partner-item text-center uppercase hover:lowercase items-center p-4" on:mouseenter={animateSection(40)}>
<div class="partner-item text-center items-center p-4" on:mouseenter={animateSection(40)}>
<div><a href={partner.web}><img src="/partners/{partner.img}" class="partner-img aspect-[16/11] w-full h-full object-contain {partner.padding ? `p-${partner.padding}` : ''}" /></a></div>
<div class="p-2 partner-text">
<div><a href={partner.web} class="font-mono2 animate-section">{partner.name}</a></div>
<div><a href="https://twitter.com/{partner.twitter}" class="text-sm">@{partner.twitter}</a></div>
<div><a href={partner.web} class="font-mono2 animate-section lowercase">{partner.name}</a></div>
<div><a href="https://twitter.com/{partner.twitter}" class="text-sm text-mild">@{partner.twitter}</a></div>
</div>
</div>
{/each}