feat: adopt main website styles

This commit is contained in:
Björn Fromme
2024-12-04 09:33:09 +01:00
parent 273db3bdb7
commit 2454cfa682
17 changed files with 274 additions and 159 deletions
+1
View File
@@ -1,3 +1,4 @@
@import "components/typography.css";
@import "components/forms.css"; @import "components/forms.css";
@import "components/button.css"; @import "components/button.css";
@import "components/menu.css"; @import "components/menu.css";
+37 -9
View File
@@ -1,16 +1,44 @@
.btn { .button {
@apply inline-flex space-x-1 justify-center rounded-lg text-sm uppercase font-semibold py-2.5 px-4; @apply inline-flex items-center justify-center space-x-2 px-4 py-2 md:px-8 cursor-pointer;
@apply bg-primary text-white hover:bg-primary/80 shadow-md; @apply uppercase leading-none text-center;
@apply transition-colors outline-none focus:outline-none;
} }
.btn--small { .button--small {
@apply text-xs py-1 px-2 rounded-md; @apply px-2 py-1 md:px-4 text-xs sm:text-sm;
} }
.btn--secondary { .button--full {
@apply bg-secondary text-gray-800 hover:bg-secondary/80; @apply block w-full;
} }
.btn--active { .bg-button {
@apply shadow-none; @apply bg-primary-light text-white;
@apply hover:bg-secondary;
}
.bg-button--active,
.bg-button--secondary {
@apply bg-secondary;
}
.bg-button--muted {
@apply bg-zinc-300 hover:bg-zinc-300;
}
.bg-button--dark {
@apply bg-primary-dark;
}
.bg-button--light {
@apply bg-white border-2;
@apply font-bold;
@apply border-primary-light text-primary;
}
.bg-button--light:hover,
.bg-button--light.button--active {
@apply bg-white;
@apply border-secondary text-secondary;
} }
+22
View File
@@ -2,3 +2,25 @@ label.required:after {
@apply inline-block text-sm; @apply inline-block text-sm;
content: '*'; content: '*';
} }
.form-field {
@apply border-zinc-400 focus:border-zinc-800 ring-0 focus:ring-0 mt-1 block w-full;
}
.form-field--has-error {
@apply border-red-500;
}
.form-checkbox,
.form-radio {
@apply border-zinc-400 focus:border-zinc-800 ring-0 focus:ring-0 text-secondary h-4 w-4;
}
.form-checkbox--has-error,
.form-radio--has-error {
@apply border-red-500;
}
input[disabled] {
@apply cursor-not-allowed;
}
+3 -4
View File
@@ -1,12 +1,11 @@
.menu--main { .menu--main {
@apply flex items-center space-x-2; @apply lg:flex lg:items-center m-0;
} }
.menu--main a { .menu--main a {
@apply uppercase text-lg font-semibold pb-1 px-2 border-b-2 border-white; @apply block p-4 text-black hover:bg-zinc-400 hover:text-zinc-800;
@apply hover:border-primary;
} }
.menu--main .current a { .menu--main .current a {
@apply border-primary; @apply bg-zinc-400 text-zinc-800;
} }
+28
View File
@@ -0,0 +1,28 @@
h1,
.headline--primary {
@apply block text-3xl md:text-4xl font-bold mb-2;
}
h2,
.headline--secondary {
@apply block text-2xl md:text-3xl font-bold mb-2;
}
h3,
.headline--3 {
@apply block text-xl md:text-2xl font-bold leading-6 mb-2;
}
h4,
.headline--4 {
@apply block md:text-lg font-bold;
}
.headline--underlined:after {
@apply block border-b-4 border-primary-light pb-4 mb-4 -mt-2 w-20;
content: '';
}
.subline {
@apply block text-xs md:text-sm font-normal leading-6 opacity-60;
}
+1 -1
View File
@@ -78,7 +78,7 @@ class EditController extends AbstractController
$form = $this->createForm(BookingType::class, $formData, [ $form = $this->createForm(BookingType::class, $formData, [
'attr' => ['novalidate' => 'novalidate'], 'attr' => ['novalidate' => 'novalidate'],
'hx_post' => $this->generateUrl('app_booking_edit', ['id' => $id]), 'hx_post' => $this->generateUrl('app_booking_edit', ['id' => $id]),
'hx_target' => '#app', 'hx_target' => '#myep',
]); ]);
$form->handleRequest($request); $form->handleRequest($request);
+1 -1
View File
@@ -35,7 +35,7 @@ class PersonalDataController extends AbstractController
$personalDataForm = $this->createForm(PersonalDataType::class, $personalData, [ $personalDataForm = $this->createForm(PersonalDataType::class, $personalData, [
'attr' => ['novalidate' => 'novalidate'], 'attr' => ['novalidate' => 'novalidate'],
'hx_post' => $this->generateUrl('app_personal_data'), 'hx_post' => $this->generateUrl('app_personal_data'),
'hx_target' => '#app', 'hx_target' => '#myep',
]); ]);
$personalDataForm->handleRequest($request); $personalDataForm->handleRequest($request);
+5 -5
View File
@@ -15,19 +15,19 @@ module.exports = {
fontFamily: { fontFamily: {
sans: ['Lato', 'sans-serif'], sans: ['Lato', 'sans-serif'],
}, },
fontWeight: {
semibold: '700',
bold: '900',
},
colors: { colors: {
primary: '#3d8ccb', primary: '#3d8ccb',
secondary: '#f9c700', secondary: '#f9c700',
'primary-bg': '#ebf3fa',
'primary-light': '#0080ff',
'primary-medium': '#165883',
'primary-dark': '#18527b',
pink: '#fa1a8c',
} }
}, },
}, },
plugins: [ plugins: [
require('@tailwindcss/forms'), require('@tailwindcss/forms'),
require('@tailwindcss/typography'),
], ],
} }
+1 -1
View File
@@ -10,7 +10,7 @@
{{ encore_entry_script_tags('app') }} {{ encore_entry_script_tags('app') }}
{% endblock %} {% endblock %}
</head> </head>
<body class="bg-white text-gray-700 font-sans antialiased text-sm"> <body class="bg-white text-gray-700 font-sans antialiased">
{% block body %}{% endblock %} {% block body %}{% endblock %}
</body> </body>
</html> </html>
+3 -2
View File
@@ -232,10 +232,11 @@
</div> </div>
<div class="flex justify-between"> <div class="flex justify-between">
<a href="{{ path('app_bookings') }}" <a href="{{ path('app_bookings') }}"
class="btn"> class="button bg-button">
zurück zurück
</a> </a>
<button type="submit" class="btn btn--secondary"> <button type="submit"
class="button bg-button bg-button--secondary">
Aktualisieren Aktualisieren
</button> </button>
</div> </div>
+3 -3
View File
@@ -49,17 +49,17 @@
<div class="flex sm:flex-col space-x-2 sm:space-x-0 sm:space-y-1"> <div class="flex sm:flex-col space-x-2 sm:space-x-0 sm:space-y-1">
{% if booking.editable %} {% if booking.editable %}
<a href="{{ path('app_booking_edit', { 'id': booking.id }) }}" <a href="{{ path('app_booking_edit', { 'id': booking.id }) }}"
class="btn btn--small btn--secondary"> class="button bg-button bg-button--secondary button--small">
bearbeiten bearbeiten
</a> </a>
{% endif %} {% endif %}
<a href="{{ path('app_booking_confirmation', { 'id': booking.id }) }}" <a href="{{ path('app_booking_confirmation', { 'id': booking.id }) }}"
class="btn btn--small" class="button bg-button button--small"
target="_blank"> target="_blank">
Bestätigung Bestätigung
</a> </a>
<a href="{{ path('app_booking_documents', { 'id': booking.id }) }}" <a href="{{ path('app_booking_documents', { 'id': booking.id }) }}"
class="btn btn--small" class="button bg-button button--small"
target="_blank"> target="_blank">
Reisedokumente Reisedokumente
</a> </a>
+12 -21
View File
@@ -1,6 +1,7 @@
{% use 'form_div_layout.html.twig' %} {% use 'form_div_layout.html.twig' %}
{%- block form_row -%} {%- block form_row -%}
{%- set row_attr = row_attr|merge({ 'class': (row_attr.class|default('') ~ ' mb-1')|trim }) -%}
{%- set widget_attr = {} -%} {%- set widget_attr = {} -%}
{%- if help is not empty -%} {%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%} {%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
@@ -14,7 +15,7 @@
{%- endblock form_row -%} {%- endblock form_row -%}
{%- block form_label -%} {%- block form_label -%}
{% set class = 'block font-semibold pb-2' %} {% set class = '' %}
{% if errors|length %} {% if errors|length %}
{% set class = class ~ ' text-red-500' %} {% set class = class ~ ' text-red-500' %}
{% endif %} {% endif %}
@@ -35,11 +36,9 @@
{%- block form_widget_simple -%} {%- block form_widget_simple -%}
{%- set type = type|default('text') -%} {%- set type = type|default('text') -%}
{%- if type != 'hidden' -%} {%- if type != 'hidden' -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%} {%- set attr = attr|merge({'class': (attr.class|default('') ~ ' form-field')|trim }) -%}
{%- if errors|length -%} {%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' ring-red-500 placeholder-red-500 focus:ring-red-500' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' form-field--has-error' }) -%}
{% else %}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' placeholder:text-gray-400 focus:ring-primary' }) -%}
{%- endif -%} {%- endif -%}
{%- if disabled is defined and disabled == true -%} {%- if disabled is defined and disabled == true -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%}
@@ -52,11 +51,9 @@
{%- endblock form_widget_simple -%} {%- endblock form_widget_simple -%}
{%- block textarea_widget -%} {%- block textarea_widget -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%} {%- set attr = attr|merge({'class': (attr.class|default('') ~ ' form-field')|trim }) -%}
{%- if errors|length -%} {%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' ring-red-500 placeholder-red-500 focus:ring-red-500' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' form-field--has-error' }) -%}
{% else %}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' placeholder:text-gray-400 focus:ring-primary' }) -%}
{%- endif -%} {%- endif -%}
{%- if disabled is defined and disabled == true -%} {%- if disabled is defined and disabled == true -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%}
@@ -68,11 +65,9 @@
{%- endblock textarea_widget -%} {%- endblock textarea_widget -%}
{%- block checkbox_widget -%} {%- block checkbox_widget -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' h-4 w-4 rounded text-primary')|trim }) -%} {%- set attr = attr|merge({'class': (attr.class|default('') ~ ' form-checkbox')|trim }) -%}
{%- if errors|length -%} {%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' border-red-500 text-red-500 ring-red-500 focus:ring-red-500' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' form-checkbox--has-error' }) -%}
{% else %}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' border-gray-300 focus:ring-primary' }) -%}
{%- endif -%} {%- endif -%}
{%- if attr.disabled is defined and attr.disabled == true -%} {%- if attr.disabled is defined and attr.disabled == true -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%}
@@ -81,11 +76,9 @@
{%- endblock checkbox_widget -%} {%- endblock checkbox_widget -%}
{%- block radio_widget -%} {%- block radio_widget -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' h-4 w-4 rounded-full text-primary')|trim }) -%} {%- set attr = attr|merge({'class': (attr.class|default('') ~ ' form-radio')|trim }) -%}
{%- if errors|length -%} {%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' border-red-500 text-red-500 ring-red-500 focus:ring-red-500' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' form-radio--has-error' }) -%}
{% else %}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' border-gray-300 focus:ring-primary' }) -%}
{%- endif -%} {%- endif -%}
{%- if attr.disabled is defined and attr.disabled == true -%} {%- if attr.disabled is defined and attr.disabled == true -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%}
@@ -108,11 +101,9 @@
{% endblock %} {% endblock %}
{%- block choice_widget_collapsed -%} {%- block choice_widget_collapsed -%}
{%- set attr = attr|merge({'class': (attr.class|default('') ~ ' block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset text-sm')|trim }) -%} {%- set attr = attr|merge({'class': (attr.class|default('') ~ ' form-field')|trim }) -%}
{%- if errors|length -%} {%- if errors|length -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' ring-red-500 placeholder-red-500 focus:ring-red-500' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' form-field--has-error' }) -%}
{% else %}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' placeholder:text-gray-400 focus:ring-primary' }) -%}
{%- endif -%} {%- endif -%}
{%- if disabled is defined and disabled == true -%} {%- if disabled is defined and disabled == true -%}
{%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%} {%- set attr = attr|merge({'class': attr.class|default('') ~ ' cursor-not-allowed' }) -%}
+10 -8
View File
@@ -1,15 +1,17 @@
<div class="container py-8" <div class="container mb-16"
id="app" id="myep"
hx-boost="true" hx-boost="true"
hx-indicator="#loading-indicator"> hx-indicator="#loading-indicator">
<div class="relative z-20 flex items-center justify-between pb-4"> <div class="relative z-20 flex items-center justify-between pb-4">
<div class="text-3xl font-medium">
MyE&amp;P
</div>
{% if is_granted('ROLE_USER') %} {% if is_granted('ROLE_USER') %}
<div class="hidden lg:block"> <nav class="w-full bg-zinc-100 flex items-center mb-8 relative">
{{ knp_menu_render(knp_menu_get('main')) }} <div class="flex-1 block text-2xl px-4">My E&amp;P</div>
</div> <div class="bg-zinc-50 shadow w-full lg:w-auto absolute lg:relative z-10 lg:z-auto top-full lg:top-auto left-0 lg:shadow-none lg:flex lg:space-x-4">
<div class="lg:flex lg:items-center m-0">
{{ knp_menu_render(knp_menu_get('main')) }}
</div>
</div>
</nav>
{% endif %} {% endif %}
</div> </div>
<div id="content"> <div id="content">
+8 -4
View File
@@ -34,7 +34,7 @@
{{ form_row(personalDataForm.phone) }} {{ form_row(personalDataForm.phone) }}
{{ form_row(personalDataForm.mobile) }} {{ form_row(personalDataForm.mobile) }}
</div> </div>
<button type="submit" class="btn"> <button type="submit" class="button bg-button">
Speichern Speichern
</button> </button>
{{ form_rest(personalDataForm) }} {{ form_rest(personalDataForm) }}
@@ -49,11 +49,15 @@
Du bist aktuell {% if not personalData.communication.newsletter %}<strong>nicht</strong> {% endif%} zum Newsletter Du bist aktuell {% if not personalData.communication.newsletter %}<strong>nicht</strong> {% endif%} zum Newsletter
angemeldet. angemeldet.
</p> </p>
<button type="button" class="btn" hx-post="{{ path('app_personal_data_newsletter') }}" hx-target="#app" hx-swap="outerHTML"> <button type="button"
class="button bg-button bg-button--secondary"
hx-post="{{ path('app_personal_data_newsletter') }}"
hx-target="#myep"
hx-swap="outerHTML">
{% if personalData.communication.newsletter %} {% if personalData.communication.newsletter %}
vom Newsletter abmelden jetzt abmelden
{% else %} {% else %}
zum Newsletter anmelden jetzt anmelden
{% endif %} {% endif %}
</button> </button>
</div> </div>
+23 -21
View File
@@ -1,26 +1,28 @@
{% extends 'layout.html.twig' %} {% extends 'layout.html.twig' %}
{% block content %} {% block content %}
<div class="p-8 max-w-screen-sm border border-gray-300 rounded-md mx-auto"> <h1 class="mb-4">
<h2 class="text-2xl font-semibold pb-4"> Registrierung MyE&amp;P
Registrierung MyE&amp;P </h1>
</h2> {{ form_start(form) }}
{{ form_start(form) }} <div class="grid grid-cols-1 md:grid-cols-2 gap-x-4 mb-4">
<div class="grid grid-cols-2 gap-x-8 gap-y-4 pb-4"> {{ form_row(form.firstName) }}
{{ form_row(form.firstName) }} {{ form_row(form.name) }}
{{ form_row(form.name) }} {{ form_row(form.email) }}
{{ form_row(form.gender) }} {{ form_row(form.gender) }}
{{ form_row(form.email) }}
</div>
<button type="submit" class="btn">
Absenden
</button>
<div class="pt-4">
<a href="{{ path('app_login') }}" class="underline">
zurück
</a>
</div>
{{ form_rest(form) }}
{{ form_end(form) }}
</div> </div>
<div class="flex flex-col lg:flex-row space-y-2 lg:space-y-0 lg:space-x-2">
<button type="submit" class="button bg-button">
registrieren
</button>
<button type="button"
hx-get="{{ path('app_login') }}"
hx-target="#myep"
hx-swap="outerHTML"
class="button bg-button bg-button--secondary">
zum Login
</button>
</div>
{{ form_rest(form) }}
{{ form_end(form) }}
{% endblock %} {% endblock %}
+24 -23
View File
@@ -1,23 +1,24 @@
{% extends 'layout.html.twig' %} {{ form_start(form) }}
{{ form_row(form.email) }}
{% block content %} <div class="flex flex-col lg:flex-row space-y-2 lg:space-y-0 lg:space-x-2 mt-4">
<div class="p-8 max-w-screen-sm border border-gray-300 rounded-md mx-auto"> <button type="submit" class="button bg-button bg-button--secondary">
<h2 class="text-2xl font-semibold pb-4"> Passwort erneuern
Passwort zurücksetzen </button>
</h2> <button type="button"
{{ form_start(form) }} hx-get="{{ path('app_login') }}"
<div class="pb-4"> hx-target="#login-form"
{{ form_row(form.email) }} hx-select="#login-form"
</div> hx-swap="outerHTML"
<button type="submit" class="btn"> class="button bg-button">
Absenden zum Login
</button> </button>
<div class="pt-4"> <button type="button"
<a href="{{ path('app_login') }}" class="underline"> hx-get="{{ path('app_registration') }}"
zurück hx-target="#myep"
</a> hx-swap="outerHTML"
</div> class="button bg-button">
{{ form_rest(form) }} registrieren
{{ form_end(form) }} </button>
</div> </div>
{% endblock %} {{ form_rest(form) }}
{{ form_end(form) }}
+92 -56
View File
@@ -1,61 +1,97 @@
{% extends 'layout.html.twig' %} {% extends 'layout.html.twig' %}
{% block content %} {% block content %}
<div class="p-8 max-w-screen-sm border border-gray-300 rounded-md mx-auto"> <h1 class="mb-4">
{% if error %} Login MyE&amp;P
<div class="flex items-center space-x-1 bg-red-500 text-white p-2 rounded-md mb-6"> </h1>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"> <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z" /> <div id="login-form">
</svg> {% if error %}
<span class="flex-1 text-sm">{{ error.messageKey|trans(error.messageData, 'security') }}</span> <div class="flex items-center space-x-1 bg-red-500 text-white p-2 rounded-md mb-6">
</div> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
{% endif %} <path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z" />
<h2 class="text-2xl font-semibold pb-4"> </svg>
Login <span class="flex-1 text-sm">{{ error.messageKey|trans(error.messageData, 'security') }}</span>
</h2> </div>
<form action="{{ path('app_login') }}" method="post"> {% endif %}
<div class="mb-6"> <form action="{{ path('app_login') }}" method="post">
<label for="username" class="block leading-6 text-gray-900"> <div class="mb-4">
E-Mail: <label for="username" class="block mb-1">
</label> E-Mail:
<input type="email" </label>
id="username" <input type="email"
name="_username" id="username"
value="{{ last_username }}" name="_username"
class="mt-2 block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary sm:text-sm sm:leading-6" value="{{ last_username }}"
required class="form-field"
autofocus required
autocomplete="username"> autofocus
</div> autocomplete="username">
<div class="mb-6"> </div>
<label for="password" class="block leading-6 text-gray-900"> <div class="mb-4">
Passwort: <label for="password" class="block mb-1 text-gray-900">
</label> Passwort:
<input type="password" </label>
id="password" <input type="password"
name="_password" id="password"
class="mt-2 block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary sm:text-sm sm:leading-6" name="_password"
required class="form-field"
autocomplete="current-password"> required
</div> autocomplete="current-password">
<div class="flex items-start mb-6"> </div>
<label for="rememberme" class="flex h-6 items-center"> <div class="relative flex items-start">
<input type="checkbox" id="rememberme" name="_remember_me" class="h-4 w-4 rounded text-primary"> <div class="flex h-6 items-center">
<span class="block ml-3 leading-6">angemeldet bleiben</span> <input type="checkbox" id="rememberme" name="_remember_me" class="form-checkbox">
</label> </div>
</div> <div class="ml-1 leading-6">
<button type="submit" class="btn w-full"> <label for="rememberme">
Login angemeldet bleiben
</button> </label>
<div class="flex items-center space-x-2 pt-4"> </div>
<a href="{{ path('app_reset_password') }}" class="underline"> </div>
Passwort vergessen? <div class="flex flex-col lg:flex-row space-y-2 lg:space-y-0 lg:space-x-2 mt-4">
</a> <button type="submit" class="button bg-button">
<a href="{{ path('app_registration') }}" class="underline"> Login
Registrierung </button>
</a> <button type="button"
</div> hx-get="{{ path('app_reset_password') }}"
<input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}"> hx-target="#login-form"
</form> class="button bg-button bg-button--secondary">
Passwort vergessen?
</button>
<button type="button"
hx-get="{{ path('app_registration') }}"
hx-target="#myep"
hx-swap="outerHTML"
class="button bg-button bg-button--secondary">
registrieren
</button>
</div>
<input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
</form>
</div>
<div>
<h3 class="mb-2">
Neu!
</h3>
<p class="mb-4">
Melde dich jetzt bei MyEP an und du kannst jederzeit auf deine aktuellen Buchungen zugreifen und
diese abändern. Egal ob du einen Kurs oder eine Skipasserweiterung hinzufügen/entfernen möchtest,
oder das vegetarische Essen auswählen willst. Im neuen Portal ist das nun kostenlos bis 7 Tage vor
Reisebeginn möglich!
</p>
<h3 class="mb-2">
Noch keine Zugangsdaten?
</h3>
<p class="mb-2">
Dann gib deine E-Mail ein, mit der Du gebucht hast und klicke auf "Passwort vergessen"! Und wir
senden dir ein E-Mail mit einem Passwort-Link!
</p>
<p>
Ein LogIn ist nur möglich wenn Eure Daten schon durch eine Buchung oder Anfrage bei uns
angelegt wurden. Wenn Ihr auch Kunde werden möchtet, dann schickt uns Eure Interessen über unser
<a href="https://www.ep-reisen.de/skireisen/unternehmen/kontakt/kontaktformular/" title="Kontaktformular">Kontaktformular</a>.
</p>
</div>
</div> </div>
{% endblock %} {% endblock %}