EP/myep
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement screendesign

Browse Source
This commit is contained in:
Björn Fromme
2025-12-06 15:02:33 +01:00
parent b206c3990b
commit bfb1a04ea0
84 changed files with 2807 additions and 2603 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/account/index.html.twig
+33
View File
@@ -0,0 +1,33 @@
{% extends 'layout.html.twig' %}
{% block content %}
<div class="px-4 lg:px-8 py-8 lg:py-16">
<h1 class="text-white uppercase pb-4">
Mein<br>Account
</h1>
</div>
<div class="p-4 ld:p-8">
<nav>
<ul class="divide-y divide-primary-bg/40">
<li class="py-4">
<a href="{{ path('app_bookings') }}" class="flex items-center space-x-2 group" {{ stimulus_action('loading', 'toggle') }}>
<svg class="w-8 h-8 text-white group-hover:text-primary-light" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><line x1="128" y1="128" x2="216" y2="128" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><line x1="128" y1="64" x2="216" y2="64" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><line x1="128" y1="192" x2="216" y2="192" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><polyline points="40 64 56 80 88 48" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><polyline points="40 128 56 144 88 112" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><polyline points="40 192 56 208 88 176" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/></svg>
<span class="text-xl uppercase text-white group-hover:text-primary-light">Meine Buchungen</span>
</a>
</li>
<li class="py-4">
<a href="{{ path('app_personal_data') }}" class="flex items-center space-x-2 group" {{ stimulus_action('loading', 'toggle') }}>
<svg class="w-8 h-8 text-white group-hover:text-primary-light" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><path d="M160,224c3.67-13.8,16.6-24,32-24s28.33,10.2,32,24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><circle cx="192" cy="176" r="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><path d="M120,208H40a8,8,0,0,1-8-8V64a8,8,0,0,1,8-8H93.33a8,8,0,0,1,4.8,1.6l27.74,20.8a8,8,0,0,0,4.8,1.6H216a8,8,0,0,1,8,8v32" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/></svg>
<span class="text-xl uppercase text-white group-hover:text-primary-light">Meine Daten</span>
</a>
</li>
<li class="py-4">
<a href="{{ path('app_logout') }}" class="flex items-center space-x-2 group">
<svg class="w-8 h-8 text-white group-hover:text-primary-light" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><polyline points="112 40 48 40 48 216 112 216" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><line x1="112" y1="128" x2="224" y2="128" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/><polyline points="184 88 224 128 184 168" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/></svg>
<span class="text-xl uppercase text-white group-hover:text-primary-light">abmelden</span>
</a>
</li>
</ul>
</nav>
</div>
{% endblock %}
templates/account/personal_data.html.twig
+68
View File
@@ -0,0 +1,68 @@
{% extends 'layout.html.twig' %}
{% block content %}
<div class="px-4 lg:px-8 py-8 lg:py-16">
<h1 class="text-white uppercase pb-4">
Meine<br>Daten
</h1>
</div>
<div class="p-4 ld:p-8">
<div class="divide-y divide-primary-bg/40">
<div class="grid md:grid-cols-2 gap-x-8 gap-y-4 pb-8">
<div class="text-white">
<strong>Name</strong>: {{ personalData.fullName }}
<br>
<strong>Gender</strong>: {{ personalData.gender|map_gender }}
<br>
<strong>Geburtsdatum</strong>: {{ personalData.dateOfBirth|date('d.m.Y') }}
<br>
<strong>Nationalität</strong>: {{ personalData.nationality|map_nationality|default('-') }}
</div>
<div id="newsletter">
<p class="pb-4 text-white">
Du bist aktuell {% if not personalData.communication.newsletter %}<strong>nicht</strong> {% endif%} zum Newsletter
angemeldet.
</p>
<button type="button"
class="relative button button--primary"
hx-post="{{ path('app_personal_data_newsletter') }}"
hx-target="#newsletter"
hx-select="#newsletter"
hx-swap="outerHTML">
{% if personalData.communication.newsletter %}jetzt abmelden{% else %}jetzt anmelden{% endif %}
</button>
</div>
</div>
<div class="pt-8">
<h2 class="text-white uppercase text-xl">
Kontaktdaten
</h2>
{% include '_partials/_flashes.html.twig' %}
{{ form_start(personalDataForm, { 'attr': { 'data-action': 'loading#toggle' } }) }}
<div class="grid md:grid-cols-2 gap-x-8 gap-y-4 pb-4">
<div>
{{ form_row(personalDataForm.street, { 'label_attr': { 'class': 'text-white' } }) }}
{{ form_row(personalDataForm.postCode, { 'label_attr': { 'class': 'text-white' } }) }}
{{ form_row(personalDataForm.city, { 'label_attr': { 'class': 'text-white' } }) }}
{{ form_row(personalDataForm.country, { 'label_attr': { 'class': 'text-white' } }) }}
</div>
<div>
{{ form_row(personalDataForm.email, { 'label_attr': { 'class': 'text-white' } }) }}
{{ form_row(personalDataForm.phone, { 'label_attr': { 'class': 'text-white' } }) }}
{{ form_row(personalDataForm.mobile, { 'label_attr': { 'class': 'text-white' } }) }}
</div>
</div>
<div class="flex justify-between">
<a href="{{ path('app_account') }}" class="button button--secondary">
zurück
</a>
<button type="submit" class="button button--primary">
Speichern
</button>
</div>
{{ form_rest(personalDataForm) }}
{{ form_end(personalDataForm) }}
</div>
</div>
</div>
{% endblock %}