[TASK] refactor code and add base css components

This commit is contained in:
Marie Birner
2023-04-07 09:44:08 +02:00
parent 0ee9967d3a
commit 1490b191af
14 changed files with 165 additions and 133 deletions

View File

@ -17,8 +17,7 @@
{% endif %}
{% endif %}
<h1 class="text-center text-3xl uppercase tracking-wide font-bold text-primary-900 sm:col-span-2 lg:col-span-3">
Ausfahrten</h1>
<h1 class="h1 sm:col-span-2 lg:col-span-3">Ausfahrten</h1>
{% for day in days %}
<div class="bg-white p-3 rounded-md flex justify-between flex-col">
@ -34,7 +33,7 @@
<strong class="text-primary-900">{{ planned_event.planned_starting_time }} Uhr</strong> <small
class="text-gray-600">({{ planned_event.name }})</small><br />
<a href="#" data-sidebar="true" data-trigger="detailEvent{{ planned_event.id }}"
class="inline-block text-primary-600 hover:text-primary-900 underline mr-3">Details</a>
class="inline-block mr-3 link-primary">Details</a>
</div>
<div class="text-right grid gap-2">
{% set_global cur_user_participates = false %}
@ -44,13 +43,11 @@
{% endif %}
{% endfor %}
{% if cur_user_participates %}
<a href="/remove/{{ planned_event.trip_details_id }}"
class="w-28 rounded-md bg-[#f43f5e] px-3 py-2 text-sm font-semibold text-white hover:bg-[#ff0000] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[#ff0000] cursor-pointer text-center">Abmelden</a>
<a href="/remove/{{ planned_event.trip_details_id }}" class="btn btn-attention btn-fw">Abmelden</a>
{% endif %}
{% if planned_event.max_people > planned_event.rower | length %}
{% if cur_user_participates == false %}
<a href="/join/{{ planned_event.trip_details_id }}"
class="w-28 rounded-md bg-primary-600 px-3 py-2 text-sm font-semibold text-white hover:bg-primary-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-600 cursor-pointer text-center">Mitrudern</a>
<a href="/join/{{ planned_event.trip_details_id }}" class="btn btn-primary btn-fw">Mitrudern</a>
{% endif %}
{% endif %}
@ -63,21 +60,13 @@
{% endif %}
{% endfor %}
{% if cur_user_participates %}
<a href="/cox/remove/{{ planned_event.id }}"
class="w-28 block rounded-md bg-[#f43f5e] px-3 py-2 text-sm font-semibold text-white hover:bg-[#ff0000] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[#ff0000] cursor-pointer text-center">
<svg width="16" height="16" fill="currentColor" class="inline-block mr-1 h-3 w-3" viewBox="0 0 16 16">
<path
d="M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.777.416L8 13.101l-5.223 2.815A.5.5 0 0 1 2 15.5V2zm2-1a1 1 0 0 0-1 1v12.566l4.723-2.482a.5.5 0 0 1 .554 0L13 14.566V2a1 1 0 0 0-1-1H4z" />
</svg>
<a href="/cox/remove/{{ planned_event.id }}" class="block btn btn-attention btn-fw">
{% include "includes/cox-icon" %}
Abmelden
</a>
{% else %}
<a href="/cox/join/{{ planned_event.id }}"
class="w-28 block rounded-md bg-primary-900 px-3 py-2 text-sm font-semibold text-white hover:bg-primary-950 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-950 cursor-pointer text-center">
<svg width="16" height="16" fill="currentColor" class="inline-block mr-1 h-3 w-3" viewBox="0 0 16 16">
<path
d="M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.777.416L8 13.101l-5.223 2.815A.5.5 0 0 1 2 15.5V2zm2-1a1 1 0 0 0-1 1v12.566l4.723-2.482a.5.5 0 0 1 .554 0L13 14.566V2a1 1 0 0 0-1-1H4z" />
</svg>
<a href="/cox/join/{{ planned_event.id }}" class="block btn btn-dark btn-fw">
{% include "includes/cox-icon" %}
Steuern
</a>
{% endif %}
@ -138,13 +127,8 @@
{% if loggedin_user.is_admin %}
<a href="/admin/planned-event/{{ planned_event.id }}/delete"
class="inline-block rounded-md bg-[#ff0000] px-3 py-2 text-sm font-semibold text-white hover:bg-[#ff0000] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[#ff0000] cursor-pointer">
<svg width="16" height="16" fill="currentColor" class="inline h-4 w-4" viewBox="0 0 16 16">
<path
d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z" />
<path fill-rule="evenodd"
d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z" />
</svg>
class="inline-block btn btn-alert">
{% include "includes/delete-icon" %}
Termin löschen
</a>
{% endif %}
@ -166,7 +150,7 @@
<strong class="text-primary-900">{{ trip.planned_starting_time }} Uhr</strong> <small
class="text-gray-600">({{ trip.cox_name }})</small><br />
<a href="#" data-sidebar="true" data-trigger="detailTrip{{ trip.trip_details_id }}"
class="inline-block text-primary-600 hover:text-primary-900 underline mr-3">Details</a>
class="inline-block link-primary mr-3">Details</a>
</div>
<div>
{% set_global cur_user_participates = false %}
@ -227,7 +211,7 @@
<div>
{% if loggedin_user.is_admin %}
<a href="#" data-sidebar="true" data-trigger="plannedTrip{{ loop.index }}"
class="inline-block text-primary-900 hover:text-primary-950 underline mr-3">Event hinzufügen</a>
class="inline-block link-dark mr-3">Event hinzufügen</a>
<!-- START Sidebar plannedTrip -->
<div class="sidebar slide-in from-right" id="plannedTrip{{ loop.index }}" aria-modal="false">
@ -263,7 +247,7 @@
{% if loggedin_user.is_cox%}
<a href="#" data-sidebar="true" data-trigger="trip{{ loop.index }}"
class="inline-block text-primary-600 hover:text-primary-900 underline">Ausfahrt hinzufügen</a>
class="inline-block link-primary">Ausfahrt hinzufügen</a>
<div class="sidebar slide-in from-right" id="trip{{ loop.index }}" aria-modal="false">
<div class="bg-primary-900 text-white px-2 py-3 flex justify-between sidebar-header">