Merge branch 'temp_branch'

2022-06-27 16:21:04 +02:00 · 2022-06-27 16:21:04 +02:00 · 71c3d7c8de
commit 71c3d7c8de
parent 28b0d490b6 0cf0202035
29 changed files with 802 additions and 169 deletions
--- a/assets/scss/footer.scss
+++ b/assets/scss/footer.scss
@ -1,5 +1,3 @@
-$color: {{ .Param "color" }};
-
 .footer {
    margin: auto;
    padding: 1.5rem 0rem;
@ -16,7 +14,11 @@ $color: {{ .Param "color" }};
    justify-content: center;
    flex-wrap: wrap;
    font-size: 2em; 
-    color: $color;
+    color: {{ .Site.Params.color.primary }};
+}
+
+.social-media-footer a {
+    color: {{ .Site.Params.color.primary }};
 }

 .links {
@ -36,6 +38,10 @@ $color: {{ .Param "color" }};
    padding: 0px 24px;
 }

+.link a {
+    color: inherit;
+}
+
 .copyright {
    margin-top: 2rem;
    width: 100%;
--- a/assets/scss/header.scss
+++ b/assets/scss/header.scss
@ -39,16 +39,21 @@
 .menu-icon {
    display: none;
    font-size: larger;
+    color: inherit;
 }

 .header-items {
    margin: auto;
-    margin-left: 0px;
+    margin-right: 0px;
+    padding-right: 24px;
    display: flex;
+    justify-content: center;
 }

 .header-item {
-    margin-left: 2.5rem
+    margin: auto;
+    margin-left: 2.5rem;
+    color: inherit;
 }

 .dropdown {
@ -73,6 +78,7 @@
 .dropdown-content a {
    padding: 0.5rem 1rem;
    display: block;
+    color: inherit;
 }

 .dropdown-content a:hover {
@ -83,7 +89,24 @@
    display: block;
 }

+.header-contact-button {
+    background-color: {{ .Site.Params.color.primary }};
+    color: white;
+    border-radius: 4px;
+    padding: 0.5rem 1.5rem;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 1rem;
+    margin-left: 2.5rem
+}
+
@media screen and (max-width: 600px) {
+    .header {
+        padding: 0.5rem;
+        padding-right: 0.5rem;
+    }
+    
    .header-container {
        display: block;
    }
@ -117,6 +140,7 @@
        display: block;
        text-align: left;
        margin-top: 0.5rem;
+        padding-right: 0rem;
    }

    .header-items.responsive .header-item {
@ -126,6 +150,11 @@
        padding-top: 0.5rem;
    }

+    .header-items.responsive .header-contact-button {
+        display: block;
+        margin-left: 0rem;
+    }
+
    .header-items.responsive .icon {
        position: absolute;
        right: 0;
--- a/assets/scss/hero.scss
+++ b/assets/scss/hero.scss
@ -0,0 +1,24 @@
+.hero {
+    height: 700px;
+    background-image: url({{ .hero.background }}) !important;
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-position: center center;
+}
+
+.hero-icon-container {
+    padding: 1rem;
+}
+
+.hero-button {
+    background-color: {{ .color.primary }};
+    color: white;
+    border: 2px solid {{ .color.primary }};
+    border-radius: 4px;
+    padding: 0.5rem 1.5rem;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 1rem;
+    margin-top: 1rem;
+}
--- a/assets/scss/index.scss
+++ b/assets/scss/index.scss
@ -1,4 +1,3 @@
-$color: {{ .Param "color" }};
 $font: {{ .Param "font" }};

@font-face {
@ -8,6 +7,10 @@ $font: {{ .Param "font" }};
    font-style: normal;
 }

+* {
+    box-sizing: border-box;
+}
+
 html {
    scroll-behavior: smooth;
 }
@ -39,7 +42,7 @@ p {

 a {
    text-decoration: none;
-    color: inherit;
+    color: {{ .Site.Params.color.secondary }};
 }

 button {
@ -66,14 +69,6 @@ button {

 [class*="col-"] {
    float: left;
-    padding: 1.5rem 1.5rem;
-}
-
-@media screen and (max-width: 600px) {
-    [class*="col-"] {
-        width: 100%;
-        max-width: 100%;
-    }
 }

 .row {
@ -89,10 +84,15 @@ button {
    margin: 0;
 }

+.content p img {
+    width: 100%;
+    // height: 500px;
+}
+
 .divider {
    height: 3px;
    border-radius: 50px;
-    background: $color;
+    background: {{ .Site.Params.color.primary }};
    width: 60px;
 }

@ -111,7 +111,7 @@ button {
 .video {
    position: absolute;
    margin: 0 auto;
-    border: 5px dotted $color;
+    border: 5px dotted {{ .Site.Params.color.primary }};
    top: 0;
    left: 0;
    width: 100%;
@ -134,25 +134,43 @@ button {
 }

 .section-highlight {
-    background-color: $color;
+    background-color: {{ .Site.Params.color.primary }};
 }

 .section-content {
-    /* width: 100%; */
+    width: 100%;
    max-width: 1152px;
    margin: auto;
    justify-content: center;
 }

-.article {
+.content {
    padding-top: 9rem;
    padding-bottom: 2rem;
-    // padding-right: 1.5rem;
-    // padding-left: 1.5rem;
-    max-width: 1152px;
+    padding-right: 1.5rem;
+    padding-left: 1.5rem;
    width: 100%;
+    max-width: 1152px;
    margin: 0;
    align-self: center;
+    flex-grow: 1;
+}
+
+.notfound {
+    display: flex;
+    padding-right: 1.5rem;
+    padding-left: 1.5rem;
+    width: 100%;
+    max-width: 1152px;
+    margin: 0;
+    align-self: center;
+    justify-content: center;
+    flex-grow: 1;
+}
+
+.notfoundimage {
+    width: 100%;
+    max-width: 912px;
 }

 /* Team */
@ -162,19 +180,38 @@ button {
    text-align: center;
 }

+.team-list {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+}
+
+.team-list a {
+    color: inherit;
+}
+
 .teammember {
    display: inline-block;
    align-items: center;
    text-align: center;
    margin: 0 auto;
-    padding: 1.5rem;
+    padding: 1rem;
 }

 .avatar {
    width: 15rem;
    height: 15rem;
    border-radius: 50%;
-    border: 2px solid $color;
+    border: 2px solid {{ .Site.Params.color.primary }};
+    object-fit: cover;
+    margin: 0 auto;
+}
+
+.avatar-small {
+    width: 10rem;
+    height: 10rem;
+    border-radius: 50%;
+    border: 2px solid {{ .Site.Params.color.primary }};
    object-fit: cover;
    margin: 0 auto;
 }
@ -184,31 +221,79 @@ button {
    padding-bottom: 0.1rem;
 }

-.social-media {
+.teammember-header {
+    display: flex;
+    justify-content: left;
+    margin-bottom: 2rem;
+}
+
+.teammember-header-avatar {
+    width: 10rem;
+    height: 10rem;
+    border-radius: 50%;
+    border: 2px solid {{ .Site.Params.color.primary }};
+    object-fit: cover;
+}
+
+.teammember-header-title {
+    font-size: x-large;
+    padding-bottom: 0.1rem;
+    margin: auto 1rem;
+}
+
+.teammember-header-social-media {
    display: flex;
-    justify-content: center;
    flex-wrap: wrap;
-    font-size: 1.5em;
-    padding-top: 1rem;
    color: #333;
-    min-height: 2em;
+    margin-top: -0.5rem
+}
+
+.teammember-header-social-media a {
+    color: inherit;
+}
+
+.teammember-posts {
+    margin-top: 2rem;
+}
+
+.social-media {
+    font-size: 1.5em;
+}
+
+.author {
+    width: 100%;
+    display: inline-block;
+    align-items: center;
+    text-align: center;
+    margin: 0 auto;
+    padding-top: 2rem;
+}
+
+.author a {
+    color: inherit;
+}
+
+.author-title {
+    font-size: x-large;
+    padding-bottom: 0.1rem;
+    margin: 0;
 }

 /* Funding */

 .funding-logo {
-    width: 14rem;
-    padding: 1.5rem;
+    width: 9rem;
+    padding: 1rem;
 }

 .services {
+    display: inherit;
    padding: 1.5rem 0rem;
 }

 .service-icon-container {
-    /* min-width: 300px; */
-    /* margin: 0 auto;
-    align-self: center; */
+    padding: 1.5rem;
+    margin: auto;
 }

 .service-icon {
@ -218,8 +303,8 @@ button {

 .service-button {
    background-color: transparent;
-    color: $color;
-    border: 2px solid $color;
+    color: {{ .Site.Params.color.primary }};
+    border: 2px solid {{ .Site.Params.color.primary }};
    border-radius: 4px;
    padding: 0.5rem 1.5rem;
    text-align: center;
@ -230,7 +315,7 @@ button {
 }

 .service-button:hover {
-    background-color: $color;
+    background-color: {{ .Site.Params.color.primary }};
    color: white;
 }

@ -247,7 +332,7 @@ button {

 .contact-button {
    background-color: white;
-    color: $color;
+    color: {{ .Site.Params.color.primary }};
    border-radius: 4px;
    padding: 0.5rem 1.5rem;
    text-align: center;
@ -260,4 +345,120 @@ button {
 .contact-text {
    text-align: center;
    color: white;
+}
+
+.cardList {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    width: 100%;
+}
+
+.cardList a {
+    color: inherit;
+}
+
+.smallCard {
+    display: flex;
+    flex-direction: column;
+    border-radius: 5px;
+    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+    width: 360px;
+    height: 100px;
+    margin: 10px;
+    justify-content: center;
+}
+
+.mediumCard {
+    display: flex;
+    flex-direction: column;
+    border-radius: 5px;
+    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+    width: 360px;
+    height: 200px;
+    margin: 10px;
+    justify-content: center;
+}
+
+.card {
+    display: flex;
+    flex-direction: column;
+    border-radius: 5px;
+    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+    max-width: 350px;
+    height: 400px;
+    margin: 5px;
+    justify-content: center;
+}
+.cardImage {
+    display: flex;
+    width: 100%;
+    height: 150px;
+    border-radius: 5px 5px 0px 0px;
+    object-fit: cover;
+    flex-shrink: 0;
+    flex-grow: 1;
+}
+
+.cardIcon {
+    margin: auto;
+    font-size: 8em;
+    color: {{ .Site.Params.color.secondary }};
+}
+
+.cardTitle {
+    text-align: center;
+    font-size: 18px;
+    font-weight: 600;
+    padding-top: 1rem;
+    padding-bottom: 0.5rem;
+}
+.cardDescription {
+    flex-grow: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    padding: 6px;
+    padding-top: 0px;
+    word-wrap: break-word;
+    //white-space: -moz-pre-wrap;
+    //white-space: pre-wrap;
+    height: 100%;
+}
+
+.cardDetail {
+    padding: 6px;
+    font-size: 12px;
+    text-align: right;
+}
+
+.post-detail {
+    margin-top: -6px;
+    padding-bottom: 6px;
+    font-size: 14px;
+}
+
+.coverimage {
+    height: 60vh;
+    min-width: 100%;
+    padding-top: 68px;
+    object-fit: cover;
+}
+
+.more-button {
+    padding-top: 1rem;
+    text-align: center;
+    color: {{ .Site.Params.color.primary }};
+}
+
+@media screen and (max-width: 600px) {
+    [class*="col-"] {
+        display: block;
+        width: 100%;
+        max-width: 100%;
+    }
+
+    .services {
+        display: inline-block;
+    }
 }
--- a/assets/scss/progressbar.scss
+++ b/assets/scss/progressbar.scss
@ -1,6 +1,5 @@
-$color: {{ .Param "color" }};
 .progress {
-    background: linear-gradient(to right, $color var(--scroll), transparent 0);
+    background: linear-gradient(to right, {{ .Site.Params.color.primary }} var(--scroll), transparent 0);
    background-repeat: no-repeat;
    position: fixed;
    width: 100%;
--- a/assets/scss/slider.scss
+++ b/assets/scss/slider.scss
@ -1,5 +1,3 @@
-$color: {{ .Param "color" }};
-
 * {
  box-sizing: border-box;
 }
@ -67,7 +65,7 @@ $color: {{ .Param "color" }};
  display: inline-flex;
  width: 1rem;
  height: 1rem;
-  background: $color;
+  background: {{ .color.primary }};
  text-decoration: none;
  align-items: center;
  justify-content: center;
@ -100,7 +98,7 @@ $color: {{ .Param "color" }};
  left: 0;
  top: 0;
  z-index: 2;
-  color: $color;
+  color: {{ .color.primary }};
  font-size: 3.5em;
 }

@ -119,7 +117,7 @@ $color: {{ .Param "color" }};
  top: 0;
  right: 0;
  z-index: 2;
-  color: $color;
+  color: {{ .color.primary }};
  font-size: 3.5em;
 }

--- a/assets/scss/totop.scss
+++ b/assets/scss/totop.scss
@ -1,7 +1,6 @@
-$color: {{ .Param "color" }};
 .totop {
    display: inline-flex;
-    background-color: $color;
+    background-color: {{ .Site.Params.color.primary }};
    color: #f2f2f2;
    width: 50px;
    height: 50px;
--- a/layouts/404.html
+++ b/layouts/404.html
@ -1,5 +1,5 @@
-<html>
-    <body>
-        <img src="/images/undraw_page_not_found_su7k.svg">
-    </body>
-</html>
+{{ define "main" }}
+    <div class="notfound">
+        <img class="notfoundimage" src="/images/undraw_page_not_found_su7k.svg">
+    </div>
+{{ end }}
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@ -0,0 +1,39 @@
+
+
+<!DOCTYPE html>
+<html lang="{{ .Site.LanguageCode }}">
+    <head>
+        <meta name="description" content="{{ if .Params.summary }}{{ .Params.summary }}{{ else if .Site.Params.Description }}{{ .Site.Params.Description }}{{ else }}Hardcoded description; the author should update :){{ end }}" />
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no" />
+        <meta http-equiv="x-ua-compatible" content="ie=edge">
+        {{- $favIcon     := .Site.Params.favIcon }}
+        <link rel="icon" type="image/png" sizes="16x16" href="{{ if $favIcon.small }}{{ $favIcon.small }}{{ else }}/favIcon16x16.png{{ end }}">
+        <link rel="icon" type="image/png" sizes="32x32" href="{{ if $favIcon.big }}{{ $favIcon.big }}{{ else }}/favIcon32x32.png{{ end }}">
+        <title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
+        <link rel="stylesheet" type="text/css" href="/Font-Awesome/css/all.min.css">
+        {{ $template := resources.Get "scss/index.scss" }}
+        {{ if $template }}
+        {{ $index := $template | resources.ExecuteAsTemplate "css/index.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
+        <link rel="stylesheet" type="text/css" href="{{ $index.RelPermalink }}">
+        {{ end }}
+        {{ block "styling" . }}
+        {{ end }}
+        {{ $template := resources.Get "scss/totop.scss" }}
+        {{ if $template }}
+        {{ $totop := $template | resources.ExecuteAsTemplate "css/totop.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
+        <link rel="stylesheet" type="text/css" href="{{ $totop.RelPermalink }}">
+        {{ end }}
+    </head>
+    <body>
+        {{ block "header" . }}
+            {{- partial "header.html" . -}}
+        {{ end }}
+        {{ block "main" . }}
+            <!-- The part of the page that begins to differ between templates -->
+        {{ end }}
+        {{ block "footer" . }}
+            {{- partial "footer.html" . -}}
+        {{ end }}
+    </body>
+</html>
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@ -0,0 +1,26 @@
+{{ define "main" }}
+{{ if .Params.id }}
+{{- partial "hero.html" (dict "hero" .Params "color" .Site.Params.color "odd" 0) -}}
+{{ end }}
+{{.Content}}
+<div>
+  {{- range $index, $page := .Pages }}
+    {{ $odd := mod (add $index 1) 2 }}
+    {{ if eq .Params.type "slider" }}
+      {{- partial "slider.html" (dict "id" $page.File.ContentBaseName "slider" .Params "color" $.Site.Params.color "odd" $odd) -}}
+    {{ else if eq .Params.type "hero" }}
+      {{- partial "hero.html" (dict "id" $page.File.ContentBaseName "hero" .Params "color" $.Site.Params.color "odd" $odd) -}}
+    {{ else if eq .Params.type "video" }}
+      {{- partial "video.html" (dict "id" $page.File.ContentBaseName "video" .Params "odd" $odd) -}}
+    {{ else if eq .Params.type "service" }}
+      {{- partial "service.html" (dict "id" $page.File.ContentBaseName "service" .Params "content" .Content "odd" $odd) -}}
+    {{ else if eq .Params.type "contact" }}
+      {{- partial "contact.html" (dict "id" $page.File.ContentBaseName "contact" .Params "odd" $odd) -}}
+    {{ else if eq .Params.type "logos" }}
+      {{- partial "logos.html" (dict "id" $page.File.ContentBaseName "logos" .Params "odd" $odd) -}}
+    {{ else if eq .Params.type "links" }}
+      {{- partial "links.html" (dict "id" $page.File.ContentBaseName "links" .Params "defaultimage" $.Site.Params.defaultimage "odd" $odd) -}}
+    {{ end }}
+  {{ end }}
+</div>
+{{ end }}
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@ -1,18 +1,15 @@
-<!DOCTYPE html>
-<html lang="{{ .Site.LanguageCode }}">
-    {{- partial "head.html" . -}}
-    <body>
-        {{- partial "header.html" . -}}
-        {{ block "main" . }}
-        <div class="article">
+{{ define "main" }}
+    {{ with .Params.image }}
+        <img class="coverimage" src="{{ . }}" />
+    {{ end }}
+    <div class="content">
+        {{ with .Title }}
            <div class="title">
-                <h1 class="content-title">{{ .Title }}</h1>
+                <h1 class="content-title">{{ . }}</h1>
                <div class="divider"></div>
            </div>
-            <!-- <h6>{{ .Date.Format "Mon, Jan 2, 2006" }}</h6> -->
-            {{ .Content }}
-        </div>
        {{ end }}
-        {{- partial "footer.html" . -}}
-    </body>
-</html>
+        <!-- <h6>{{ .Date.Format "Mon, Jan 2, 2006" }}</h6> -->
+        {{ .Content }}
+    </div>
+{{ end }}
--- a/layouts/_default/terms.html
+++ b/layouts/_default/terms.html
@ -0,0 +1,20 @@
+{{ define "main" }}
+<div class="content">
+    <article>
+        <div class="title">
+            <h1 class="content-title">{{ .Title }}</h1>
+            <div class="divider"></div>
+        </div>
+    </article>
+    <!-- Ranges through content/posts/*.md -->
+    <div class="cardList">
+    {{ range .Pages }}
+        <a href="{{.Permalink}}">
+            <div class="smallCard">
+                <div class="cardTitle">{{.Title}}</div>
+            </div>
+        </a>
+    {{ end }}
+    </div>
+</div>
+{{ end }}
--- a/layouts/index.html
+++ b/layouts/index.html
@ -1,24 +1,24 @@
-<!DOCTYPE html>
-<html lang="{{ .Site.LanguageCode }}">
-    {{- partial "head.html" . -}}
-    <body>
-        {{- partial "header.html" . -}}
-        {{- range $index, $section := .Site.Params.sections }}
-            {{ $odd := mod $index 2 }}
-            {{if eq .type "slider" }}
-                {{- partial "slider.html" (dict "slider" $section "odd" $odd) -}}
-            {{ else if eq .type "video" }}
-                {{- partial "video.html" (dict "video" $section "odd" $odd) -}}
-            {{ else if eq .type "service" }}
-                {{- partial "service.html" (dict "service" $section "odd" $odd) -}}
-            {{ else if eq .type "team" }}
-                {{- partial "team.html" (dict "team" $section "odd" $odd) -}}
-            {{ else if eq .type "contact" }}
-                {{- partial "contact.html" (dict "contact" $section "odd" $odd) -}}
-            {{ else if eq .type "logos" }}
-                {{- partial "logos.html" (dict "logos" $section "odd" $odd) -}}
-            {{end}}
-        {{- end }}
-        {{- partial "footer.html" . -}}
-    </body>
-</html>
+{{ define "main" }}
+    {{- range $index, $section := .Site.Params.sections }}
+        {{ $odd := mod $index 2 }}
+        {{ if eq .type "slider" }}
+            {{- partial "slider.html" (dict "slider" $section "color" $.Site.Params.color "odd" $odd) -}}
+        {{ else if eq .type "hero" }}
+            {{- partial "hero.html" (dict "hero" $section "color" $.Site.Params.color "odd" $odd) -}}
+        {{ else if eq .type "video" }}
+            {{- partial "video.html" (dict "video" $section "odd" $odd) -}}
+        {{ else if eq .type "service" }}
+            {{- partial "service.html" (dict "service" $section "content" $section.description "odd" $odd) -}}
+        {{ else if eq .type "team" }}
+            {{ $pages := where $.Site.RegularPages "Section" $section.id }}
+            {{- partial "team.html" (dict "team" $section "pages" $pages "defaultimage" $.Site.Params.defaultimage "odd" $odd) -}}
+        {{ else if eq .type "contact" }}
+            {{- partial "contact.html" (dict "contact" $section "odd" $odd) -}}
+        {{ else if eq .type "logos" }}
+            {{- partial "logos.html" (dict "logos" $section "odd" $odd) -}}
+        {{ else if eq .type "posts" }}
+            {{ $pages := where $.Site.RegularPages "Section" $section.id }}
+            {{- partial "posts.html" (dict "posts" $section "pages" $pages "defaultimage" $.Site.Params.defaultimage "odd" $odd) -}}
+        {{ end }}
+    {{- end }}
+{{ end }}
--- a/layouts/partials/contact.html
+++ b/layouts/partials/contact.html
@ -1,5 +1,11 @@
 {{- $contact := .contact }}
-<div id="{{ $contact.id }}" class="section section-highlight">
+{{- $id := "contact"}}
+{{if $contact.id}}
+    {{- $id := $contact.id}}
+{{else if .id}}
+    {{- $id := .id }}
+{{end}}
+<div id="{{ $id }}" class="section section-highlight">
    <div class="section-content contact">
        <div class="contact-text">
            <h1>{{ $contact.title }}</h1> 
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@ -4,7 +4,7 @@
 {{ $template := resources.Get "scss/footer.scss" }}
 {{ if $template }}
 {{ $footer := $template | resources.ExecuteAsTemplate "css/footer.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
-<link rel="stylesheet" type="text/css" href="{{ $footer.Permalink }}">
+<link rel="stylesheet" type="text/css" href="{{ $footer.RelPermalink }}">
 {{ end }}
 <footer class="footer">
    <div class="social-media-footer">
@ -12,6 +12,7 @@
            {{- range $social}}
            <a href="{{ .url }}"><i class="fab fa-{{ .type }}"></i></a>
            {{- end }}
+            <a href="/posts/index.xml"><i class="fas fa-rss"></i></a>
        </span>
    </div>
    <div>
@ -22,7 +23,7 @@
        </ul>
    </div>
    <div class="copyright">
-        © 2021 <a href="https://nutfactory.org">Nutfactory</a>
+        © {{ dateFormat "2006" now }} {{ $footer.copyright }}</a>
    </div>
 </footer>
 <a class="totop hide" id="totop" href="#"><i class="fas fa-chevron-up"></i></a>
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@ -1,28 +0,0 @@
-<head>
-    <meta name="description" content="{{ if .Params.summary }}{{ .Params.summary }}{{ else if .Site.Params.Description }}{{ .Site.Params.Description }}{{ else }}Hardcoded description; the author should update :){{ end }}" />
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
-    <meta http-equiv="x-ua-compatible" content="ie=edge">
-    <title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
-    {{- $favIcon     := .Site.Params.favIcon }}
-    <link rel="icon" type="image/png" sizes="16x16" href="{{ if $favIcon.small }}{{ $favIcon.small }}{{ else }}/favIcon16x16.png{{ end }}">
-    <link rel="icon" type="image/png" sizes="32x32" href="{{ if $favIcon.big }}{{ $favIcon.big }}{{ else }}/favIcon32x32.png{{ end }}">
-    {{ $template := resources.Get "scss/index.scss" }}
-    {{ if $template }}
-    {{ $index := $template | resources.ExecuteAsTemplate "css/index.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
-    <link rel="stylesheet" type="text/css" href="{{ $index.Permalink }}">
-    {{ end }}
-    <!-- <link rel="stylesheet" type="text/css" href="/css/index.css"> -->
-    {{ $template := resources.Get "scss/totop.scss" }}
-    {{ if $template }}
-    {{ $totop := $template | resources.ExecuteAsTemplate "css/totop.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
-    <link rel="stylesheet" type="text/css" href="{{ $totop.Permalink }}">
-    {{ end }}
-    <!-- <link rel="stylesheet" type="text/css" href="/css/totop.css"> -->
-    {{ $template := resources.Get "scss/slider.scss" }}
-    {{ if $template }}
-    {{ $slider := $template | resources.ExecuteAsTemplate "css/slider.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
-    <link rel="stylesheet" type="text/css" href="{{ $slider.Permalink }}">
-    {{ end }}
-    <link rel="stylesheet" type="text/css" href="/Font-Awesome/css/all.min.css">
-</head>
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@ -1,11 +1,15 @@
 {{- $header     := .Site.Params.header }}
 {{- $logo     := index $header "logo" }}
 {{- $links      := index $header "links" }}
-<link rel="stylesheet" href="/css/header.css">
+{{ $template := resources.Get "scss/header.scss" }}
+{{ if $template }}
+{{ $index := $template | resources.ExecuteAsTemplate "css/header.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
+<link rel="stylesheet" type="text/css" href="{{ $index.RelPermalink }}">
+{{ end }}
 {{ $template := resources.Get "scss/progressbar.scss" }}
 {{ if $template }}
 {{ $progressbar := $template | resources.ExecuteAsTemplate "css/progressbar.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
-<link rel="stylesheet" type="text/css" href="{{ $progressbar.Permalink }}">
+<link rel="stylesheet" type="text/css" href="{{ $progressbar.RelPermalink }}">
 {{ end }}
 <div class="progress"></div>
 <header class="header" id="header">
@ -13,18 +17,24 @@
        <a class="home" href="{{ $logo.url }}"><img id="logo" class="logo" src="{{ $logo.image }}"></a>
        <div class="header-items" id="header-items">
            {{- range $links}}
-            <a class="header-item" href="{{ .url }}">{{ .text }}</a>
-            {{- end }}
-        <!-- <div class="header-item dropdown">
-            <button class="dropbtn">Portfolio 
-            <i class="fas fa-caret-down"></i>
-            </button>
-            <div class="dropdown-content">
-            <a href="#">Tauschmärkte</a>
-            <a href="#">Konsumkritischer Stadtrundgang</a>
-            <a href="#">Workshops</a>
+            {{ if .links }}
+            <div class="header-item dropdown">
+                <button class="dropbtn">{{ .text }} 
+                    <i class="fas fa-caret-down"></i>
+                </button>
+                <div class="dropdown-content">
+                    {{- range .links}}
+                        <a href="{{ .url }}">{{ .text }}</a>
+                    {{- end }}
+                </div>
            </div>
-        </div> -->
+            {{ else }}
+            <a class="header-item" href="{{ .url }}">{{ .text }}</a>
+            {{ end }}
+            {{- end }}
+            {{ if $header.button }}
+                <a class="header-contact-button" href="{{ $header.button.url }}">{{ $header.button.text }}</a>
+            {{ end }}
        </div>
    </div>
    <a href="javascript:void(0);" id="menu-icon" class="menu-icon" onclick="unfoldHeader()">&#9776;</a>
--- a/layouts/partials/hero.html
+++ b/layouts/partials/hero.html
@ -0,0 +1,31 @@
+{{- $hero := .hero }}
+{{- $color := .color }}
+{{- $odd := .odd }}
+{{- $id := "hero"}}
+{{if $hero.id}}
+    {{- $id := $hero.id}}
+{{else if .id}}
+    {{- $id := .id }}
+{{end}}
+{{ $template := resources.Get "scss/hero.scss" }}
+{{ if $template }}
+{{ $index := $template | resources.ExecuteAsTemplate "css/hero.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
+<link rel="stylesheet" type="text/css" href="{{ $index.RelPermalink }}">
+{{ end }}
+<div id="{{ $id }}" class="section {{if eq $odd 0}} section-even {{end}} row hero">
+    <div class="section-content">
+        <div class="hero-description col-5">
+            <div class="title">
+                <h1 class="content-title">{{ $hero.title }}</h1>
+                <div class="divider"></div>
+            </div>
+            <p>{{ $hero.subtitle }}</p>
+            {{if $hero.button.visible}}
+            <a class="hero-button" href="{{ $hero.button.url }}">{{ $hero.button.text }}</a>
+            {{end}}
+        </div>
+        <div class="hero-icon-container col-7">
+            <img class="service-icon" alt="{{ $hero.image.alt }}" src="{{ $hero.image.url }}">
+        </div>
+    </div>
+</div>
--- a/layouts/partials/links.html
+++ b/layouts/partials/links.html
@ -0,0 +1,37 @@
+{{- $links := .links }}
+{{- $odd     := .odd }}
+{{- $defaultimage := .defaultimage}}
+{{- $id := "links"}}
+{{if $links.id}}
+  {{- $id := $links.id}}
+{{else if .id}}
+  {{- $id := .id }}
+{{end}}
+<div id="{{ $id }}" class="section {{if eq $odd 0}} section-even {{end}}">
+  <div class="section-content links">
+    {{ with $links.title }}
+      <div class="title">
+        <h1 class="content-title">{{ . }}</h1>
+        <div class="divider"></div>
+      </div>
+    {{ end }}
+    <div class="cardList">
+      {{- range $links.links}}
+        <a href="{{ .url }}">
+          <div class="mediumCard">
+            {{ if .image }}
+              <img class="cardImage" alt="{{ .image.alt }}" src="{{ .image.url }}" />
+            {{ else if .icon }}
+              <div class="cardImage">
+                <i class="fas fa-{{ .icon }} cardIcon"></i>
+              </div>
+            {{ else }}
+              <img class="cardImage" alt="default image" src="{{ $defaultimage }}"  />
+            {{ end }}
+            <div class="cardTitle">{{.title}}</div>
+          </div>
+        </a>
+      {{- end}}
+    </div>
+  </div>
+</div>
--- a/layouts/partials/logos.html
+++ b/layouts/partials/logos.html
@ -1,6 +1,12 @@
 {{- $logos := .logos }}
 {{- $odd     := .odd }}
-<div id="{{ $logos.id }}" class="section {{if eq $odd 0}} section-even {{end}}">
+{{- $id := "logos"}}
+{{if $logos.id}}
+    {{- $id := $logos.id}}
+{{else if .id}}
+    {{- $id := .id }}
+{{end}}
+<div id="{{ $id }}" class="section {{if eq $odd 0}} section-even {{end}}">
    <div class="section-content funding">
        <div class="title">
            <h1 class="content-title">{{ $logos.title }}</h1>
--- a/layouts/partials/posts.html
+++ b/layouts/partials/posts.html
@ -0,0 +1,35 @@
+{{- $posts := .posts }}
+{{- $pages := .pages }}
+{{- $defaultimage := .defaultimage }}
+{{- $odd     := .odd }}
+{{- $id := "posts"}}
+{{if $posts.id}}
+    {{- $id := $posts.id}}
+{{else if .id}}
+    {{- $id := .id }}
+{{end}}
+<div id="{{ $id }}" class="section {{if eq $odd 0}} section-even {{end}}">
+    <div class="section-content posts">
+        <div class="title">
+            <h1 class="content-title">{{ $posts.title }}</h1>
+            <div class="divider"></div>
+        </div>
+        <div class="cardList">
+            {{ range first 3 $pages }}
+                <a href="{{.Permalink}}">
+                    <div class="card">
+                        {{ if .Params.image }}
+                            <img class="cardImage" src="{{ .Params.image }}" />
+                        {{ else }}
+                            <img class="cardImage" src="{{ $defaultimage }}"  />
+                        {{ end }}
+                        <div class="cardTitle">{{.Title}}</div>
+                        <div class="cardDescription">{{ .Content | safeHTML | truncate 250 }}</div>
+                        <div class="cardDetail">{{.Date.Format "02.01.2006"}} | {{.ReadingTime}} Minuten</div>
+                    </div>
+                </a>
+            {{ end }}
+        </div>
+        <div class="more-button"><a href="{{ $posts.id }}"> {{ $posts.moretext }} </a></div>
+    </div>
+</div>
--- a/layouts/partials/service.html
+++ b/layouts/partials/service.html
@ -1,24 +1,31 @@
 {{- $service := .service }}
+{{- $content := .content }}
 {{- $odd := .odd }}
-<div id="{{ $service.id }}" class="section {{if eq $odd 0}} section-even {{end}} row">
+{{- $id := "service"}}
+{{if $service.id}}
+    {{- $id := $service.id}}
+{{else if .id}}
+    {{- $id := .id }}
+{{end}}
+<div id="{{$id}}" class="section {{if eq $odd 0}} section-even {{end}} row">
    <div class="section-content services">
-        {{if eq $service.image.direction "left"}}
-        <div class="service-icon-container col-5">
+        {{if and ($service.image) (eq $service.image.direction "left")}}
+        <div class="service-icon-container col-4">
            <img class="service-icon" src="{{ $service.image.url }}">
        </div>
        {{end}}
-        <div class="service-description col-7">
+        <div class="service-description {{if $service.image}} col-8 {{end}}">
            <div class="title">
                <h1 class="content-title">{{ $service.title }}</h1>
                <div class="divider"></div>
            </div>
-            <p>{{ $service.description }}</p>
-            {{if $service.button.visible}}
+            <p>{{ $content }}</p>
+            {{if and ($service.button) ($service.button.visible)}}
            <a class="service-button" href="{{ $service.button.url }}">{{ $service.button.text }}</a>
            {{end}}
-            </div>
-        {{if eq $service.image.direction "right"}}
-        <div class="service-icon-container col-5">
+        </div>
+        {{if and ($service.image) (eq $service.image.direction "right")}}
+        <div class="service-icon-container col-4">
            <img class="service-icon" src="{{ $service.image.url }}">
        </div>
        {{end}}
--- a/layouts/partials/slider.html
+++ b/layouts/partials/slider.html
@ -1,7 +1,18 @@
 {{- $slider := .slider }}
+{{- $color := .color }}
 {{ $length := len $slider.images }}
+{{- $id := "slider"}}
+{{if $slider.id}}
+    {{- $id := $slider.id}}
+{{else if .id}}
+    {{- $id := .id }}
+{{end}}
 {{ $template := resources.Get "scss/slider.scss" }}
-<div id="{{ $slider.id }}" class="slider">
+{{ if $template }}
+{{ $index := $template | resources.ExecuteAsTemplate "css/slider.scss" . | resources.ToCSS (dict "outputStyle" "compressed") | fingerprint }}
+<link rel="stylesheet" type="text/css" href="{{ $index.RelPermalink }}">
+{{ end }}
+<div id="{{ $id }}" class="slider">
    {{ if gt $length 1}}
    <div class=slide-links>
        {{- range $index, $slide := $slider.images}}
--- a/layouts/partials/team.html
+++ b/layouts/partials/team.html
@ -1,33 +1,46 @@
 {{- $team     := .team }}
-{{ $length := len $team.members }}
+{{- $pages    := .pages}}
+{{- $defaultimage := .defaultimage}}
 {{- $odd := .odd }}
-<div id="{{ $team.id }}" class="section {{if eq $odd 0}} section-even {{end}}">
+{{- $id := "team"}}
+{{if $team.id}}
+    {{- $id := $team.id}}
+{{else if .id}}
+    {{- $id := .id }}
+{{end}}
+<div id="{{ $id }}" class="section {{if eq $odd 0}} section-even {{end}}">
    <div class="section-content team">
        <div class="title">
            <h1 class="content-title">{{ $team.title }}</h1>
            <div class="divider"></div>
        </div>
-        {{- range first 3 $team.members }}
-        <div class="teammember">
-            <img class="avatar" src="{{ .image }}" alt="Avatar">
-            <h1 class="teammember-title">{{ .name }}</h1>
-            {{- range .jobs }}
-            <p>{{ . }}</p>
+        <div class="team-list">
+            {{- range first 4 $pages.ByDate }}
+            <a href="{{.Permalink}}">
+                <div class="teammember">
+                    {{ if .Params.image }}
+                        <img class="avatar" src="{{ .Params.image }}" alt="Avatar">
+                    {{ else }}
+                        <img class="avatar" src="{{ $defaultimage }}" alt="Avatar">
+                    {{ end }}
+                    <h1 class="teammember-title">{{ .Params.name }}</h1>
+                    {{- range .Params.jobs }}
+                    <p>{{ . }}</p>
+                    {{- end }}
+                    <div class="social-media">
+                        <span>
+                            {{- range .Params.social}}
+                            <a href="{{ .url }}"><i class="fab fa-{{ .type }}"></i></a>
+                            {{- end}}
+                            {{if .Params.mail}}
+                            <a href="mailto:{{ .Params.mail }}"><i class="fas fa-at"></i></a>
+                            {{end}}
+                        </span>
+                    </div>
+                </div>
+            </a>
            {{- end }}
-            <div class="social-media">
-                <span>
-                    {{- range .social}}
-                    <a href="{{ .url }}"><i class="fab fa-{{ .type }}"></i></a>
-                    {{- end}}
-                    {{if .mail}}
-                    <a href="mailto:{{ .mail }}"><i class="fas fa-at"></i></a>
-                    {{end}}
-                </span>
-            </div>
        </div>
-        {{- end }}
-        {{if gt $length 3}}
-        <div><a href="#"> > Weitere Teammitglieder < </a></div>
-        {{end}}
+        <div class="more-button"><a href="{{ $team.id }}"> {{ $team.moretext }} </a></div>
    </div>
 </div>
--- a/layouts/partials/video.html
+++ b/layouts/partials/video.html
@ -1,6 +1,12 @@
 {{- $video := .video }}
 {{- $odd := .odd }}
-<div id="{{ $video.id }}" class="section {{if eq $odd 0}} section-even {{end}}">
+{{- $id := "video"}}
+{{if $video.id}}
+    {{- $id := $video.id}}
+{{else if .id}}
+    {{- $id := .id }}
+{{end}}
+<div id="{{ $id }}" class="section {{if eq $odd 0}} section-even {{end}}">
    <div class="section-content">
        <div class="videoWrapper">
            {{ if eq $video.video.type "mp4"}}
--- a/layouts/posts/list.html
+++ b/layouts/posts/list.html
@ -0,0 +1,29 @@
+{{ define "main" }}
+<div class="content">
+    <article>
+        <div class="title">
+            <h1 class="content-title">{{ .Title }}</h1>
+            <div class="divider"></div>
+        </div>
+        <!-- "{{.Content}}" pulls from the markdown content of the corresponding _index.md -->
+        {{.Content}}
+    </article>
+    <!-- Ranges through content/posts/*.md -->
+    <div class="cardList">
+    {{ range .Pages }}
+        <a href="{{.Permalink}}">
+            <div class="card">
+                {{ if .Params.image }}
+                    <img class="cardImage" src="{{ .Params.image }}" />
+                {{ else }}
+                    <img class="cardImage" src="{{ $.Site.Params.defaultimage }}"  />
+                {{ end }}
+                <div class="cardTitle">{{.Title}}</div>
+                <div class="cardDescription">{{ .Content | safeHTML | truncate 250 }}</div>
+                <div class="cardDetail">{{.Date.Format "02.01.2006"}} | {{.ReadingTime}} Minuten</div>
+            </div>
+        </a>
+    {{ end }}
+    </div>
+</div>
+{{ end }}
--- a/layouts/posts/single.html
+++ b/layouts/posts/single.html
@ -0,0 +1,47 @@
+{{ define "main" }}
+    {{ with .Params.image }}
+        <img class="coverimage" src="{{ . }}" />
+    {{ end }}
+    <div class="content">
+        {{ with .Params.tags }}
+            <div id="tags">
+                {{ range . }}
+                    <a href="{{ "tags" | absURL }}/{{ . | urlize }}/">#{{ . }}</a>
+                {{ end }}
+            </div>
+        {{ end }}
+        <div class="title">
+            <h1 class="content-title">{{ .Title }}</h1>
+            <div class="post-detail">{{.Date.Format "02.01.2006"}} - ⏱ {{.ReadingTime}} Minuten</div>
+            <div class="divider"></div>
+        </div>
+        {{ .Content }}
+        {{- $author := .Params.author }}
+        {{ with .Site.GetPage "/team" }}
+            {{- range .RegularPages -}}
+                {{if eq .Params.name $author}}
+                <a href="{{.Permalink}}">
+                    <div class="author">
+                        {{ if .Params.image }}
+                            <img class="avatar-small" src="{{ .Params.image }}" alt="Avatar">
+                        {{ else }}
+                            <img class="avatar-small" src="{{ $.Site.Params.defaultimage }}" alt="Avatar">
+                        {{ end }}
+                        <h4 class="author-title">{{ .Params.name }}</h4>
+                        <div class="social-media">
+                            <span>
+                                {{- range .Params.social}}
+                                <a href="{{ .url }}"><i class="fab fa-{{ .type }}"></i></a>
+                                {{- end}}
+                                {{if .Params.mail}}
+                                <a href="mailto:{{ .Params.mail }}"><i class="fas fa-at"></i></a>
+                                {{end}}
+                            </span>
+                        </div>
+                    </div>
+                </a>
+                {{end}}
+            {{ end }}
+        {{ end }}
+    </div>
+{{ end }}
--- a/layouts/team/list.html
+++ b/layouts/team/list.html
@ -0,0 +1,38 @@
+{{ define "main" }}
+<div class="content">
+    <article>
+        <div class="title">
+            <h1 class="content-title">{{ .Title }}</h1>
+            <div class="divider"></div>
+        </div>
+        {{.Content}}
+    </article>
+    <div class="team-list">
+        {{ range .Pages.ByDate }}
+        <a href="{{.Permalink}}">
+            <div class="teammember">
+                {{ if .Params.image }}
+                    <img class="avatar" src="{{ .Params.image }}" alt="Avatar">
+                {{ else }}
+                    <img class="avatar" src="{{ $.Site.Params.defaultimage }}" alt="Avatar">
+                {{ end }}
+                <h1 class="teammember-title">{{ .Params.name }}</h1>
+                {{- range .Params.jobs }}
+                    <p>{{ . }}</p>
+                {{- end }}
+                <div class="social-media">
+                    <span>
+                        {{- range .Params.social}}
+                        <a href="{{ .url }}"><i class="fab fa-{{ .type }}"></i></a>
+                        {{- end}}
+                        {{if .Params.mail}}
+                        <a href="mailto:{{ .Params.mail }}"><i class="fas fa-at"></i></a>
+                        {{end}}
+                    </span>
+                </div>
+            </div>
+        </a>
+        {{ end }}
+    </div>
+</div>
+{{ end }}
--- a/layouts/team/single.html
+++ b/layouts/team/single.html
@ -0,0 +1,46 @@
+{{ define "main" }}
+    <div class="content">  
+        <div class="teammember-header">
+            {{ with .Params.image }}
+                <img class="teammember-header-avatar" src="{{ . }}" alt="Avatar">
+            {{ end }}
+            <div class="teammember-header-title">
+                <h1 class="content-title">{{ .Params.name }}</h1>
+                <div class="teammember-header-social-media">
+                    <span>
+                        {{- range .Params.social}}
+                            <a href="{{ .url }}"><i class="fab fa-{{ .type }}"></i></a>
+                        {{- end}}
+                        {{if .Params.mail}}
+                            <a href="mailto:{{ .Params.mail }}"><i class="fas fa-at"></i></a>
+                        {{end}}
+                    </span>
+                </div>
+                <div class="divider"></div>
+            </div>
+        </div>
+        {{ .Content }}
+        {{- $name := .Params.name }}
+        {{- $defaultimage := .Site.Params.defaultimage }}
+        <div class="cardList teammember-posts">
+            {{ with .Site.GetPage "/posts" }}
+                {{- range .RegularPages -}}
+                    {{if eq .Params.author $name}}
+                        <a href="{{.Permalink}}">
+                            <div class="card">
+                                {{ if .Params.image }}
+                                    <img class="cardImage" src="{{ .Params.image }}" />
+                                {{ else }}
+                                    <img class="cardImage" src="{{ $defaultimage }}"  />
+                                {{ end }}
+                                <div class="cardTitle">{{.Title}}</div>
+                                <div class="cardDescription">{{ .Content | safeHTML | truncate 250 }}</div>
+                                <div class="cardDetail">{{.Date.Format "02.01.2006"}} | {{.ReadingTime}} Minuten</div>
+                            </div>
+                        </a>
+                    {{end}}
+                {{ end }}
+            {{ end }}
+        </div>
+    </div>
+{{ end }}