cato447/tutor-tool
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

made things prettier

Browse Source
This commit is contained in:
cato447
2026-02-22 01:16:20 +01:00
parent 076293f80d
commit 7564da1148
10 changed files with 388 additions and 626 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
app/templates/index.html
View File

@@ -11,14 +11,14 @@
{% block body %}
{# ── Header ────────────────────────────────────────────────────── #}
<header class="bg-surface border-b border-border shadow-sm">
<div class="w-full px-6 py-3 flex items-center justify-between gap-4">
<header class="w-full px-4 pt-4 pb-2 md:px-6 md:py-3">
{# Left: user + logout #}
<div class="flex items-center gap-2 min-w-0">
<span class="text-gray-700 dark:text-gray-200 text-sm font-medium truncate">
{{ user_name }}
</span>
{# ── Desktop: single row ───────────────────────────── #}
<div class="hidden md:grid md:grid-cols-3 items-center gap-4">
{# Col 1: user + logout (left-aligned) #}
<div class="flex items-center gap-2">
<span class="text-gray-700 dark:text-gray-200 text-sm font-medium">{{ user_name }}</span>
<form method="POST" action="/logout">
<button type="submit"
class="text-xs text-white bg-red-600 px-2.5 py-1 rounded-md hover:bg-red-700 transition">
@@ -27,13 +27,13 @@
</form>
</div>
{# Center: course switcher #}
{# Col 2: course switcher (perfectly centered) #}
<div class="flex justify-center">
{{ course_switcher(courses, active_course_name, '/switch_course') }}
</div>
{# Right: social links + admin #}
<div class="flex items-center gap-3">
{# Col 3: social + admin (right-aligned) #}
<div class="flex items-center justify-end gap-3">
<a href="https://zulip.in.tum.de/#narrow/channel/3234-ITSec-Tutorium-Simon-Bu.C3.9Fmann" target="_blank">
<img src="{{ url_for('static', filename='zulip_icon.svg') }}" class="h-7 w-7">
</a>
@@ -46,7 +46,37 @@
</button>
</a>
</div>
</div>
{# ── Mobile: single row only ──────────────────────── #}
<div class="flex flex-col gap-3 md:hidden">
<div class="flex items-center justify-between">
<div class="flex items-center gap-2">
<span class="text-gray-700 dark:text-gray-200 text-sm font-medium">{{ user_name }}</span>
<form method="POST" action="/logout">
<button type="submit"
class="text-xs text-white bg-red-600 px-2.5 py-1 rounded-md hover:bg-red-700 transition">
Logout
</button>
</form>
</div>
<div class="flex items-center gap-3">
<a href="https://zulip.in.tum.de/#narrow/channel/3234-ITSec-Tutorium-Simon-Bu.C3.9Fmann" target="_blank">
<img src="{{ url_for('static', filename='zulip_icon.svg') }}" class="h-7 w-7">
</a>
<a href="https://discordapp.com/users/306086176585154560" target="_blank">
<img src="{{ url_for('static', filename='discord_icon.svg') }}" class="h-7 w-7">
</a>
<a href="{{ url_for('admin.admin') }}">
<button class="bg-primary hover:bg-blue-700 text-white text-sm px-3 py-1 rounded-md transition">
Admin
</button>
</a>
</div>
</div>
</div>
</header>
{# ── Main Content ──────────────────────────────────────────────── #}
@@ -60,6 +90,9 @@
</section>
{% endif %}
<div class="flex justify-center md:hidden">
{{ course_switcher(courses, active_course_name, '/switch_course') }}
</div>
{# ── Password Form ─────────────────────────────────────────── #}
<section class="flex justify-center">
@@ -110,7 +143,9 @@
<a href="/slides/{{ deck.course.folder }}/{{ deck.deck }}/{{ deck.index_file }}"
class="flex-grow block hover:text-primary transition">
<h3 class="text-lg font-semibold mb-1">{{ deck.name }}</h3>
<p class="text-muted text-sm">{{ deck.description }}</p>
<div class="prose prose-sm dark:prose-invert prose-p:text-muted prose-li:text-muted">
{{ deck.description | md }}
</div>
</a>
{% if deck.export_file %}

7
app/templates/macros/ui.html
View File

@@ -81,8 +81,11 @@
<button
type="button"
onclick="toggleCourseSwitcher()"
class="flex items-center gap-2 px-4 py-1.5 rounded-lg border border-border bg-surface
text-sm font-medium text-text hover:border-primary hover:text-primary transition whitespace-nowrap">
class="flex items-center gap-2 px-4 py-1.5 rounded-full
bg-surface shadow-md ring-1 ring-border
text-sm font-medium text-text
hover:ring-primary hover:text-primary
transition whitespace-nowrap">
<span id="course-switcher-label">{{ active_course_name }}</span>
<svg class="w-3.5 h-3.5 text-muted transition-transform duration-200" id="course-switcher-chevron"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 10 6">