fmueller/fabcal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Improve sidebar embed look and feel

Browse Source
This commit is contained in:
Fabian Müller
2022-11-21 03:45:43 +01:00
parent 05f985d611
commit cba66c794e
10 changed files with 156 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
templates/sidebar/base.html Normal file
View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html lang="de">
<head>
{% block header %}
{#- TODO: replace with locally served files #}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">
<link rel="stylesheet" href="{{ url_for('static', path='style.css') }}" type="text/css"/>
<link rel="stylesheet" href="{{ url_for('static', path='roboto.css') }}" type="text/css"/>
<title>Embeddable calendar</title>
{% endblock %}
</head>
<body>
{% block body %}
{% endblock %}
</body>
</html>

21
templates/sidebar/embed.html Normal file
View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html lang="de">
<head>
{#- TODO: replace with locally served files #}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">
<link rel="stylesheet" href="{{ url_for('static', path='style.css') }}" type="text/css"/>
<link rel="stylesheet" href="{{ url_for('static', path='roboto.css') }}" type="text/css"/>
<title>Embeddable calendar</title>
</head>
<body>
<div class="calendar">
{% include "sidebar/includes/header.html" %}
{% include "sidebar/includes/events-list.html" %}
{% include "sidebar/includes/footer.html" %}
</div>
</body>
</html>

57
templates/sidebar/includes/events-list.html Normal file
View File

@ -0,0 +1,57 @@
{% for start_date, events in grouped_events %}
<div class="calendar-date">
<div class="calendar-date-date">
<div class="calendar-date-month">
{{ start_date.strftime("%b") }}
</div>
<div class="calendar-date-day">
{{ start_date.strftime("%d") }}
</div>
<div class="calendar-date-weekday">
{{ start_date.strftime("%a") }}
</div>
</div>
<div class="calendar-events">
{% for event in events %}
<div class="calendar-event" title="{{ event.summary }}{% if event.description %} &mdash; {{ event.description }}{% endif %}">
<div class="calendar-event-time">
<div class="calendar-event-starttime">{{ event.start.strftime("%H:%M") }}</div>
<div class="calendar-event-timesep"></div>
<div class="calendar-event-endtime">{{ event.end.strftime("%H:%M") }}</div>
</div>
<div class="calendar-event-description">
{% if event.description or event.location %}
<details class="calendar-event-details">
<summary>{{ event.summary | urlize }}</summary>
<div class="calendar-popover-content">
{% if event.description %}
<div class="calendar-popover-entry">
{#- description doesn't need an icon, just wastes space #}
<div class="calendar-popover-entry-text">{{ event.description | urlize | nl2br }}</div>
</div>
{% endif %}
{% if event.location %}
<div class="calendar-popover-entry">
<div class="calendar-popover-entry-icon"><i class="fa-solid fa-location-dot"></i></div>
<div class="calendar-popover-entry-text">{{ event.location | urlize | nl2br }}</div>
</div>
{% endif %}
</div>
</details>
{% else %}
<span>{{ event.summary }}</span>
{% endif %}
</div>
{%- if "AusbauLab" in event.categories %}
<div class="calendar-event-type calendar-event-type-ausbau"></div>
{%- elif event.color %}
<div class="calendar-event-type" style="background-color: {{ event.color }};"></div>
{%- else %}
<div class="calendar-event-type calendar-event-type-unknown"></div>
{%- endif %}
</div>
{% endfor %}
</div>
</div>
{% endfor %}

3
templates/sidebar/includes/footer.html Normal file
View File

@ -0,0 +1,3 @@
<div class="calendar-subscription-buttons">
<a href="{{ url_for('events_ics') }}"><i class="fa-solid fa-calendar"></i> Kalender abonnieren</a>
</div>

1
templates/sidebar/includes/header.html Normal file
View File

@ -0,0 +1 @@
<h3>Veranstaltungen</h3>