section und columns shortcodes implementiert

assets/scss/custom.scss

@@ -16,8 +16,17 @@ a {
     transition: 0.3s ease-in-out;
 }
 
+h1, h2, h3, h4, h5, h6 {
+    font-weight:normal;
+}
+
 /**************** Component Styles ******************/ 
 
+// Columns Shortcode
+
+
+
+
 // Verua Slider
 .verua-slider-wrapper {
     position: relative;

config/_default/params.toml

@@ -51,7 +51,7 @@ show_description = true
 show_tags = true
 show_categories = true
 
-
+# TODO Change Metadate for OG and Twitter Card
 # seo meta data for OpenGraph / Twitter Card
 # seo module: https://github.com/gethugothemes/hugo-modules/tree/master/seo-tools/basic-seo
 [metadata]
@@ -73,10 +73,10 @@ mastodon = "" # Your verification code
 # cookies
 # cookies module: https://github.com/gethugothemes/hugo-modules/tree/master/components/cookie-consent
 [cookies]
-enable = false
+enable = true
 expire_days = 60
-content = "This site uses cookies. By continuing to use this website, you agree to their use."
+content = "Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen."
-button = "I Accept"
+button = "Verstanden"
 
 ######################## sidebar widgets #########################
 [widgets]

content/german/_index.md

@@ -1,87 +1,62 @@
----
++++
-# Hero Slider
+title = 'Home'
-heroslider:
++++
-  - title: "Willkommen auf unserer Homepage!"
-    image: "startseite/startseite-slide.jpg"
-  - title: "Gemeinsam neue Wege gehen."
-    image: "startseite/startseite-slide-2.jpg"
-  - title: "Administration optimieren, Zeit gewinnen."
-    image: "startseite/startseite-slide-3.jpg"
 
-# Key Features
+{{% section %}}
+{{% columns %}}
 
-keyfeatures:
+{{% columns %}}
-  - icon:     "car"
-    color:    "lime-300"
-    textcolor: "black"
-    title:    "Freiberufliche Pflegefachpersonen"
-    content:  "Die Applikation **VeruA ** Verwaltung & Abrechnung** unterstützt Sie bei Anamnese, Planung, Dokumentation und Abrechnung in der ambulanten Pflege. <br><br>VeruA ist optimiert für den Einsatz in einer Einzelperson-Version oder für Teams, die gemeinsam Klienten betreuen und sich gegenseitig Einsicht in die Pflegedokumentation ermöglichen wollen."
-  - icon:     "users"
-    color:    "slate-800"
-    textcolor: "white"
-    title:    "Spitex-Organisationen"
-    content: "Vereinfachen Sie die Dokumentation, Administration und Abrechnung in Ihrer Spitex-Organisation mit der Applikation **VeruA ** Verwaltung & Abrechnung.** <br><br>
 
-    Unser Angebot richtet sich besonders an Organisationen, die eine schlanke und kostengünstige Applikation suchen und auf guten Support nicht verzichten wollen. <br><br> Bedarfsermittlungen mit **interRAI** erstellen?  <br><br> **Kein Problem!**  <br><br>Seit dem ersten Quartal 2020 bieten wir Ihnen die **Schnittstelle zum Perigon interRAI Cloud** an."
+#### Title 1
-  - icon:     "bank"
-    color:    "white"
-    textcolor: "black"
-    title:    "Kantonale Abrechnung"
-    content: "In der Vielfalt der kantonalen Abrechnungen und Bestimmungen stehen wir Ihnen zur Seite.  <br><br>Wir setzen die kantonalen Vorgaben für Sie um und unterstützen Sie mit diversen Export-Funktionen und Auswertungen.  <br><br>
-    [ERFAHREN SIE MEHR ...](/#)
-"
 
-# Features
+Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.
-featureslead:
-  headline: "Das Werkzeug für die ambulante Pflege"
-  subline:  "VeruA ** Verwaltung & Abrechnung"
-  content:  "**VeruA ** Verwaltung** & Abrechnung ist ein Werkzeug für Klientenmanagement, Planung, Dokumentation, Abrechnung und Statistik im Bereich ambulante Pflege. <br><br>Die für den ambulanten Einsatz optimierten Funktionen gewährleisten einen ökonomischen Einsatz aller unternehmerischen Ressourcen – sowohl für Spitex-Organisationen als auch für freiberufliche Pflegefachpersonen. <br><br>Die als Webseite angelegte Programmoberfläche macht die Bedienung besonders einfach und intuitiv."
 
-features: 
-  - headline:   "Headline"
-    subline:    "subline" 
-    icon:       "user"
-    content:    "Vom stillen welt wohl euch froher weiten um. Mein bringt gezeigt es irrt. Mich irren zerstoben mein tage lebt und."
 
-# TODO Get rid of this stuff
-# features:
-#   - title: "What's Included in Hugoplate"
-#     image: "/images/service-1.png"
-#     content: "Hugoplate is a comprehensive starter template that includes everything you need to get started with your Hugo project. What's Included in Hugoplate"
-#     bulletpoints:
-#       - "10+ Pre-build pages"
-#       - "95+ Google Pagespeed Score"
-#       - "Build with Hugo and TailwindCSS for easy and customizable styling"
-#       - "Fully responsive on all devices"
-#       - "SEO-optimized for better search engine rankings"
-#       - "**Open-source and free** for personal and commercial use"
-#     button:
-#       enable: false
-#       label: "Get Started Now"
-#       link: "#"
 
-#   - title: "Discover the Key Features Of Hugo"
+..column..
-#     image: "/images/service-2.png"
+
-#     content: "Hugo is an all-in-one web framework for building fast, content-focused websites. It offers a range of exciting features for developers and website creators. Some of the key features are:"
+#### Title 2
-#     bulletpoints:
+
-#       - "Zero JS, by default: No JavaScript runtime overhead to slow you down."
+Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
-#       - "Customizable: Tailwind, MDX, and 100+ other integrations to choose from."
+
-#       - "UI-agnostic: Supports React, Preact, Svelte, Vue, Solid, Lit and more."
+
-#     button:
+
-#       enable: true
+{{% /columns %}}
-#       label: "Get Started Now"
+
-#       link: "https://github.com/zeon-studio/hugoplate"
+..column..
+
+
+#### Title 2
+
+Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
+
+..column..
+
+{{% columns %}}
+
+#### Title 1
+
+Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.
+
+
+
+..column..
+
+#### Title 2
+
+Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
+
+..column..
+
+#### Title 2
+
+Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
+
+
+
+{{% /columns %}}
+
+{{% /columns %}}
+{{% /section %}}
+
 
-#   - title: "The Top Reasons to Choose Hugo for Your Hugo Project"
-#     image: "/images/service-3.png"
-#     content: "With Hugo, you can build modern and content-focused websites without sacrificing performance or ease of use."
-#     bulletpoints:
-#       - "Instantly load static sites for better user experience and SEO."
-#       - "Intuitive syntax and support for popular frameworks make learning and using Hugo a breeze."
-#       - "Use any front-end library or framework, or build custom components, for any project size."
-#       - "Built on cutting-edge technology to keep your projects up-to-date with the latest web standards."
-#     button:
-#       enable: false
-#       label: ""
-#       link: ""
----

themes/hugoplate/layouts/_default/baseof.html

@@ -26,6 +26,7 @@
 
       <!-- tailwind size indicator -->
       {{ partial "components/tw-size-indicator.html" . }}
+      {{ partial "testPartial" . }}
     {{ end }}
 
 

themes/hugoplate/layouts/index.html

@@ -1,5 +1,6 @@
 {{/*  Home Template File  */}}
 {{ define "main" }}
+{{ .Content }}
   <!-- Hero Slider -->
     <section class="hero-slider h-screen md:h-[750px]">
       <div class="verua-slider-wrapper">
@@ -55,7 +56,7 @@
     <section class="lg:container lg:mx-auto relative flex flex-col justify-between items-center lg:flex-row lg:items-center lg:-mt-[250px]">
       {{ range $i, $e:= .Params.keyfeatures }}
         
-          <div class="w-full flex-1 lg:mt-8 p-8 lg:m-4 shadow-xl lg:rounded-3xl {{ with .color }} bg-{{ . }} {{ end }} {{ with .textcolor }} text-{{ . }} {{ end }}">
+          <div class="w-full flex-1 lg:mt-8 p-8 lg:m-4 lg:shadow-xl lg:rounded-3xl {{ with .color }} bg-{{ . }} {{ end }} {{ with .textcolor }} text-{{ . }} {{ end }}">
           {{/*  <div class="flex-shrink-0 relative {{ with .color }} bg-{{ . }} {{ end }} m-6 {{ with .textcolor }} text-{{ . }} {{ end }} -mt-[250px] overflow-hidden rounded-lg max-w-96 shadow-lg p-8">  */}}
         
           {{ with .icon }}
@@ -74,15 +75,35 @@
     </section>
 <!-- /Key Features -->
 <!-- Features -->
-{{ with .Params.featureslead }}
+<div class="lg:container items-center grid grid-cols-8 gap-4">
+
+  <!-- Column -->
+  <div class="col-span-8 	md:col-span-4">
+    {{ with .Params.featureslead }}
     <section>
       <div class="container">
         <div class="row">
-          {{ partial "components/IconHeaderSubheaderText" (dict "icon" .icon "headline" .headline "subline" .subline "text" .content) }}
+          {{ partial "components/iconheadersubheadertext" . }}
         </div>
       </div>
     </section>
-{{ end }}
+    {{ end  }}
+  </div>
+
+  <!-- Column -->
+  <div class="grid grid-cols-2 col-span-8 gap-4 md:col-span-4">
+    {{ range $i, $e:= .Params.features }}
+
+      <div class="col-span-2 	 md:col-span-1">
+        {{ partial "components/iconheadersubheadertext" . }}
+      </div>
+
+    {{ end }}
+  
+  </div>
+
+</div>
+
 <!-- /Features -->
   <!-- Testimonials -->
   {{ with site.GetPage "sections/testimonial" }}

themes/hugoplate/layouts/partials/components/IconHeaderSubheaderText.html

@@ -1,18 +0,0 @@
-{{ define "IconHeaderSubheaderText" }}
-<div class="flex items-center space-x-4">
-  {{ with .icon }}
-  <i class="fas fa-{{ . }} fa-fw text-5xl text-primary py-10"></i>
-  {{ end }}
-  <div>
-    {{ with .headline }}
-    <h2 class="text-xl font-bold">{{ . }}</h2>
-    {{ end }}
-    {{ with .subline }}
-    <h3 class="text-lg text-gray-500">{{ . }}</h3>
-    {{ end }}
-    {{ with .text }}
-    <p class="text-base text-gray-700">{{ . }}</p>
-    {{ end }}
-  </div>
-</div>
-{{ end }}

themes/hugoplate/layouts/partials/components/iconheadersubheadertext.html

@@ -0,0 +1,14 @@
+<div class="iconheadersubheadertext">
+    {{ with .icon }}
+    <i class="fas fa-{{ . }} fa-fw text-5xl text-primary py-10"></i>
+    {{ end }}
+    {{ with .subline }}
+    <h3 class="text-primary pb-5">{{ . }}</h3>
+    {{ end }}
+    {{ if .headline }}
+    <h2 class="font-bold pb-5  {{ if eq .smallheadline true }} text-2xl {{ end }} ">{{ .headline }}</h2>
+    {{ end }}
+    {{ with .content | markdownify }}
+    <p class="text-base text-gray-700">{{ . }}</p>
+    {{ end }}
+</div>

themes/hugoplate/layouts/partials/testPartial.html

@@ -0,0 +1,3 @@
+{{ define "testPartial" }}
+<p>Dies ist ein Test-Partial.</p>
+{{ end }}

themes/hugoplate/layouts/shortcodes/columns.html

@@ -0,0 +1,7 @@
+<div class="flex p-4">
+{{ range split .Inner "..column.." }}
+{{ printf "<div class=\" markdown-inner  flex-1 px-4 \">"| safeHTML }}
+{{ .  | safeHTML }}
+{{ printf "</div>" | safeHTML }}
+{{ end }}
+</div>

themes/hugoplate/layouts/shortcodes/section.html

@@ -0,0 +1,4 @@
+<div class="container">
+{{ .Inner }}
+</div>
+