unterhaufen + ui

assets/scss/_common.scss

@@ -445,4 +445,15 @@ details[open] summary {
 
 .content-justify {
   text-align: justify;
+}
+
+.fb-tile-color {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 195px;
+}
+
+.fb-tile-icon {
+  font-size: 96px;
 }

config.yml

@@ -7,6 +7,7 @@ defaultContentLanguage: de
 enableEmoji: true
 enableRobotsTxt: true
 timeZone: Europe/Berlin
+removePathAccents: true
 markup:
   defaultMarkdownHandler: goldmark
   goldmark:

content/german/superhaufen/30-jahre-gcg.md

@@ -1,32 +0,0 @@
----
-title: 30-jähriges Jubiläum
-draft: "false"
-bg_image: /media/backgrounds/page-title.webp
-description: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
-image: /media/image.webp
-type: superhaufen
-gallery: false
-tiles:
-    - title: Lorem-1
-      image: /media/image.webp
-      bg_color: \#990000
-      icon: mdi mdi-pillar
-      font_color: white
-      content: |
-        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
-    - title: Lorem-2
-      image: /media/image.webp
-      bg_color: \#99ffff
-      icon: mdi mdi-head-cog-outline
-      font_color: black
-      content: |
-        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
-    - title: Lorem-3
-      image: /media/image.webp
-      bg_color: \#cc9966
-      icon: mdi mdi-fireplace
-      font_color: black
-      content: |
-        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
----
-Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam

content/german/superhaufen/_index.md

@@ -2,6 +2,5 @@
 title: Superhaufen
 draft: false
 bg_image: media/backgrounds/page-title.webp
-description: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
+description: null
-type: "superhaufen"
 ---

layouts/_default/superhaufen.html

@@ -0,0 +1,7 @@
+<div class="card border-primary rounded-0 hover-shadow mb-5">
+    <div class="card-body">
+      <h4 class="card-title"><a href="{{ .Permalink }}">{{ .Title | truncate 20 }}</a></h4>
+      <a href="{{ .Permalink }}" class="btn btn-primary btn-sm">{{ i18n "show_more"}}</a>
+    </div>
+</div>
+  

layouts/schulchronik/single.html

@@ -35,8 +35,8 @@
         {{ $topics = $topics | append (slice (slice .Params.Title 200)) }}
         {{ end }}
         {{ range .Params.topics }}
-          {{ if .superhaufen }}
+          {{ if .superhaufen.enable }}
-          {{ $topics  = $topics | append (slice (slice .title 30 .superlink  "superhaufen" )) }}
+          {{ $topics  = $topics | append (slice (slice .title 30 (.superhaufen.link | urlize)  "superhaufen" )) }}
           {{ else }}
           {{ $topics  = $topics | append (slice (slice .title 30 (md5 .title) )) }}
           {{ end }}
@@ -49,7 +49,7 @@
               click: function (item) {
                 if (item[1] != 200 || (item[1] == 200 && item[2] == "pretext")) {
                   if( item[3] == "superhaufen" ) {
-                    window.location.href = "/superhaufen/" + item[2];
+                    window.location.href = "{{ `/superhaufen/` | relLangURL }}" + item[2];
                   } else {
                    $('#' + item[2]).modal('show');
                   }

layouts/superhaufen/list.html

@@ -5,7 +5,7 @@
 		<div class="row">
 			{{ range .Data.Pages }}
 				<div class="col-lg-4 col-sm-6">
-				{{ .Render "fach" }}
+				{{ .Render "superhaufen" }}
 				</div>
 			{{ end }}
 		</div>

layouts/superhaufen/single.html

@@ -24,6 +24,18 @@
               <div class="content">
                 {{ .content | markdownify }}
               </div>
+              {{ range .unterhaufen }}
+                <div class="container mb-0">
+                  <div class="card border-primary rounded-0 hover-shadow mb-5">
+                    <div class="card-body mb-0">
+                      <details class="mb-0">
+                      <summary class="mb-0">{{ .title }}</summary>
+                      <div class="content"><p class="content">{{ .content }}</p></div>
+                      </details>
+                    </div>
+                  </div>
+                </div>
+              {{ end }}
             </div>
           </div>
         </div>

static/schulchronik/admin/config.yml

@@ -136,6 +136,39 @@ collections:
       - {label: "Type", name: "type", widget: "hidden", default: "cantorpreis"}
       - {label: "Gallerie-Komponente", name: "gallery", widget: "boolean", default: false, required: false, hint: "Benötigt für Gallerie bzw. Bildeinbettung"}
       - {label: "Text", name: "body", widget: "markdown", required: false}
+  - name: "superhaufen"
+    icon: "superhaufen"
+    label: "Superhaufen"
+    label_singular: "Superhaufen"
+    folder: "content/german/superhaufen"
+    filter: {field: "type", value: "superhaufen"}
+    create: true
+    editor:
+      preview: false
+    media_folder: '/static/media/schulchronik/superhaufen'
+    public_folder: '/media/schulchronik/superhaufen'
+    fields:
+      - {label: "Titel", name: "title", widget: "string"}
+      - {label: "Entwurf", name: "draft", widget: "boolean", default: false, required: false}
+      - {label: "Hintergrundbild", name: "bg_image", widget: "hidden", default: "/media/backgrounds/page-title.webp"}
+      - {label: "Type", name: "type", widget: "hidden", default: "superhaufen"}
+      - label: "Kacheln"
+        name: "tiles"
+        widget: "list"
+        required: false
+        fields:
+          - {label: "Titel", name: "title", widget: "string", required: true}
+          - {label: "Hintergrundfarbe", name: "bg_color", widget: "color", required: true}
+          - {label: "Symbol", name: "icon", widget: "string", required: true}
+          - {label: "Symbolfarbe", name: "font_color", widget: "color", required: true}
+          - {label: "Inhalt", name: "content", widget: "markdown", required: true}
+          - label: "Unter-Unterhaufen"
+            name: "unterhaufen"
+            widget: "list"
+            required: false
+            fields:
+              - {label: "Titel", name: "title", widget: "string", required: false}
+              - {label: "Inhalt", name: "content", widget: "markdown", required: true}
   - name: "schulchronik"
     icon: "pillar"
     label: "Schulchronik"
@@ -156,10 +189,24 @@ collections:
       - label: "Kreative Haufen"
         name: "topics"
         widget: "list"
+        required: false
         fields:
           - {label: "Titel", name: "title", widget: "string", required: true}
           - {label: "Inhalt", name: "content", widget: "markdown", required: true}
-        required: false
+          - label: "Superhaufen"
+            name: "superhaufen"
+            widget: "object"
+            required: false
+            fields:
+              - {label: "Aktiviert", name: "enable", widget: "boolean", required: false}
+              - label: "Superhaufen"
+                name: "link"
+                widget: "relation"
+                collection: "superhaufen"
+                search_fields: ["title"]
+                value_field: "title"
+                required: false
+                collapsed: true
       - label: "Cantorpreisträger"
         name: "cantorpreisträger"
         widget: "relation"

static/schulchronik/admin/index.html

@@ -21,7 +21,7 @@
       CMS.init();
     </script>
     <script id="icons">
-      var icons = [['settings', 'mdi mdi-cog-outline'], ['user', 'mdi mdi-fountain-pen-tip'], ['page', 'mdi mdi-file-document-outline'], ['page-add', 'mdi mdi-file-document-plus-outline'], ['document', 'mdi mdi-file-document-multiple-outline'], ['news', 'mdi mdi-newspaper'], ['award', 'mdi mdi-seal-variant'], ['group', 'mdi mdi-crowd'], ['trophy', 'mdi mdi-trophy-outline'], ['pi', 'mdi mdi-pi-box'], ['pillar', 'mdi mdi-pillar'], ['graduation-cap', 'mdi mdi-school-outline'], ['help', 'mdi mdi-lifebuoy'], ['dash', 'mdi mdi-monitor-dashboard'], ['presentation', 'mdi mdi-presentation']];
+      var icons = [['settings', 'mdi mdi-cog-outline'], ['user', 'mdi mdi-fountain-pen-tip'], ['page', 'mdi mdi-file-document-outline'], ['page-add', 'mdi mdi-file-document-plus-outline'], ['document', 'mdi mdi-file-document-multiple-outline'], ['news', 'mdi mdi-newspaper'], ['award', 'mdi mdi-seal-variant'], ['group', 'mdi mdi-crowd'], ['trophy', 'mdi mdi-trophy-outline'], ['pi', 'mdi mdi-pi-box'], ['pillar', 'mdi mdi-pillar'], ['graduation-cap', 'mdi mdi-school-outline'], ['help', 'mdi mdi-lifebuoy'], ['dash', 'mdi mdi-monitor-dashboard'], ['presentation', 'mdi mdi-presentation'], ['superhaufen', 'mdi mdi-view-dashboard']];
       icons.forEach(icon => {
         CMS.registerIcon(icon[0], ({}) => { return(h('i', {className: icon[1] + " icon-md"})); });
       });