serversdown/terra-view
1
0
Fork 0
Code Issues 13 Pull Requests Actions Packages Projects Releases 2 Wiki Activity

fix: update session calendar layout and improve session labels for clarity

Browse Source
This commit is contained in:
serversdown
2026-03-28 01:44:59 +00:00
parent 27eeb0fae6
commit e7bd09418b
2 changed files with 14 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
templates/partials/projects/sessions_calendar.html
View File

@@ -1,5 +1,5 @@
<!-- Monthly Sessions Calendar — Gantt Style --> <!-- Monthly Sessions Calendar — Gantt Style -->
<div class="bg-white dark:bg-slate-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden"> <div class="sessions-cal-wrap bg-white dark:bg-slate-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden">
<!-- Month navigation --> <!-- Month navigation -->
<div class="px-5 py-3 border-b border-gray-200 dark:border-gray-700 flex items-center justify-between"> <div class="px-5 py-3 border-b border-gray-200 dark:border-gray-700 flex items-center justify-between">
@@ -79,40 +79,29 @@
{% if day.sessions %} {% if day.sessions %}
<div class="space-y-2"> <div class="space-y-2">
{% for s in day.sessions %} {% for s in day.sessions %}
{% set tooltip %}{{ s.label }} · Device {{ s.dev_start_label }}–{{ s.dev_end_label }}{% if s.eff_start_label %} · Window {{ s.eff_start_label }}–{{ s.eff_end_label }}{% endif %}{% endset %}
<a href="/api/projects/{{ project_id }}/sessions/{{ s.session_id }}/detail" <a href="/api/projects/{{ project_id }}/sessions/{{ s.session_id }}/detail" class="block">
class="block group"
title="{{ tooltip }}">
<!-- 24-hour timeline bar --> <!-- 24-hour timeline bar -->
<div class="relative w-full rounded-sm overflow-hidden" style="height:11px; background:rgba(128,128,128,0.08);"> <div class="relative overflow-hidden -mx-1.5" style="height:11px; background:rgba(128,128,128,0.08);">
<!-- Hour guide ticks at 6h, 12h, 18h -->
<div class="absolute top-0 bottom-0 w-px" style="left:25%; background:rgba(128,128,128,0.18)"></div> <div class="absolute top-0 bottom-0 w-px" style="left:25%; background:rgba(128,128,128,0.18)"></div>
<div class="absolute top-0 bottom-0 w-px" style="left:50%; background:rgba(128,128,128,0.28)"></div> <div class="absolute top-0 bottom-0 w-px" style="left:50%; background:rgba(128,128,128,0.28)"></div>
<div class="absolute top-0 bottom-0 w-px" style="left:75%; background:rgba(128,128,128,0.18)"></div> <div class="absolute top-0 bottom-0 w-px" style="left:75%; background:rgba(128,128,128,0.18)"></div>
<div class="absolute top-0 bottom-0"
<!-- Device on/off bar (dim) --> style="left:{{ s.dev_start_pct }}%; width:{{ s.dev_width_pct }}%; background-color:{{ s.color }}; opacity:0.28;"></div>
<div class="absolute top-0 bottom-0 rounded-sm"
style="left:{{ s.dev_start_pct }}%; width:{{ s.dev_width_pct }}%; background-color:{{ s.color }}; opacity:0.28;">
</div>
<!-- Effective window (solid, slightly inset) -->
{% if s.eff_start_pct is not none %} {% if s.eff_start_pct is not none %}
<div class="absolute rounded-sm group-hover:brightness-110 transition-all" <div class="absolute"
style="left:{{ s.eff_start_pct }}%; width:{{ s.eff_width_pct }}%; top:1.5px; bottom:1.5px; background-color:{{ s.color }};"> style="left:{{ s.eff_start_pct }}%; width:{{ s.eff_width_pct }}%; top:1.5px; bottom:1.5px; background-color:{{ s.color }};"></div>
</div>
{% endif %} {% endif %}
</div> </div>
<!-- Location micro-label --> <!-- Label -->
<div class="truncate mt-0.5 group-hover:opacity-70 transition-opacity" <div class="truncate mt-0.5" style="color:{{ s.color }}; font-size:0.58rem; line-height:1.3;">
style="color:{{ s.color }}; font-size:0.58rem; line-height:1.3;"> {{ s.location_name }} · {{ day.date.strftime('%-m/%-d') }} · {% if s.period_type %}{{ 'Night' if 'night' in s.period_type else 'Day' }}{% else %}—{% endif %}
{{ s.location_name }}{% if s.period_type %} <span class="opacity-60">{{ '☀' if 'day' in s.period_type else '☾' }}</span>{% endif %}
</div> </div>
</a> </a>
{% endfor %} {% endfor %}
</div> </div>
{% endif %} {% endif %}
@@ -132,3 +121,4 @@
</div> </div>
</div> </div>

1
templates/projects/detail.html
View File

@@ -1842,5 +1842,6 @@ document.addEventListener('DOMContentLoaded', function() {
switchTab(hash); switchTab(hash);
} }
}); });
</script> </script>
{% endblock %} {% endblock %}