web3privacy/w3ps1
1
0
Fork 0
mirror of https://github.com/web3privacy/w3ps1.git synced 2024-10-15 16:26:26 +02:00
Code Issues Projects Releases Packages Wiki Activity

update

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/app.css
View file

@ -201,9 +201,10 @@
.person-item { .person-item {
@apply cursor-help transition-all duration-500; @apply cursor-help transition-all duration-500;
} }
.partner-item { @apply transition-all; }
.partner-item .partner-img { @apply grayscale; } .partner-item .partner-img { @apply grayscale; }
.partner-item:hover .partner-img { @apply grayscale-0; } .partner-item:hover .partner-img { @apply grayscale-0; }
.partner-item .partner-text { @apply invisible; } .partner-item .partner-text { @apply text-white/0 transition-all duration-300; }
.partner-item:hover .partner-text { @apply visible; } .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; }
} }

6
src/routes/+page.svelte
View file

@ -67,11 +67,11 @@
<div class="section-header" on:mouseenter={animateText}>Partners</div> <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"> <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} {#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><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 class="p-2 partner-text">
<div><a href={partner.web} class="font-mono2 animate-section">{partner.name}</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">@{partner.twitter}</a></div> <div><a href="https://twitter.com/{partner.twitter}" class="text-sm text-mild">@{partner.twitter}</a></div>
</div> </div>
</div> </div>
{/each} {/each}