feat: improve layout of contacts page
This commit is contained in:
@@ -2,37 +2,32 @@
|
||||
|
||||
{% block title %}Kontakt{% endblock %}
|
||||
|
||||
{% macro contacts(contacts, email) %}
|
||||
<div class="pb-8">
|
||||
<div class="flex justify-center">
|
||||
<div class="flex flex-wrap items-center">
|
||||
{% for contact in contacts %}
|
||||
<div class="flex flex-col items-center space-y-2 px-8 py-4">
|
||||
{% if contact.photo %}
|
||||
<img src="{{ asset(contact.photo.filename | imagine_filter('profile')) }}"
|
||||
class="w-32 h-auto border-2 border-primary rounded-full"
|
||||
alt="{{ contact.name }}">
|
||||
{% endif %}
|
||||
<div class="font-bold">
|
||||
{{ contact.name }}
|
||||
</div>
|
||||
{% if contact.destination %}
|
||||
<div>
|
||||
{{ contact.destination }}
|
||||
</div>
|
||||
<div>
|
||||
<a href="mailto:{{ contact.email }}" class="underline">{{ contact.email }}</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% if email %}
|
||||
<div class="text-center">
|
||||
<a href="mailto:{{ email }}" class="text-lg fobt-bold underline">{{ email }}</a>
|
||||
{% macro contact(contact) %}
|
||||
<div class="flex flex-col items-center space-y-2 px-8 py-4 w-48 md:w-64">
|
||||
{% if contact.photo %}
|
||||
<div class="relative group">
|
||||
<img src="{{ asset(contact.photo.filename | imagine_filter('contact')) }}"
|
||||
class="w-40 md:w-48 h-auto border-2 border-primary rounded-full"
|
||||
alt="{{ contact.name }}">
|
||||
<div class="absolute top-0 left-0 inset-0 rounded-full flex flex-col items-center justify-center space-y-2 bg-primary/80 text-white invisible group-hover:visible">
|
||||
{% if contact.email %}
|
||||
<a href="mailto:{{ contact.email }}" title="E-Mail">
|
||||
{{ icon('mail', 'w-8 h-8') }}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if contact.phone %}
|
||||
<a href="tel:{{ contact.phone }}" title="Telefon">
|
||||
{{ icon('phone', 'w-8 h-8') }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="text-center">
|
||||
<span class="font-bold">{{ contact.name }}</span>
|
||||
{% if contact.category %}<br>{{ ('label.contact.category.' ~ contact.category) | trans }}{% endif %}
|
||||
{% if contact.destination %}<br>{{ contact.destination }}{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
@@ -48,11 +43,30 @@
|
||||
<p class="pb-4">
|
||||
Ansonsten melde dich gerne beim Team Personalplanung!
|
||||
</p>
|
||||
{{ _self.contacts(generalContacts, '[email protected]') }}
|
||||
<div class="pb-8">
|
||||
<div class="flex justify-center flex-wrap items-start">
|
||||
{% for contact in contacts.hr %}
|
||||
{{ _self.contact(contact) }}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<p class="pb-4">
|
||||
Hast du Fragen zu deinem nächsten Einsatz in einer konkreten Destination? Dann melde dich gerne bei den
|
||||
zuständigen Büromitarbeitenden.
|
||||
zuständigen Büromitarbeitenden oder Hausleitungen.
|
||||
</p>
|
||||
{{ _self.contacts(destinationContacts) }}
|
||||
<div class="pb-4">
|
||||
<div class="flex justify-center flex-wrap items-start">
|
||||
{% for contact in contacts.management %}
|
||||
{{ _self.contact(contact) }}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="pb-8">
|
||||
<div class="flex justify-center flex-wrap items-start">
|
||||
{% for contact in contacts.house_management %}
|
||||
{{ _self.contact(contact) }}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user