change ablauf add ticket notes

Reviewed-on: #48
This commit is contained in:
2025-03-15 13:56:08 +00:00
parent 6e0c32f9d2
commit 23b050ef98
2 changed files with 141 additions and 112 deletions

View File

@ -12,6 +12,7 @@ class TicketData
1 => [ 1 => [
'name' => 'All-Inclusive Ticket', 'name' => 'All-Inclusive Ticket',
'price' => 50, 'price' => 50,
'note' => 'Harter Alkohol nicht inbegriffen',
], ],
3 => [ 3 => [
'name' => 'Kind (12-15 Jahre)', 'name' => 'Kind (12-15 Jahre)',
@ -26,8 +27,9 @@ class TicketData
'price' => 0, 'price' => 0,
], ],
2 => [ 2 => [
'name' => 'After-Show Ticket (ab 22 Uhr)', 'name' => 'After-Show Ticket',
'price' => 20, 'price' => 20,
'note' => 'Einlass ab 22 Uhr',
], ],
]; ];

View File

@ -3,7 +3,8 @@
{% block title %}Home{% endblock %} {% block title %}Home{% endblock %}
{% block body %} {% block body %}
<div class="min-h-screen relative overflow-hidden" style="background-image: url('{{ asset('images/backgrounds/abiball_bg.jpeg') }}'); background-size: cover; background-position: center; background-attachment: fixed;"> <div class="min-h-screen relative overflow-hidden"
style="background-image: url('{{ asset('images/backgrounds/abiball_bg.jpeg') }}'); background-size: cover; background-position: center; background-attachment: fixed;">
<div class="min-h-screen bg-black/30 backdrop-blur-[2px] relative overflow-hidden"> <div class="min-h-screen bg-black/30 backdrop-blur-[2px] relative overflow-hidden">
<header class="w-full bg-white/90 backdrop-blur-md shadow-lg fixed top-0 z-50 border-b border-gray-100"> <header class="w-full bg-white/90 backdrop-blur-md shadow-lg fixed top-0 z-50 border-b border-gray-100">
<div class="container mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-3 sm:py-4 flex justify-between items-center"> <div class="container mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-3 sm:py-4 flex justify-between items-center">
@ -22,7 +23,8 @@
<main class="container mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 pt-24 sm:pt-28 md:pt-32 pb-16 sm:pb-20 flex flex-col items-center justify-center relative z-10"> <main class="container mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 pt-24 sm:pt-28 md:pt-32 pb-16 sm:pb-20 flex flex-col items-center justify-center relative z-10">
<h1 class="text-3xl sm:text-4xl md:text-5xl font-bold text-white text-center mb-6 sm:mb-8 tracking-tight leading-tight"> <h1 class="text-3xl sm:text-4xl md:text-5xl font-bold text-white text-center mb-6 sm:mb-8 tracking-tight leading-tight">
Willkommen zum <span class="bg-clip-text text-transparent bg-gradient-to-r from-red-500 to-orange-500">Abiball 2025</span> Willkommen zum <span
class="bg-clip-text text-transparent bg-gradient-to-r from-red-500 to-orange-500">Abiball 2025</span>
</h1> </h1>
<div class="w-full max-w-6xl"> <div class="w-full max-w-6xl">
<div class="bg-white/80 backdrop-blur-md shadow-xl rounded-2xl sm:rounded-3xl p-6 sm:p-8 md:p-10 mb-6 sm:mb-8 transform transition-all duration-300 border border-gray-100"> <div class="bg-white/80 backdrop-blur-md shadow-xl rounded-2xl sm:rounded-3xl p-6 sm:p-8 md:p-10 mb-6 sm:mb-8 transform transition-all duration-300 border border-gray-100">
@ -38,7 +40,8 @@
<div class="grid grid-cols-1 sm:grid-cols-3 w-full gap-3 mb-5"> <div class="grid grid-cols-1 sm:grid-cols-3 w-full gap-3 mb-5">
<div class="bg-white/80 backdrop-blur-md shadow-xl rounded-2xl sm:rounded-3xl p-5 mb-3 sm:mb-12 transform transition-all duration-300 border border-gray-100"> <div class="bg-white/80 backdrop-blur-md shadow-xl rounded-2xl sm:rounded-3xl p-5 mb-3 sm:mb-12 transform transition-all duration-300 border border-gray-100">
<h2 class="text-xl text-center font-semibold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-red-500 to-orange-500">Datum & Uhrzeit</h2> <h2 class="text-xl text-center font-semibold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-red-500 to-orange-500">
Datum & Uhrzeit</h2>
<div class="space-y-3"> <div class="space-y-3">
<div class="flex items-center space-x-3"> <div class="flex items-center space-x-3">
<twig:ux:icon name="heroicons:calendar" class="w-5 h-5 text-orange-600"/> <twig:ux:icon name="heroicons:calendar" class="w-5 h-5 text-orange-600"/>
@ -59,15 +62,26 @@
</div> </div>
</div> </div>
<div class="bg-white/80 backdrop-blur-md shadow-xl rounded-2xl sm:rounded-3xl p-5 mb-3 sm:mb-12 transform transition-all duration-300 border border-gray-100"> <div class="bg-white/80 backdrop-blur-md shadow-xl rounded-2xl sm:rounded-3xl p-5 mb-3 sm:mb-12 transform transition-all duration-300 border border-gray-100">
<h2 class="text-xl text-center font-semibold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-red-500 to-orange-500">Ablauf</h2> <h2 class="text-xl text-center font-semibold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-red-500 to-orange-500">
Ablauf</h2>
<div class="space-y-6">
<div>
<h3 class="text-lg font-semibold mb-3">Freitag (27. Juni 2025)</h3>
<div class="space-y-3"> <div class="space-y-3">
<div class="flex items-center space-x-3"> <div class="flex items-center space-x-3">
<twig:ux:icon name="heroicons:academic-cap" class="w-5 h-5 text-orange-600" /> <twig:ux:icon name="heroicons:academic-cap"
class="w-5 h-5 text-orange-600"/>
<div class="text-gray-700"> <div class="text-gray-700">
<span class="font-medium">(14:00-16:30</span> <span class="font-medium">17:30-19:30</span>
<span class="ml-2">Zeugnisvergabe)</span> <span class="ml-2">Zeugnisvergabe</span>
</div> </div>
</div> </div>
</div>
</div>
<div>
<h3 class="text-lg font-semibold mb-3">Samstag (28. Juni 2025)</h3>
<div class="space-y-3">
<div class="flex items-center space-x-3"> <div class="flex items-center space-x-3">
<twig:ux:icon name="heroicons:ticket" class="w-5 h-5 text-orange-600"/> <twig:ux:icon name="heroicons:ticket" class="w-5 h-5 text-orange-600"/>
<div class="text-gray-700"> <div class="text-gray-700">
@ -83,7 +97,8 @@
</div> </div>
</div> </div>
<div class="flex items-center space-x-3"> <div class="flex items-center space-x-3">
<twig:ux:icon name="heroicons:musical-note" class="w-5 h-5 text-orange-600" /> <twig:ux:icon name="heroicons:musical-note"
class="w-5 h-5 text-orange-600"/>
<div class="text-gray-700"> <div class="text-gray-700">
<span class="font-medium">22:00-03:00</span> <span class="font-medium">22:00-03:00</span>
<span class="ml-2">Feier & Tanz im Saal</span> <span class="ml-2">Feier & Tanz im Saal</span>
@ -91,19 +106,31 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div class="bg-white/80 backdrop-blur-md shadow-xl rounded-2xl sm:rounded-3xl p-5 mb-3 sm:mb-12 transform transition-all duration-300 border border-gray-100"> <div class="bg-white/80 backdrop-blur-md shadow-xl rounded-2xl sm:rounded-3xl p-5 mb-3 sm:mb-12 transform transition-all duration-300 border border-gray-100">
<h2 class="text-xl text-center font-semibold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-red-500 to-orange-500">Ticket Preise</h2> <h2 class="text-xl text-center font-semibold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-red-500 to-orange-500">
Ticket Preise</h2>
<div class="space-y-3"> <div class="space-y-3">
{% for ticket in constant('App\\Enum\\TicketData::TICKET_DATA') %} {% for ticket in constant('App\\Enum\\TicketData::TICKET_DATA') %}
<div class="flex items-center space-x-3 w-full"> <div class="flex items-center space-x-3 w-full">
<twig:ux:icon name="heroicons:ticket" class="w-5 h-5 text-orange-600"/> <twig:ux:icon name="heroicons:ticket" class="w-5 h-5 text-orange-600"/>
<div class="text-gray-700 w-full flex justify-between"> <div class="text-gray-700 w-full flex justify-between">
<span class="font-medium">{{ ticket['name'] }}</span> <span class="font-medium">
{{ ticket['name'] }}
{% if ticket.note is defined %}
<span class="relative group">
<span class="cursor-help text-orange-600">*</span>
<span class="absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 w-64 px-3 py-2 bg-gray-800 text-white text-sm rounded shadow-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 pointer-events-none z-10">
{{ ticket.note }}
</span>
</span>
{% endif %}
</span>
<span class="mr-2">{{ ticket['price'] }}€</span> <span class="mr-2">{{ ticket['price'] }}€</span>
</div> </div>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
</div> </div>
</div> </div>