mirror of
https://github.com/netz39/www.netz39.de.git
synced 2025-01-19 04:20:10 +01:00
Add built-in calender by using fullcalendar.io
Every markdown file in _events is converted to a single JSON file available under /calendar-data, which is the source of fullcalender
This commit is contained in:
parent
52c16ce647
commit
db93df11da
8 changed files with 107 additions and 1 deletions
|
@ -46,6 +46,10 @@ collections:
|
||||||
portfolio:
|
portfolio:
|
||||||
output: true
|
output: true
|
||||||
permalink: /:collection/:name
|
permalink: /:collection/:name
|
||||||
|
events:
|
||||||
|
output: true
|
||||||
|
permalink: /events/:path
|
||||||
|
title: Events
|
||||||
|
|
||||||
# BUILD SETTINGS
|
# BUILD SETTINGS
|
||||||
sass:
|
sass:
|
||||||
|
|
7
_events/stammtisch_kw42.md
Normal file
7
_events/stammtisch_kw42.md
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
---
|
||||||
|
layout: event
|
||||||
|
title: "Stammtisch KW42"
|
||||||
|
event_date: 2023-10-18
|
||||||
|
---
|
||||||
|
|
||||||
|
Heute ist Stammtisch!
|
18
_layouts/calendar.html
Normal file
18
_layouts/calendar.html
Normal file
|
@ -0,0 +1,18 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
{% include default/head.liquid %}
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
{% include default/navbar.liquid %}
|
||||||
|
|
||||||
|
<div class="wrapper">
|
||||||
|
{{ content }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% include default/footer.liquid %}
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
33
_layouts/event.liquid
Normal file
33
_layouts/event.liquid
Normal file
|
@ -0,0 +1,33 @@
|
||||||
|
---
|
||||||
|
layout: default
|
||||||
|
---
|
||||||
|
<article {% if page.feature-img or page.color %}class="feature-image" {% endif %}>
|
||||||
|
<header id="main" style="">
|
||||||
|
<div class="title-padder">
|
||||||
|
{% if page.hide_title %}
|
||||||
|
<div class="feature-image-padding"></div>
|
||||||
|
{% else %}
|
||||||
|
<h1 id="{{ page.title | cgi_escape }}" class="title">{{ page.title }}</h1>
|
||||||
|
{% include blog/post_info.liquid author=page.author date=page.date %}
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<section class="post-content">
|
||||||
|
{% if page.bootstrap %}
|
||||||
|
<div class="bootstrap-iso">
|
||||||
|
{% endif %}
|
||||||
|
{{ content }}
|
||||||
|
{% if page.bootstrap %}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Social media shares -->
|
||||||
|
{% include social/share_buttons.liquid %}
|
||||||
|
|
||||||
|
<!-- Tag list -->
|
||||||
|
{% capture tag_list %}{{ page.tags | join: "|"}}{% endcapture %}
|
||||||
|
{% include default/tags_list.liquid tags=tag_list %}
|
||||||
|
|
||||||
|
</article>
|
|
@ -157,7 +157,6 @@ table {
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
table-layout: fixed;
|
table-layout: fixed;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: inline-block;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
td,
|
td,
|
||||||
|
|
17
calendar-data.html
Normal file
17
calendar-data.html
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
---
|
||||||
|
layout:
|
||||||
|
title:
|
||||||
|
permalink: /calendar-data/
|
||||||
|
---
|
||||||
|
|
||||||
|
[
|
||||||
|
{% for event in site.events %}
|
||||||
|
{
|
||||||
|
"title":"{{event.title}}",
|
||||||
|
"start": "{{event.event_date}}",
|
||||||
|
"allDay":true,
|
||||||
|
"url":"{{event.url}}"
|
||||||
|
}
|
||||||
|
{%unless forloop.last %},{%endunless%}
|
||||||
|
{% endfor %}
|
||||||
|
]
|
28
pages/01_events.md
Normal file
28
pages/01_events.md
Normal file
|
@ -0,0 +1,28 @@
|
||||||
|
---
|
||||||
|
layout: calendar
|
||||||
|
title: Events
|
||||||
|
permalink: /events
|
||||||
|
icon: "far fa-calendar"
|
||||||
|
---
|
||||||
|
|
||||||
|
<html lang='de'>
|
||||||
|
<head>
|
||||||
|
<meta charset='utf-8' />
|
||||||
|
<script src='https://cdn.jsdelivr.net/npm/fullcalendar@6.1.9/index.global.min.js'></script>
|
||||||
|
<script src='https://cdn.jsdelivr.net/npm/@fullcalendar/core@6.1.9/locales/de.global.min.js'></script>
|
||||||
|
<script>
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
var calendarEl = document.getElementById('calendar');
|
||||||
|
var calendar = new FullCalendar.Calendar(calendarEl, {
|
||||||
|
initialView: 'dayGridMonth', height: "auto", locale: 'de', events: '/calendar-data'
|
||||||
|
});
|
||||||
|
calendar.render();
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id='calendar' style="width:80%; margin: auto;"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
Reference in a new issue