New frontend (#41)

* new frontend.
* bugfixes

Co-authored-by: ThomasHaefliger <info@thomashaefliger.ch>

_includes/head.html

@@ -13,6 +13,7 @@
   <meta name="theme-color" content="#ffffff">
   {%- seo -%}
   <link rel="stylesheet" href="{{ "/assets/main.css" | relative_url }}">
+  <link rel="stylesheet" href="{{ "/assets/tools.css" | relative_url }}">
   {%- feed_meta -%}
   {%- if jekyll.environment == 'production' and site.google_analytics -%}
   {%- include google-analytics.html -%}

_includes/header.html

@@ -8,27 +8,5 @@
         <a class="site-title" rel="author" href="{{ "/" | relative_url }}">
         <img src="/assets/logo.png" alt="Cevi Tools Logo" width="250px">
         </a>
-
-        {%- if page_paths -%}
-        <nav class="site-nav">
-            <input type="checkbox" id="nav-trigger" class="nav-trigger"/>
-            <label for="nav-trigger">
-          <span class="menu-icon">
-            <svg viewBox="0 0 18 15" width="18px" height="15px">
-              <path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z"/>
-            </svg>
-          </span>
-            </label>
-
-            <div class="trigger">
-                {%- for path in page_paths -%}
-                {%- assign my_page = site.pages | where: "path", path | first -%}
-                {%- if my_page.title -%}
-                <a class="page-link" href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a>
-                {%- endif -%}
-                {%- endfor -%}
-            </div>
-        </nav>
-        {%- endif -%}
     </div>
 </header>

_layouts/post.html

@@ -12,7 +12,7 @@ <h1 class="post-title p-name" itemprop="name headline">{{ page.title | escape }}
       </time> von
       {% for author in page.authors %}
 
-      {% if forloop.last %}
+      {% if forloop.length > 1 and forloop.last %}
       <span>und</span>
       {% elsif forloop.first %}
       <span></span>

_layouts/tool.html

@@ -0,0 +1,46 @@
+---
+layout: default
+---
+<article class="post h-entry" itemscope itemtype="http://schema.org/BlogPosting">
+
+  <header class="post-header">
+    <h1 class="post-title p-name" itemprop="name headline">{{ page.title | escape }}</h1>
+    <p class="post-meta">
+      <time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
+        {%- assign date_format = site.minima.date_format | default: "%d.%m.%Y" -%}
+        {{ page.date | date: date_format }}
+      </time> von
+      {% for author in page.authors %}
+
+      {% if forloop.length > 1 and forloop.last %}
+      <span>und</span>
+      {% elsif forloop.first %}
+      <span></span>
+      {% else %}
+      <span>,</span>
+      {% endif %}
+
+      {%- if author contains "github@" -%}
+      <span><a class="u-url" href="https://github.com/{{ author | replace: 'github@', '' | split: ' ' | first }}">
+          {{ author | replace: 'github@', '' | split: ' ' | shift | join: " "}}</a></span>
+      <svg class="svg-icon">
+        <use xlink:href="{{ '/assets/minima-social-icons.svg#github' | relative_url }}"></use>
+      </svg>
+      {% else %}
+      <span>{{ author }}</span>
+      {%-endif-%}
+
+      {%- endfor -%}
+    </p>
+  </header>
+
+  <div class="post-content e-content" itemprop="articleBody">
+    {{ content }}
+  </div>
+
+  {%- if site.disqus.shortname -%}
+  {%- include disqus_comments.html -%}
+  {%- endif -%}
+
+  <a class="u-url" href="{{ page.url | relative_url }}" hidden></a>
+</article>

_posts/README.md

@@ -18,3 +18,23 @@ Your blog content as normal Markdown text.
 
 ```
 
+For projects (tools):
+
+```markdown
+---
+layout: tool
+title:  "Tool Title"
+date:   2021-11-25 12:55:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-ready-to-use]
+image: assets/tools-frontpage/cevi_logo_generator.jpg
+deployment: https://logo.cevi.ch
+excerpt: This is the excerpt that will be displayed on the tools overview page.
+authors:
+ - github@author1_github_nick Author 1 Name
+ - Author 2
+---
+
+Your blog content as normal Markdown text.
+
+```
+

_posts/news/2023-04-16-hackathon.md

@@ -0,0 +1,13 @@
+---
+layout: post
+title:  "CeviTools Hackathon"
+date:   2023-04-16 15:00:00 +0100
+categories: release
+authors:
+ - github@ThomasHaefliger Goofy
+ - github@maede97 Scirocco
+ - github@wp99cp JPG
+ - github@patrickuhlmann Luchs
+---
+
+Es ist Hackathon-Zeit! Heute fand der zweite Hackathon der CeviTools statt. Die Infrastruktur ist nun auf dem neusten Stand. Weiter wurde die Homepage angepasst und visuell verbessert. Neue Tools sind in Erstellung und sollten bald veröffentlicht werden!

tools-for-groups.md → _posts/tools/2023-04-16-app.md

@@ -1,15 +1,14 @@
 ---
-layout: page
-title: Tools für Abteilungen
-permalink: /tools-for-groups/
-weight: 3
+layout: tool
+title:  "App"
+date:   2022-01-16 09:30:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-diy]
+excerpt: Chästlizettel mit Mobile App, Anbindung an Nextcloud und automatischen Mails.
+image: assets/tools-frontpage/app-diy.jpg
+authors:
+ - github@ursforrer MIR
 ---
 
-# Tools, die du in deiner Abteilung selber aufsetzen kannst
-
-## Chästlizettel mit Mobile App, Anbindung an Nextcloud und automatischen Mails
-**Informationen für deine Programme leicht gemacht**
-
 In den [Repos vom Cevi Dürnten](https://github.com/ceviduernten) kannst du diverse Bestandteile finden.
 Herzstück ist eine Mobile App, welche dir den Chästlizettel für's nächste Programm anzeigt. Darin zu finden sind deine nächsten Anlässe, die aus einem Nextcloud Kalender heraussynchronisiert werden. Über ein einfaches Webinterface kann jeder Leiter der Abteilung die Informationen für's nächste Programm erstellen und direkt per Mail über eine Anbindung der cevi.db an die Eltern zustellen lassen. 
 

_posts/tools/2023-04-16-automatic-walk-time-tables.md

@@ -0,0 +1,24 @@
+---
+layout: tool
+title:  "Automatische Marschzeittabellen"
+date:   2022-01-16 10:30:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-ready-to-use]
+excerpt: Lasse Marschzeittabellen generieren.
+image: assets/tools-frontpage/map.jpg
+deplyoment: https://map.cevi.tools
+authors:
+ - github@wp99cp JPG
+ - github@maede97 Scirocco
+---
+
+![J+S-Marschzeittabellen Banner](https://github.com/cevi/automatic_walk-time_tables/raw/master/docs/imgs/Claim.png)
+Ziel dieses Projektes ist es, den Prozess rund um das Erstellen einer J+S-Marschzeittabelle für eine Wanderung oder Velo-Tour zu automatisieren und zu beschleunigen.
+
+Features
+- Einlesen von GPX Dateien
+- J+S-Marschzeittabelle (Excel) automatisiert generieren
+- Karten mit gewähltem Massstab als PDF generieren
+
+Probiers aus unter [map.cevi.tools](https://map.cevi.tools)
+
+Das Projekt ist unter [cevi/automatic_walk-time_tables](https://github.com/cevi/automatic_walk-time_tables) zu finden.

_posts/tools/2023-04-16-emeal.md

@@ -0,0 +1,20 @@
+---
+layout: tool
+title:  "eMeal - Menüplanung"
+date:   2022-01-16 10:30:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-ready-to-use]
+excerpt: Automatisiere die Essensplanung für ein Lager oder Anlass.
+image: assets/tools-frontpage/emeal_burger.jpg
+deplyoment: https://emeal.zh11.ch
+authors:
+ - github@wp99cp JPG
+---
+
+eMeal - Menüplanung* ermöglicht es die Essensplanung für ein Lager oder Anlass zu automatisieren. Eine Bibliothek an Rezepten erleichtert die Vorbereitung und erspart wiederholtes abtippen. Importiere Rezepte direkt von verschiedenen Webseiten mit nur einem Klick.
+eMeal ermöglicht ein simultanes Bearbeiten aller Rezepte, Lager und Anlässen von mehreren Benutzern über alle Gerätetypen hinweg.
+
+**Eine echte Hilfe für jede Lager- oder Kursküche!**
+
+Auf [https://emeal.zh11.ch/](https://emeal.zh11.ch/) findest du weitere Informationen und kannst gleich loslegen!
+
+![eMeal Banner](https://user-images.githubusercontent.com/34008738/105835410-10843900-5fcc-11eb-9a23-2b9140c8c373.png)

_posts/tools/2023-04-16-logo-generator.md

@@ -0,0 +1,14 @@
+---
+layout: tool
+title:  "Cevi Logo Generator"
+date:   2022-01-16 10:30:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-ready-to-use]
+excerpt: Erstelle Cevi Claims.
+image: assets/tools-frontpage/cevi_logo_generator.jpg
+deplyoment: https://logo.cevi.ch
+authors:
+ - github@btemperli Zottel
+---
+
+## Cevi Logo Generator
+Bestimmt hast du diese Logos, wahlweise mit einem Kurztext (Claim), schon irgendwo gesehen, zum Beispiel auf der Website des [Cevi Schweiz](https://cevi.ch). Diese Logos kannst du für deine Cevi-Zwecke ganz einfach selbst erstellen mit dem [Cevi Logo Generator](https://logo.cevi.ch). Es ist simpel, probiers einfach aus!

in-development.md → _posts/tools/2023-04-16-onlinemat.md

@@ -1,14 +1,17 @@
 ---
-layout: page
-title: In Entwicklung
-permalink: /entwicklung/
-weight: 2
+layout: tool
+title:  "Online-Material"
+date:   2022-01-16 09:30:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-in-development]
+excerpt: Verwalte dein Materiallager online.
+image: assets/tools-frontpage/onlinemat.jpg
+deplyoment: https://mat.cevi.tools
+authors:
+ - github@Leo1212 Orion
 ---
 
-# Webtools in Entwicklung
-
-## Onlinemat
 ![Onlinemat Banner](/assets/onlinemat.png)
+
 Ziel dieses Projektes ist es, das Materiallager der einzelnen Abteilungen zu digitalisieren. Jede Leitende Person soll wissen was sich im Mat befindet und wann es verfügbar ist.
 
 Features

_posts/tools/2023-04-16-qr-codes.md

@@ -0,0 +1,16 @@
+---
+layout: tool
+title:  "QR Code Generator"
+date:   2023-04-16 10:30:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-ready-to-use]
+excerpt: Erstelle Cevi QR-Codes
+image: assets/tools-frontpage/qr.png
+deplyoment: https://qr.cevi.tools
+authors:
+ - github@wp77cp JPG
+---
+
+## Cevi QR-Code Generator
+QR-Codes sind vielseitig einsetzbar. In der Werbung, Programmen und Kursen kann so einfach der Zugriff auf Web-Inhalte erfolgen. Der [Cevi QR-Code Generator](https://qr.cevi.tools) erstellt QR-Codes in Cevi-Farben und mit dem Cevi-Logo.
+
+![Cevi QR Code](/assets/qr.png)

_posts/tools/2023-04-16-qualitool.md

@@ -0,0 +1,19 @@
+---
+layout: tool
+title:  "Quali-Tool"
+date:   2022-01-16 10:30:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-ready-to-use]
+excerpt: Online Qulifikationstool für J+S-Kurse
+image: assets/tools-frontpage/quali.jpg
+deplyoment: https://quali.cevi.tools
+authors:
+ - github@jeromesigg Amigo
+---
+
+Verwalte und erstelle Qualifikationen für deinen J+S-Lagersport/Trekking-Kurs nach dem offiziellen Dokument. Geeignet für Leiterkurs, Lagerleiterkurs und Expertenkurs.
+
+Das Qualitool, eine grosse Hilfe für Gruppenleiter:innen und Kursleiter:innen in J+S-Kursen. Der [Qualifikationsprozess](https://padlet.com/bollersimon/Bookmarks) kann mit diesem Tool von A-Z abgebildet und durchgeführt werden.
+
+Weitere Informationen und einen Demo-Kurs findest du auf [https://quali.cevi.tools/](https://quali.cevi.tools/)
+
+![Qualitool Banner](/assets/qualitool.png)

_posts/tools/2023-04-16-rallly.md

@@ -0,0 +1,15 @@
+---
+layout: tool
+title:  "Termine finden"
+date:   2022-01-16 10:30:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-ready-to-use]
+excerpt: Finde einen Termin mit der Doodle-Alternative.
+image: assets/tools-frontpage/termin.jpg
+deplyoment: https://termin.cevi.tools
+authors:
+ - CeviTools
+---
+
+Zum einfachen Finden von gemeinsamen Terminen bieten wir von Cevi.Tools eine Alternative zu anderen Online-Diensten. Selbstverständlich OpenSource, ohne Registrierung und Werbung. Jetzt loslegen auf [termin.cevi.tools](https://termin.cevi.tools)
+
+![termin.cevi.tools](/assets/meet.png)

_posts/tools/2023-04-16-url-shortener.md

@@ -0,0 +1,17 @@
+---
+layout: tool
+title:  "URL-Shortener"
+date:   2022-01-16 09:30:00 +0100 # That's the release date of the blog entry
+categories: [tool, tool-in-development]
+excerpt: Erstelle verkürzte URLs.
+image: assets/tools-frontpage/url_shortener.jpg
+deplyoment: https://go.cevi.tools
+authors:
+ - CeviTools
+---
+
+Erstelle verkürzte URLs aus deinen langen Links.
+
+Um den URL Shortener zu benützen benötigst du dein CeviDB Login.
+
+[go.cevi.tools](https://go.cevi.tools)

_sass/minima.scss

@@ -21,10 +21,10 @@ $grey-color-dark:  darken($grey-color, 25%) !default;
 $table-text-align: left !default;
 
 // Width of the content area
-$content-width:    800px !default;
+$content-width:    1200px !default;
 
-$on-palm:          600px !default;
-$on-laptop:        800px !default;
+$on-palm:          800px !default;
+$on-laptop:        1200px !default;
 
 // Use media queries like this:
 // @include media-query($on-palm) {

_sass/minima/_layout.scss

@@ -2,7 +2,6 @@
  * Site header
  */
 .site-header {
-  border-top: 5px solid $grey-color-dark;
   border-bottom: 1px solid $grey-color-light;
   min-height: $spacing-unit * 1.865;