Add /projects to the site.

assets/css/_page/_index.scss

@@ -0,0 +1,23 @@
+.page {
+  position: relative;
+  max-width: 800px;
+  width: 60%;
+  margin: 0 auto;
+  [header-desktop] & {
+    padding-top: $header-height;
+  }
+
+  [header-desktop=normal] & {
+    padding-top: 0;
+  }
+
+  @include blur;
+}
+
+@import "_single";
+@import "_special";
+@import "_archive";
+@import "_home";
+@import "_projects";
+@import "_404";
+@import "_taxonomy";

assets/css/_page/_projects.scss

@@ -0,0 +1,117 @@
+.projects {
+  .projects-title {
+    text-align: right;
+  }
+}
+
+.projects[projects] {
+  .summary {
+    padding-top: 1rem;
+    padding-bottom: .8rem;
+    color: $global-font-color;
+    border-bottom: 3px dashed $global-border-color;
+
+    [theme=dark] & {
+      color: $global-font-color-dark;
+      border-bottom: 3px dashed $global-border-color-dark;
+    }
+    [theme=black] & {
+      color: $global-font-color-black;
+      border-bottom: 3px dashed $global-border-color-black;
+    }
+
+    .featured-image-preview {
+      width: 100%;
+      padding: 56.25% 0 0;
+      position: relative;
+      margin: 0.6rem auto;
+      @include transition(transform 0.4s ease);
+
+      img {
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        left: 0;
+        top: 0;
+        object-fit: cover
+      }
+
+
+      &:hover {
+        @include transform(scale(1.01));
+      }
+    }
+
+    .single-title {
+      font-size: 1.25rem;
+      line-height: 140%;
+      margin: 0.4rem 0;
+    }
+
+    .content {
+      @include box(vertical);
+      margin-top: .3rem;
+      width: 100%;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      @include overflow-wrap(break-word);
+      color: $global-font-secondary-color;
+
+      [theme=dark] & {
+        color: $global-font-secondary-color-dark;
+      }
+      [theme=black] & {
+        color: $global-font-secondary-color-black;
+      }
+
+      h2,
+      h3,
+      h4,
+      h5,
+      h6,
+      p {
+        font-size: 1rem;
+        line-height: 1.5;
+        display: inline;
+
+        &::after {
+          content: "\A";
+          white-space: pre;
+        }
+      }
+
+      h2 {
+        font-size: 1.125rem;
+      }
+
+      @include link(false, true);
+
+      b, strong {
+        color: $global-font-secondary-color;
+
+        [theme=dark] & {
+          color: $global-font-secondary-color-dark;
+        }
+        [theme=black] & {
+          color: $global-font-secondary-color-black;
+        }
+      }
+    }
+
+    .post-footer {
+      margin-top: .4rem;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      font-size: .875rem;
+
+      @include link(false, false);
+
+      .post-tags {
+        padding: 0;
+
+        @include link(true, true);
+      }
+    }
+  }
+}

content/projects/huttenblock.md

@@ -0,0 +1,10 @@
+---
+type: "project"
+title: "Hüttenblock 🧗"
+rank: 2
+draft: false
+description: A static website to share detailed information about the climbing wall called the "Hüttenblock" in the heart of the Alps.
+github: "https://github.com/01100100/huttenblock"
+website: "https://hüttenblock.com"
+featuredImage: "/media/huttenblock/mockup.jpeg"
+---

content/projects/kreuzungen.md

@@ -0,0 +1,11 @@
+---
+type: "project"
+title: "kreuzungen.world 🌍🚴‍♂️"
+rank: 1
+draft: false
+description: "A web application that allows users to upload a local GPX file or fetch an activity from Strava and then visualize which waterways their route has crossed on a interactive map allowing users to explore their journey in detail."
+github: "https://github.com/01100100/kreuzungen"
+website: "https://kreuzungen.world"
+featuredImage: "/media/kreuzungen/screenshot.png"
+---
+

hugo.toml

@@ -16,10 +16,14 @@ url = "/posts/"
 # title will be shown when you hover on this menu link
 title = ""
 weight = 1
+[[menu.main]]
+name = "Projects"
+url = "/projects/"
+weight = 2
 
 [params]
 gitRepo = "https://github.com/01100100/blog"
-
+mainSections = ["posts", "projects"]
 
 [params.home.profile]
 enable = true

layouts/_default/projects.html

