41 lines
1.9 KiB
Twig
41 lines
1.9 KiB
Twig
<div class="tile production-period-tile">
|
|
<div class="tile-title">
|
|
<i class="fas fa-industry" style="color: #6c757d; margin-right: 8px;"></i>
|
|
Produktionszeitraum
|
|
</div>
|
|
<div class="production-timeline" style="margin-top: 8px;">
|
|
{% if tile.productionBegin or tile.productionEnd %}
|
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
{% if tile.productionBegin %}
|
|
<div style="text-align: center;">
|
|
<div style="font-weight: bold; font-size: 16px; color: #28a745;">{{ tile.productionBegin.year }}</div>
|
|
<small style="color: #666;">Start</small>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if tile.productionBegin and tile.productionEnd %}
|
|
<div style="flex: 1; height: 2px; background: linear-gradient(to right, #28a745, #dc3545); margin: 0 4px;"></div>
|
|
{% elseif tile.productionBegin %}
|
|
<div style="flex: 1; height: 2px; background: linear-gradient(to right, #28a745, #007acc); margin: 0 4px;"></div>
|
|
{% endif %}
|
|
|
|
{% if tile.productionEnd %}
|
|
<div style="text-align: center;">
|
|
<div style="font-weight: bold; font-size: 16px; color: #dc3545;">{{ tile.productionEnd.year }}</div>
|
|
<small style="color: #666;">Ende</small>
|
|
</div>
|
|
{% elseif tile.productionBegin %}
|
|
<div style="text-align: center;">
|
|
<div style="font-weight: bold; font-size: 16px; color: #007acc;">laufend</div>
|
|
<small style="color: #666;">aktuell</small>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% else %}
|
|
<div style="text-align: center; color: #666; font-style: italic;">
|
|
Zeitraum unbekannt
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
<small style="color: #666;">Verfügbarkeit</small>
|
|
</div> |