Task: Improve layout

This commit is contained in:
Björn Fromme
2023-10-21 16:41:57 +02:00
parent bf2e5600d0
commit 847af5341c
14 changed files with 278 additions and 174 deletions
+65 -41
View File
@@ -1,52 +1,76 @@
<div class="grid grid-cols-2 gap-x-4 gap-y-3">
<div class="font-bold text-xl">
Jobprofil
<dl class="divide-y divide-gray-100">
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Jobprofil
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.jobProfile.name }}
</dd>
</div>
<div class="font-bold text-xl">
{{ assignment.jobProfile.name }}
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Destination
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.destination.product }}, {{ assignment.destination.hotel }}
</dd>
</div>
<div>
Destination
</div>
<div>
{{ assignment.destination.product }}
<br>
{{ assignment.destination.hotel }}
</div>
<div>
Einsatztermin
</div>
<div>
{{ assignment.effectivePeriod.start|date('d.m.Y') }} - {{ assignment.effectivePeriod.end|date('d.m.Y') }}
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Einsatztermin
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.effectivePeriod.start|date('d.m.Y') }} - {{ assignment.effectivePeriod.end|date('d.m.Y') }}
</dd>
</div>
{% if assignment.pickup and assignment.pickupDate %}
<div>
Busabfahrt
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Busabfahrt
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.pickupDate|date('d.m.Y') }}
</dd>
</div>
<div>
{{ assignment.pickupDate|date('d.m.Y') }}
</div>
<div>
Busbegleitung
</div>
<div>
{{ assignment.pickup|bpn_pickup_label }}
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Busbegleitung
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.pickup|bpn_pickup_label }}
</dd>
</div>
{% endif %}
<div>
Du bekommst
</div>
<div>
{{ assignment.benefits|nl2list }}
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Du bekommst
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.benefits|nl2list }}
</dd>
</div>
{% if assignment.fees|length %}
<div>
Honorar
</div>
<div>
{% for fee in assignment.fees %}
{{ fee.name }} {{ fee.value|format_money }}
{% endfor %}
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Honorar
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{% for fee in assignment.fees %}
{{ fee.name }} {{ fee.value|format_money }}
{% endfor %}
</dd>
</div>
{% endif %}
</div>
{% if additional is defined %}
{% for item in additional %}
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
{{ item.type }}
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ item.description|raw }}
</dd>
</div>
{% endfor %}
{% endif %}
</dl>
@@ -1,49 +1,62 @@
<div class="grid lg:grid-cols-2 gap-x-8 gap-y-4">
<div class="lg:col-span-2 font-bold text-xl">
Jobprofil {{ assignment.jobProfile.name }}
</div>
<div class="grid grid-cols-2 gap-x-4 gap-y-3">
<div class="font-bold">
Destination
<dl class="divide-y divide-gray-100">
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Jobprofil
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.jobProfile.name }}
</dd>
</div>
<div>
{{ assignment.destination.product }}
<br>
{{ assignment.destination.hotel }}
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Destination
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.destination.product }}, {{ assignment.destination.hotel }}
</dd>
</div>
<div class="font-bold">
Einsatztermin
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Einsatztermin
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.effectivePeriod.start|date('d.m.Y') }} - {{ assignment.effectivePeriod.end|date('d.m.Y') }}
</dd>
</div>
<div>
{{ assignment.effectivePeriod.start|date('d.m.Y') }} - {{ assignment.effectivePeriod.end|date('d.m.Y') }}
</div>
</div>
<div class="grid grid-cols-2 gap-x-4 gap-y-3">
</dl>
<dl class="divide-y divide-gray-100">
{% if assignment.pickup and assignment.pickupDate %}
<div class="font-bold">
Busabfahrt
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Busabfahrt
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.pickupDate|date('d.m.Y') }}
</dd>
</div>
<div>
{{ assignment.pickupDate|date('d.m.Y') }}
</div>
<div class="font-bold">
Busbegleitung
</div>
<div>
{{ assignment.pickup|bpn_pickup_label }}
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Busbegleitung
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ assignment.pickup|bpn_pickup_label }}
</dd>
</div>
{% endif %}
<div class="font-bold">
Honorar
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
Honorar
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{% if assignment.fees|length %}
{% for fee in assignment.fees %}
{{ fee.name }} {{ fee.value|format_money }}
{% endfor %}
{% else %}
-
{% endif %}
</dd>
</div>
<div>
{% if assignment.fees|length %}
{% for fee in assignment.fees %}
{{ fee.name }} {{ fee.value|format_money }}
{% endfor %}
{% else %}
-
{% endif %}
</div>
</div>
</dl>
</div>
@@ -1,5 +1,5 @@
<ul class="pb-8 divide-y divide-gray-200">
{% if assignment.pickup and assignment.effectivePickupDate %}
{% if assignment.pickup and assignment.effectivePickupDate %}
<li class="py-2">
<div class="flex items-center justify-between">
<span class="flex-1">Busbegleitung {{ assignment.pickup|bpn_pickup_label }} am {{ assignment.effectivePickupDate|date('d.m.Y') }}</span>
@@ -0,0 +1,12 @@
<dl class="divide-y divide-gray-100">
{% for item in items %}
<div class="py-6 first:pt-0 last:pb-0 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="text-sm font-bold leading-6 text-gray-900">
{{ item.type }}
</dt>
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
{{ item.description }}
</dd>
</div>
{% endfor %}
</dl>
+4
View File
@@ -0,0 +1,4 @@
<div class="flex items-start space-x-4 bg-red-600 text-white p-4 rounded-md w-full">
{{ icon('alert', 'w-6 h-6 shrink-0') }}
<span>{{ message }}</span>
</div>
+4
View File
@@ -0,0 +1,4 @@
<div class="flex items-start space-x-4 bg-primary text-white p-4 rounded-md w-full">
{{ icon('info', 'w-6 h-6 shrink-0') }}
<span>{{ message }}</span>
</div>