@@ -0,0 +1,68 @@
+{{- define "content" -}}
+    <div class="page projects" projects="">
+        {{- /* Title */ -}}
+        <h2 class="projects-title animate__animated animate__pulse animate__faster">
+            Projects
+        </h2>
+        {{- range sort .Pages ".Params.rank" -}}
+        <article class="single summary" itemscope itemtype="http://schema.org/Article">
+            {{- /* Featured image */ -}}
+            {{- $params := .Params | merge .Site.Params.page -}}
+            {{- $image := $params.featuredImagePreview | default $params.featuredImage -}}
+            {{- $height := "auto" -}}
+            {{- $width := "auto" -}}
+            {{- with .Resources.GetMatch (printf "%s" ($image)) -}}
+            {{- $image = .RelPermalink -}}
+            {{- $height = .Height -}}
+            {{- $width = .Width -}}
+            {{- end -}}
+
+            {{- with $image -}}
+            <div class="featured-image-preview">
+                <a href="{{ $params.website }}" aria-label={{ $.Title }}>
+                    {{- dict "Src" . "Title" $.Description "Resources" $.Resources "Height" $height "Width" $width "Title" $params.website "Loading" "eager" | partial "plugin/image.html" -}}
+                </a>
+            </div>
+            {{- end -}}
+
+            {{- /* Title */ -}}
+            <h1 class="single-title" itemprop="name headline">
+                <a href="{{ $params.website }}">{{ .Title }}</a>
+            </h1>
+
+            {{- /* Meta */ -}}
+            <div class="project-meta">
+                <span class="project-github">
+                    {{- with $params.github -}}
+                    <a href="{{ . }}" target="_blank" rel="noopener noreferrer"><i class='fab fa-github fa-fw'></i>Repo on Github</a>
+                    {{- end -}}
+                </span>
+            </div>
+
+            {{- /* Summary content */ -}}
+            <div class="content">
+                {{- with .Summary -}}
+                {{- dict "Content" . "Ruby" $params.ruby "Fraction" $params.fraction "Fontawesome" $params.fontawesome | partial "function/content.html" | safeHTML -}}
+                {{- else -}}
+                {{- .Description | safeHTML -}}
+                {{- end -}}
+            </div>
+
+
+            {{- /* Footer */ -}}
+    <div class="post-footer">
+        {{- with .Params.tags -}}
+        <div class="post-tags">
+            <i class="fas fa-tags fa-fw"></i>&nbsp;
+            {{- range $index, $value := . -}}
+            {{- if gt $index 0 }},&nbsp;{{ end -}}
+            {{- $tag := partialCached "function/path.html" $value $value | printf "/tags/%v" | $.Site.GetPage -}}
+            <a href="{{ $tag.RelPermalink }}">{{ $tag.Title }}</a>
+            {{- end -}}
+        </div>
+        {{- end -}}
+    </div>
+        </article>
+        {{- end -}}
+    </div>
+{{- end -}}

layouts/index.html

@@ -0,0 +1,41 @@
+{{- define "content" -}}
+
+    {{- $params := .Scratch.Get "params" -}}
+    {{- $profile := .Site.Params.home.profile -}}
+    {{- $posts := .Site.Params.home.posts -}}
+    <div class="page home"{{ if ne $posts.enable false | or .Content }} posts{{ end }}>
+        {{- /* Profile */ -}}
+        {{- if ne $profile.enable false -}}
+            {{- partial "home/profile.html" . -}}
+        {{- end -}}
+
+        {{- /* Content */ -}}
+        {{- if .Content -}}
+            <div class="single">
+                <div class="content" id="content">
+                    {{- dict "Content" .Content "Ruby" $params.ruby "Fraction" $params.fraction "Fontawesome" $params.fontawesome | partial "function/content.html" | safeHTML -}}
+                </div>
+            </div>
+        {{- end -}}
+
+        {{- /* Posts */ -}}
+        {{- if ne $posts.enable false | and .Site.RegularPages -}}
+            {{- /* Paginate */ -}}
+            {{- $pages := where .Site.RegularPages "Type" "in" site.Params.mainSections -}}
+            {{- if .Site.Params.page.hiddenFromHomePage -}}
+                {{- $pages = where $pages "Params.hiddenfromhomepage" false -}}
+            {{- else -}}
+                {{- $pages = where $pages "Params.hiddenfromhomepage" "!=" true -}}
+            {{- end -}}
+            {{- with $posts.paginate | default .Site.Params.paginate -}}
+                {{- $pages = $.Paginate $pages . -}}
+            {{- else -}}
+                {{- $pages = .Paginate $pages -}}
+            {{- end -}}
+            {{- range $pages.Pages -}}
+                {{- .Render "summary" -}}
+            {{- end -}}
+            {{- partial "paginator.html" . -}}
+        {{- end -}}
+    </div>
+{{- end -}}