51 lines
2.4 KiB
HTML
51 lines
2.4 KiB
HTML
{% load i18n static %}
|
|
<div class="slide-canvas slide-table" {% if slide.background_color %}style="background:{{ slide.background_color }}"{% endif %}>
|
|
<div class="slide-table__header">
|
|
<h1 class="slide-table__title">{{ slide.title }}</h1>
|
|
{% if slide.subtitle %}
|
|
<p class="slide-table__subtitle">{{ slide.subtitle }}</p>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="slide-table__container">
|
|
<table class="slide-table__element">
|
|
<thead>
|
|
<tr>
|
|
{% for header in slide.content.headers %}
|
|
<th>{{ header }}</th>
|
|
{% endfor %}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for row in slide.content.rows %}
|
|
<tr class="{% if row.0.row_bg %}rating-row--{{ row.0.row_bg }}{% endif %}">
|
|
{% for cell in row %}
|
|
<td {% if cell.font_weight %}style="font-weight:{{ cell.font_weight }}"{% endif %}>
|
|
{% if cell.badge %}
|
|
<span class="slide-badge slide-badge--{{ cell.badge.variant|default:'navy' }}">{{ cell.badge.text }}</span>
|
|
{% elif cell.rating_bar %}
|
|
<div style="display:flex;align-items:center;gap:8px;">
|
|
<span style="font-weight:700;">{{ cell.rating_bar.value }}</span>
|
|
<div style="flex:1;max-width:100px;height:6px;background:rgba(255,255,255,0.25);border-radius:3px;overflow:hidden;">
|
|
<div style="height:100%;width:{{ cell.rating_bar.pct }}%;background:#fff;border-radius:3px;"></div>
|
|
</div>
|
|
</div>
|
|
{% elif cell.progress %}
|
|
<div class="slide-progress-bar" style="width:120px;">
|
|
<div class="slide-progress-bar__fill" style="width:{{ cell.progress }}%"></div>
|
|
</div>
|
|
<span style="font-size:12px;color:var(--px-muted);margin-left:8px;">{{ cell.progress }}%</span>
|
|
{% else %}
|
|
{{ cell.text|default:cell }}
|
|
{% endif %}
|
|
</td>
|
|
{% endfor %}
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<img src="{% static 'img/HH_R_H_Logo.png' %}" alt="" class="slide-logo--footer">
|
|
</div>
|