discount fixes

This commit is contained in:
tree🌴 2023-04-25 09:39:55 +02:00
parent 816a84cfc3
commit 4e25dd7cd1

View file

@ -148,81 +148,86 @@
group group
</div> </div>
{:else} {:else}
{#each badges as badge} <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-6 lg:gap-12">
<div {#each badges as badge}
class="lg:flex justify-center mb-4 badge {userBadges?.badges && <div
userBadges?.badges[badge?.id]?.eligible class="justify-center text-center badge {userBadges?.badges &&
? 'bg-white text-black eligible' userBadges?.badges[badge?.id]?.eligible
: ' border-gray-800'} p-6" ? 'bg-white text-black eligible'
on:mouseenter={animateSection(30)} : ' border-gray-800'}"
> on:mouseenter={animateSection(30)}
<div class="w-24 lg:w-32 mr-6 inline-block xl:block"> >
<img <div class="mb-6 text-center">
src={badge.img} <img
class="w-full {connected && userBadges && userBadges.badges[badge.id]?.eligible src={badge.img}
? '' class="w-20 h-28 lg:w-32 lg:h-32 {connected &&
: 'grayscale'} badge-image" userBadges &&
/> userBadges.badges[badge.id]?.eligible
</div> ? ''
<div class="lg:text-left w-full"> : 'grayscale'} badge-image inline-block object-contain"
{#if badge.shortname}<div class="uppercase font-bold">{badge.shortname}</div>{/if} />
<div class={badge.shortname ? '' : 'font-bold'}>
<a
href={badge.url}
target="_blank"
class="external animate-section font-mono2 lowercase">{badge.name}</a
>
</div> </div>
<div class="mt-2"> <div class="w-full">
Price: <span class="font-bold" {#if badge.shortname}<div class="uppercase font-bold">{badge.shortname}</div>{/if}
>€{data.config.ticketBasePrice - <div class={badge.shortname ? '' : 'font-bold'}>
data.config.ticketBasePrice * (badge.discount / 100)}</span <a
> href={badge.url}
({badge.discount}% discount) target="_blank"
</div> class="external animate-section font-mono2 lowercase">{badge.name}</a
{#if connected && userBadges} >
<div class="pt-2">
{#if claimed[badge.id]}
{#if claimed[badge.id].voucher}
Your personal voucher: <a
href={redeemUrl + claimed[badge.id].voucher}
target="_blank"
class="underline hover:no-underline external">{claimed[badge.id].voucher}</a
>
<div class="pt-2">
<a href={redeemUrl + claimed[badge.id].voucher} target="_blank"
><button
class="button-inverse"
on:mouseenter={(ev) => animateText(ev, 15)}
>Buy ticket using voucher</button
></a
>
</div>
{:else}
{claimed[badge.id].text || 'Please sign message in your wallet ..'}
{/if}
{:else if userBadges.badges[badge.id]?.eligible}
<button
class="button-inverse"
on:click={claimHandler(badge.id)}
on:mouseenter={(ev) => animateText(ev, 15)}>Eligible! Get discount!</button
>
{:else}
<button class="button button-inactive text-gray-600 border-gray-600"
>Not eligible</button
>
{/if}
</div> </div>
{/if} <div class="mt-4">
{#if badge.text} Ticket: <span class="font-bold"
<div class="text-sm leading-6 pt-2 text-mild">{badge.text}</div> >€{data.config.ticketBasePrice -
{/if} data.config.ticketBasePrice * (badge.discount / 100)}</span
>
({badge.discount}% discount)
</div>
{#if connected && userBadges}
<div class="pt-2">
{#if claimed[badge.id]}
{#if claimed[badge.id].voucher}
Your personal voucher: <a
href={redeemUrl + claimed[badge.id].voucher}
target="_blank"
class="underline hover:no-underline external"
>{claimed[badge.id].voucher}</a
>
<div class="pt-2">
<a href={redeemUrl + claimed[badge.id].voucher} target="_blank"
><button
class="button-inverse"
on:mouseenter={(ev) => animateText(ev, 15)}
>Buy ticket using voucher</button
></a
>
</div>
{:else}
{claimed[badge.id].text || 'Please sign message in your wallet ..'}
{/if}
{:else if userBadges.badges[badge.id]?.eligible}
<button
class="button-inverse"
on:click={claimHandler(badge.id)}
on:mouseenter={(ev) => animateText(ev, 15)}>Eligible! Get discount!</button
>
{:else}
<button class="button button-inactive text-gray-600 border-gray-600"
>Not eligible</button
>
{/if}
</div>
{/if}
{#if badge.text}
<div class="text-sm leading-6 pt-4 text-mild">{badge.text}</div>
{/if}
</div>
</div> </div>
</div> {/each}
{/each} </div>
{/if} {/if}
</div> </div>
<div class="text-xl font-mono2 lowercase mb-8" on:mouseenter={animateText}> <div class="text-xl font-mono2 lowercase mt-12 mb-8" on:mouseenter={animateText}>
Other discounts (via form) Other discounts (via form)
</div> </div>
<div class="text-mild"> <div class="text-mild">