[TASK] styling user / cox / admin

This commit is contained in:
Marie Birner 2023-04-06 13:47:52 +02:00
parent abb82ceb5a
commit 039bf9d922
2 changed files with 32 additions and 22 deletions

View File

@ -84,4 +84,10 @@
z-index: 1; z-index: 1;
} }
} }
.deregister-btn {
+ .register-btn {
display: none;
}
}
/* purgecss end ignore */ /* purgecss end ignore */

View File

@ -18,8 +18,8 @@
<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="text-center text-3xl uppercase tracking-wide font-bold text-primary-900 sm:col-span-2 lg:col-span-3">Ausfahrten</h1>
{% for day in days %} {% for day in days %}
<div class="bg-white p-3 rounded-md"> <div class="bg-white p-3 rounded-md flex justify-between flex-col">
<h2 class="mb-2 text-md font-bold uppercase tracking-wide">{{ day.day| date(format="%d.%m.%Y") }}</h2> <h2 class="text-md font-bold uppercase tracking-wide">{{ day.day| date(format="%d.%m.%Y") }}</h2>
{% for planned_event in day.planned_events %} {% for planned_event in day.planned_events %}
<h3>Planned event '{{ planned_event.name }}'</h3> <h3>Planned event '{{ planned_event.name }}'</h3>
@ -32,7 +32,7 @@
{% for cox in planned_event.cox %} {% for cox in planned_event.cox %}
{{ cox }} {{ cox }}
{% if cox == loggedin_user.name %} {% if cox == loggedin_user.name %}
<a href="/cox/remove/{{ planned_event.id }}" class="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">ABMELDEN</a> <a href="/cox/remove/{{ planned_event.id }}" class="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">Abmelden</a>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
<br /> <br />
@ -41,12 +41,12 @@
{% for rower in planned_event.rower%} {% for rower in planned_event.rower%}
{{ rower.name }} (angemeldet seit {{ rower.registered_at }}) {{ rower.name }} (angemeldet seit {{ rower.registered_at }})
{% if rower.name == loggedin_user.name %} {% if rower.name == loggedin_user.name %}
<a href="/remove/{{ planned_event.trip_details_id }}" class="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">ABMELDEN</a> <a href="/remove/{{ planned_event.trip_details_id }}" class="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">Abmelden</a>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
{% if planned_event.max_people > planned_event.rower | length %} {% if planned_event.max_people > planned_event.rower | length %}
<a href="/join/{{ planned_event.trip_details_id }}" class="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">MITRUDERN</a> <a href="/join/{{ planned_event.trip_details_id }}" class="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">Mitrudern</a>
{% endif %} {% endif %}
@ -62,19 +62,23 @@
{% if day.trips | length > 0 %} {% if day.trips | length > 0 %}
<div class="grid grid-cols-1 gap-3 divide-y mb-3"> <div class="grid grid-cols-1 gap-3 divide-y mb-3">
{% for trip in day.trips %} {% for trip in day.trips %}
<div> <div class="pt-2">
<div class="flex justify-between"> <div class="flex justify-between items-center">
<div><strong class="text-primary-900">{{ trip.planned_starting_time }} Uhr</strong> <small class="text-gray-600">({{ trip.cox_name }})</small></div> <div>
<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> <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>
</div>
<div>
{% for rower in trip.rower %}
{% if rower.name == loggedin_user.name %}
<a href="/remove/{{ trip.trip_details_id }}" class="deregister-btn inline-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">Abmelden</a>
{% endif %}
{% endfor %}
{% if trip.max_people > trip.rower | length and trip.cox_id != loggedin_user.id %}
<a href="/join/{{ trip.trip_details_id }}" class="register-btn inline-block 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">Mitrudern</a>
{% endif %}
</div>
</div> </div>
{% if trip.max_people > trip.rower | length and trip.cox_id != loggedin_user.id %}
<a href="/join/{{ trip.trip_details_id }}" class="inline-block mt-1 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">MITRUDERN</a>
{% endif %}
{% for rower in trip.rower %}
{% if rower.name == loggedin_user.name %}
<a href="/remove/{{ trip.trip_details_id }}" class="inline-block mt-1 rounded-md bg-[#f43f5e] 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">ABMELDEN</a>
{% endif %}
{% endfor %}
</div> </div>
<div class="sidebar slide-in from-right" id="detailTrip{{ trip.trip_details_id }}" aria-modal="false"> <div class="sidebar slide-in from-right" id="detailTrip{{ trip.trip_details_id }}" aria-modal="false">
<div class="bg-primary-900 text-white px-2 py-3 flex justify-between sidebar-header"> <div class="bg-primary-900 text-white px-2 py-3 flex justify-between sidebar-header">
@ -91,7 +95,7 @@
</div> </div>
</div> </div>
<div class="px-2 pt-2" style="margin-top: 63px; margin-bottom: 157px"> <div class="px-2 pt-2" style="margin-top: 63px; margin-bottom: 157px">
<div class="text-primay-900 bg-primary-100 text-center p-1 mt-1">{{ trip.max_people }} Ruderer können sich für diese Ausfahrt anmelden</div> <div class="text-primay-900 bg-primary-100 text-center p-1 mt-1">{{ trip.max_people }} Ruderer können teilnehmen</div>
{% if trip.rower | length > 0 %} {% if trip.rower | length > 0 %}
<div class="mt-2"> <div class="mt-2">
@ -108,8 +112,9 @@
</div> </div>
{% endif %} {% endif %}
{% if loggedin_user.is_admin %} <div>
<a href="#" data-sidebar="true" data-trigger="plannedTrip{{ loop.index }}" class="inline-block text-primary-600 hover:text-primary-900 underline mr-3">Event hinzufügen</a> {% 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>
<div class="sidebar slide-in from-right" id="plannedTrip{{ loop.index }}" aria-modal="false"> <div class="sidebar slide-in from-right" id="plannedTrip{{ loop.index }}" aria-modal="false">
<div class="bg-primary-900 text-white px-2 py-3 flex justify-between sidebar-header"> <div class="bg-primary-900 text-white px-2 py-3 flex justify-between sidebar-header">
@ -166,8 +171,7 @@
</div> </div>
<div class="sidebar-overlay" data-trigger="trip{{ loop.index }}"></div> <div class="sidebar-overlay" data-trigger="trip{{ loop.index }}"></div>
{% endif %} {% endif %}
</div>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>