<div class="relative">
<div class="absolute top-0 left-0 w-full h-full opacity-75 {{
auction.auctionhouse.color
?? 'bg-neutral-400'
}}"
style="background-color: {{ auction.auctionhouse.color }};"></div>
<div class="container relative z-10 pt-8 pb-5 md:pb-12 md:pt-24 lg:pb-16 lg:pt-32">
<div class="flex w-full gap-x-3 md:gap-x-7 lg:gap-x-14 gap-y-10">
<div class="flex w-16 h-16 col-span-9 md:w-36 md:h-36 lg:w-56 lg:h-56 lg:col-span-2">
{% include 'component/avatar.html.twig' with {
avatar: auction.image,
initials: auction.title|initials,
size: 'hero',
rounded: false
} only %}
</div>
<div class="grid flex-1 gap-2">
<div class="flex flex-col tracking-wide text-white font-headline">
<h2 class="text-xl font-medium uppercase md:font-light md:text-3xl">
{{ auction.start|date('d.m.Y') }} - {{ auction.end|date('d.m.Y') }}
</h2>
<h1 class="text-2xl font-medium leading-tight uppercase md:font-light md:text-4xl lg:text-5xl">
{{ auction.title }}
</h1>
</div>
<div class="flex gap-12">
<div>
<ul class="flex gap-4 text-white md:text-lg font-headline">
{% if auction.auctionType %}
<li><span>{{ auction.auctionType|trans }}</span></li>
{% endif %}
{% if auction.platform %}
<li class="flex items-center gap-2">
{% set icons = {
'auction.platform.online': 'icons/web.svg.twig',
'auction.platform.attendence': 'icons/hammer.svg.twig',
'auction.platform.hybrid': 'icons/hybrid.svg.twig'
} %}
{% include icons[auction.platform] with { class: 'w-4 h-4 mb-px' } %}
<span>{{ auction.platform|trans }}</span>
</li>
{% endif %}
</ul>
</div>
</div>
<div class="flex justify-start">
{% if user %}
{# {% set title = 'auction-attendance'|trans %} #}
{% set turbo_id = 'hero' %}
{% embed 'network/widget/widget.html.twig' %}
{% block content %}
<turbo-frame id="auction-{{ auction.id }}-attend{{
turbo_id
? '-' ~ turbo_id
: ''
}}"
src="{{
path(
'auction_attend',
{ auctionId: auction.id, turbo_id: turbo_id }
)
}}"></turbo-frame>
{% endblock %}
{% endembed %}
{% endif %}
</div>
{# <div class="hidden gap-4 my-4 sm:flex">
{% for item in section_navigation_get() %}
<a target="_top" href="{{ '#' ~ item.anchor }}" class="btn-sm btn btn-neutral">
{{ item.name|trans }}
</a>
{% endfor %}
</div> #}
</div>
</div>
</div>
</div>