Add missing styles for snowreport table

This commit is contained in:
Björn Fromme
2022-05-05 12:53:23 +02:00
parent d2a0a3eaf8
commit 21e219ed1f
@@ -6,34 +6,67 @@
<f:layout name="Default"/>
<f:section name="Main">
<div class="table-responsive">
<table class="table table-striped table-condensed">
<ep:container data="{data}">
<div class="w-full max-w-full overflow-x-scroll md:overflow-x-auto">
<table class="w-full mb-4 bg-gray-200">
<thead>
<tr>
<th>Gebiet</th>
<th>Berg/Tal</th>
<th>Qualität</th>
<th>Geöffnete Lifte</th>
<th>Letzter Schneefall</th>
<th>Letzte Akt.</th>
<th class="border-r border-overlay-white-50 px-2 py-1 md:p-2 text-sm md:text-base">
Gebiet
</th>
<th class="border-r border-overlay-white-50 px-2 py-1 md:p-2 text-sm md:text-base">
Berg/Tal
</th>
<th class="border-r border-overlay-white-50 px-2 py-1 md:p-2 text-sm md:text-base">
Qualität
</th>
<th class="border-r border-overlay-white-50 px-2 py-1 md:p-2 text-sm md:text-base">
Geöffnete Lifte
</th>
<th class="border-r border-overlay-white-50 px-2 py-1 md:p-2 text-sm md:text-base">
Letzter Schneefall
</th>
<th class="border-r border-overlay-white-50 px-2 py-1 md:p-2 text-sm md:text-base">
Letzte Akt.
</th>
</tr>
</thead>
<tbody>
<f:for each="{list}" as="snowreport">
<tr>
<td>
<f:link.typolink parameter="{snowreport.regionDetailPage}" title="{snowreport.regionName}">{snowreport.regionName}</f:link.typolink><br>
<f:link.typolink parameter="{snowreport.countryDetailPage}" title="{snowreport.countryName}">{snowreport.countryName}</f:link.typolink>
<tr class="odd:bg-gray-50 hover:bg-gray-100 odd:hover:bg-gray-100">
<td class="border-r border-gray-200 px-2 py-1 md:p-2">
<f:link.typolink parameter="{snowreport.regionDetailPage}"
title="{snowreport.regionName}"
class="text-ep-primary">
{snowreport.regionName}
</f:link.typolink>
<br>
<f:link.typolink parameter="{snowreport.countryDetailPage}"
title="{snowreport.countryName}"
class="text-ep-primary">
{snowreport.countryName}
</f:link.typolink>
</td>
<f:if condition="{snowreport.inSeason}">
<f:then>
<td>{snowreport.snow_level_mountain -> v:or(alternative: '-')}/{snowreport.snow_level_valley -> v:or(alternative: '-')} cm</td>
<td>{snowreport.snow_quality}</td>
<td>
<td class="border-r border-gray-200 px-2 py-1 md:p-2 text-center">
{snowreport.snow_level_mountain -> v:or(alternative: '-')}/{snowreport.snow_level_valley -> v:or(alternative: '-')} cm
</td>
<td class="border-r border-gray-200 px-2 py-1 md:p-2 text-center">
{snowreport.snow_quality}
</td>
<td class="border-r border-gray-200 px-2 py-1 md:p-2 text-center">
<f:if condition="{snowreport.lifts_opened} > 0">
<f:then>{snowreport.lifts_opened}/{snowreport.lifts_total}</f:then>
<f:else>k. A.</f:else>
</f:if>
</td>
<td>{f:if(condition: snowreport.last_snowfall, then: '{snowreport.last_snowfall -> f:format.date(format: \'%d.%m.%Y\')}', else: '-')}</td>
<td>{snowreport.last_update -> f:format.date(format: '%d.%m.%Y')}</td>
<td class="border-r border-gray-200 px-2 py-1 md:p-2 text-center">
{f:if(condition: snowreport.last_snowfall, then: '{snowreport.last_snowfall -> f:format.date(format: \'%d.%m.%Y\')}', else: '-')}
</td>
<td class="border-r border-gray-200 px-2 py-1 md:p-2 text-center">
{snowreport.last_update -> f:format.date(format: '%d.%m.%Y')}
</td>
</f:then>
<f:else>
<td colspan="5" style="text-align: center; vertical-align: middle">Saison vom {snowreport.seasonStart -> f:format.date(format: '%d.%m.%Y')} bis {snowreport.seasonEnd -> f:format.date(format: '%d.%m.%Y')}</td>
@@ -41,8 +74,10 @@
</f:if>
</tr>
</f:for>
</tbody>
</table>
</div>
</ep:container>
</f:section>
</html>