added my own plugins and blueprints for structure, also files bp's and tabs, etc

www/site/blueprints/blocks/pinned-image.yml

@@ -8,6 +8,8 @@ fields:
     type: files
     max: 1
     required: true
+    uploads: image
+    query: page.images
   text:
     label: Scrolling Text
     type: writer

www/site/blueprints/blocks/pinned-text.yml

@@ -14,3 +14,5 @@ fields:
     label: Background Image
     type: files
     max: 1
+    uploads: image
+    query: page.images

www/site/blueprints/files/default.yml

+title: Default Image
+
+accept:
+  mime: image/*
+  type: image
+  maxsize: 6000000
+
+fields:
+  alt:
+    label: Alt Text
+    help: Erscheint wenn das Bild nicht geladen werden kann und/oder wird von Screen-Readern vorgelesen.
+    type: text
+    width: 1/2
+  caption:
+    help: Bildlegende
+    label: Caption
+    type: textarea
+    width: 1/2

www/site/blueprints/files/document.yml

+title: Dokument
+
+accept:
+  type: document, archive
+  maxsize: 15000000
+
+fields:
+  infocomplete:
+    label: External Link
+    type: info
+    text: '{{file.previewUrl}}'
+  inforelative:
+    label: Local Link
+    type: info
+    text: '/{{file.id}}'
\ No newline at end of file

www/site/blueprints/files/image.yml

+title: Bild
+
+accept:
+  mime: image/*
+  type: image
+  #extension: jpg, png
+  maxsize: 8000000
+create:
+  width: 3000
+  height: 3000
+  crop: false
+
+fields:
+  alt:
+    label: Alternativer Text
+    type: text
+    width: 1/2
+    help: Erscheint wenn das Bild nicht geladen werden kann und/oder wird von Screen-Readern vorgelesen.
+  caption:
+    label: Caption
+    help: Bildlegende
+    type: writer
+    inline: true
+    width: 1/1
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear

www/site/blueprints/files/mp3.yml

+title: MP3
+
+accept:
+  extension: mp3
+  maxsize: 10000000
+
+fields:
+  title:
+    type: text 
+    label: Beschriftung
+  subtitle:
+    type: text
+    label: Subheadline
+  description:
+    type: writer
+    icon: text
+    inline: true
+    label: Beschreibung
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+  transcript:
+    type: writer
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+    icon: text
+    label: Transkript
+
+  # controls:
+  #   type: toggle
+  #   text: Controls zeigen?
+  #   width: 1/2
+  #   default: true
+  # autoplay:
+  #   type: toggle
+  #   text: Autoplay
+  #   width: 1/2
+  #   default: false

www/site/blueprints/files/siteimage.yml

+title: Bild (Site)
+
+accept:
+  mime: image/*
+  type: image
+  #extension: jpg, png
+  maxsize: 8000000
+
+create:
+  width: 2000
+  height: 1440
+  crop: false
+
+fields:
+  alt:
+    label: Alternative Text
+    type: text
+    width: 1/2
+    help: Erscheint wenn das Bild nicht geladen werden kann und/oder wird von Screen-Readern vorgelesen.
+  caption:
+    label: Caption
+    help: Bildlegende
+    type: writer
+    inline: true
+    width: 1/1
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
\ No newline at end of file

www/site/blueprints/files/video.yml

+title: Video
+
+accept:
+  extension: mp4
+  type: video
+  maxsize: 32000000
+
+fields:
+  alt:
+    label: Alt Text
+    help: Erscheint wenn das Video nicht geladen werden kann und/oder wird von Screen-Readern vorgelesen.
+    type: text
+    width: 1/2
+  caption:
+    label: Caption
+    help: Reguläre, visuelle Videolegende
+    type: writer
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+    inline: true
+    width: 1/2
+  poster:
+    label: field.blocks.video.poster
+    type: files
+    translate: false
+    query: file.parent.getmixedimages
+    multiple: false
+    image:
+      back: black
+    uploads: image
+  description:
+    label: Beschreibung (für Accessibility)
+    type: writer
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+    inline: true
+    help: Eine Art Zusammenfassung. Wird vom ScreenReader erkannt und vorgelesen.
+
+  autoplay:
+    label: field.blocks.video.autoplay
+    type: toggle
+    width: 1/3
+    translate: false
+  muted:
+    label: field.blocks.video.muted
+    type: toggle
+    width: 1/3
+    default: true
+    translate: false
+  loop:
+    label: field.blocks.video.loop
+    type: toggle
+    width: 1/3
+    translate: false
+  controls:
+    label: field.blocks.video.controls
+    type: toggle
+    width: 1/3
+    default: true
+    translate: false
+  preload:
+    label: field.blocks.video.preload
+    type: select
+    width: 2/3
+    default: auto
+    translate: false
+    options:
+      - auto
+      - metadata
+      - none
+
+  h_a11yline:
+    type: line
+  h_a11yheader:
+    type: headline
+    label: Extra Accessibility-Dateien für Player
+
+  # vtt
+  vtt_description_de:
+    label: Audiobeschreibung (de)
+    type: files
+    multiple: false
+    max: 1
+    help: Für **blinde** Menschen. Wird vom ScreenReader automatisch gesehen (Audio-Beschreibung synchron zum Video).
+    uploads: document
+    query: file.parent.files.filterBy('template', 'document')
+    width: 1/2
+    translate: false
+  vtt_description_en:
+    label: Audiobeschreibung (en)
+    type: files
+    multiple: false
+    max: 1
+    help: Für **blinde** Menschen. Wird vom ScreenReader automatisch gesehen (Audio-Beschreibung synchron zum Video).
+    uploads: document
+    query: file.parent.files.filterBy('template', 'document')
+    width: 1/2
+    translate: false
+
+  # vtt_description_lang:
+  #   label: Sprache - Beschreibung in Video
+  #   type: select
+  #   options:
+  #     - de
+  #     - en
+
+  vtt_description_label_de:
+    label: Label im Video-Player (de) - Audiobeschreibung in Video
+    type: text
+    width: 1/2
+    translate: false
+  vtt_description_label_en:
+    label: Label im Video-Player (en) - Audiobeschreibung in Video
+    type: text
+    width: 1/2
+    translate: false
+
+  vtt_line_1:
+    type: line
+
+  vtt_captions_de:
+    label: Untertitel (de)
+    type: files
+    multiple: false
+    max: 1
+    help: Für **taube** Menschen. Wird im Videoplayer automatisch geladen.
+    uploads: document
+    query: file.parent.files.filterBy('template', 'document')
+    width: 1/2
+    translate: false
+  vtt_captions_en:
+    label: Untertitel (en)
+    type: files
+    multiple: false
+    max: 1
+    help: Für **taube** Menschen. Wird im Videoplayer automatisch geladen.
+    uploads: document
+    query: file.parent.files.filterBy('template', 'document')
+    width: 1/2
+    translate: false
+
+  # vtt_captions_lang:
+  #   label: Sprache - Captions
+  #   type: select
+  #   options:
+  #     - de
+  #     - en
+
+  vtt_captions_label_de:
+    label: Label im Video-Player (de) - Captions
+    type: text
+    width: 1/2
+    translate: false
+  vtt_captions_label_en:
+    label: Label im Video-Player (en) - Captions
+    type: text
+    width: 1/2
+    translate: false
+
+  # vtt_line_2:
+  #   type: line
+
+  # vtt_subtitles:
+  #   label: Untertitel
+  #   type: files
+  #   multiple: false
+  #   max: 1
+  #   help: Für Nicht-Muttersprachler. Nur 1 Track ist hier erlaubt, es wird empfohlen Englisch zu verwenden. Wird im Videoplayer automatisch geladen (Untertitel).
+  #   uploads: document
+  #   query: file.parent.files.filterBy('template', 'document')
+
+  # vtt_subtitles_lang:
+  #   label: Sprache - Untertitel
+  #   type: text
+
+  # vtt_subtitles_label:
+  #   label: Titel - Untertitel
+  #   type: text

www/site/blueprints/files/zip.yml

+title: Zip
+
+accept:
+  extension: zip
+  maxsize: 32000000

www/site/blueprints/pages/chapter.yml

@@ -3,6 +3,7 @@ title: Chapter
 tabs:
   content:
     label: Content
+    icon: document
     fields:
       part:
         label: Part
@@ -63,3 +64,8 @@ tabs:
           - pinned-text
           - pinned-image
 
+  # gallery tab
+  gallery: tabs/galleryTab
+
+  # kirby seo
+  seo: tabs/seo

www/site/blueprints/sections/files.yml

+  type: files
+  headline: Media library
+  
+  layout: cards
+
+  text: "{{ file.filename }}"
+  empty: Bitte laden Sie hier Bilder für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
+  help: max. 8MB
+
+  image:
+    back: white
+    ratio: 4/3
+    size: small
\ No newline at end of file

www/site/blueprints/sections/filesdocs.yml

+type: files
+template: document
+headline: Dokumente
+
+layout: list
+
+text: "{{ file.filename }}"
+empty: Bitte laden Sie hier Dokumente für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
+help: max. 15MB
+limit: 6

www/site/blueprints/sections/filesimages.yml

+type: files
+template: image
+headline: Bilder
+
+layout: cardlets
+
+#info: "{{ file.caption.safeHtml }}"
+text: "{{ file.filename }}"
+empty: Bitte laden Sie hier Bilder für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
+help: max. 8MB – Die lange Seite der Bilder wird auf maximal 3000px automatisch verkleinert.
+limit: 18
+
+
+# image:
+#   back: white
+#   ratio: 4/3
+#   size: small

www/site/blueprints/sections/filessounds.yml

+type: files
+template: mp3
+headline: Audio
+
+layout: cardlets
+
+text: "{{ file.filename }}"
+empty: Bitte laden Sie hier MP3 für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
+help: max. 10MB
+limit: 18
+
+
+# image:
+#   back: white
+#   ratio: 4/3
+#   size: small

www/site/blueprints/sections/filesvideos.yml

+type: files
+template: video
+headline: Videos
+
+layout: cardlets
+
+text: "{{ file.filename }}"
+empty: Bitte laden Sie hier Videos für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
+help: max. 32MB
+limit: 18
+
+# image:
+#   back: white
+#   ratio: 4/3
+#   size: small

www/site/blueprints/sections/fileszips.yml

+type: files
+template: zip
+headline: Zips
+
+layout: list
+
+#info: "{{ file.caption.safeHtml }}"
+text: "{{ file.filename }}"
+empty: Bitte laden Sie hier ZIP-Dateien für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
+help: max. 32MB
+limit: 6
+
+
+# image:
+#   back: white
+#   ratio: 4/3
+#   size: small

www/site/blueprints/tabs/___seo.yml

+label: seo.tabs.seo
+icon: search
+
+columns:
+  headings:
+    width: 3/4
+    sections:
+      headings:
+        type: heading-structure
+  information:
+    width: 1/4
+    sections:
+      infoheadings:
+        type: fields
+        fields:
+          infoheadings:
+            type: info
+            label: "Zu der Überschriftenstruktur:"
+            text: Hier können Sie überprüfen, ob die Hierarchie der Headlines dieser Seite richtig strukturiert ist
+  main:
+    width: 7/12
+    fields:
+      metaGroup: seo/fields/meta-group
+      ogGroup: seo/fields/og-group
+      robots: seo/fields/robots
+      metaInherit:
+        label: seo.fields.inheritSettings.label
+        type: multiselect
+        help: seo.fields.inheritSettings.help
+        options:
+          metaTemplate:
+            "*": seo.fields.metaTitleTemplate.label
+          metaDescription:
+            "*": seo.fields.metaDescription.label
+          ogTemplate:
+            "*": seo.fields.ogTitleTemplate.label
+          ogDescription:
+            "*": seo.fields.ogDescription.label
+          ogImage:
+            "*": seo.fields.ogImage.label
+          cropOgImage:
+            "*": seo.fields.cropOgImage.label
+          robots:
+            "*": seo.fields.robots.label
+  sidebar:
+    width: 5/12
+    sticky: true
+    sections:
+      seoPreview:
+        type: seo-preview

www/site/blueprints/tabs/galleryTab.yml

+label: Uploads dieser Seite
+icon: upload
+
+sections:
+  imgs:
+    extends: sections/filesimages
+  vids:
+    extends: sections/filesvideos
+  mp3s:
+    extends: sections/filessounds
+  docs:
+    extends: sections/filesdocs

www/site/blueprints/tabs/galleryTabSite.yml

+label: Globale Uploads
+icon: upload
+
+sections:
+  imgs:
+    extends: sections/filesimages
+    limit: 50
+    empty: Bitte laden Sie hier Bilder hoch. Diese können überall verwendet werden.
+  # vids:
+  #   extends: sections/filesvideos
+  #   empty: Bitte laden Sie hier Videos hoch. Diese können überall verwendet werden.
+  # mp3s:
+  #   extends: sections/filessounds
+  # docs:
+  #   extends: sections/filesdocs

www/site/blueprints/tabs/seo.yml

+extends: seo/page
+columns:
+  sidebar:
+    width: 1/4
+    sections:
+      quickfields:
+        type: fields
+        fields:
+          dividerline:
+            type: line
+      headings:
+        type: heading-structure

www/site/plugins/scd-blocks-factory/blueprints/blocks/accordion.yml

+name: field.blocks.accordion.name
+icon: template
+fields:
+  heading:
+    label: Section Heading
+    type: writer
+    inline: true
+    marks: false
+    placeholder: Accordion headline... (optional)
+  level:
+    label: field.blocks.heading.level
+    type: select
+    empty: false
+    default: "h2"
+    width: 1/6
+    options:
+      - h1
+      - h2
+      - h3
+      - h4
+      - h5
+      - h6
+  group:
+    label: Group elements?
+    type: toggle
+    default: no
+    help: If individual, all elements can stay open at the same time.
+  elements:
+    label: Elements
+    type: blocks
+    fieldsets:
+      - accordion_element
\ No newline at end of file

www/site/plugins/scd-blocks-factory/blueprints/blocks/accordion_element.yml

+name: field.blocks.accordion_element.name
+icon: bars
+fields:
+  summary:
+    label: Button text
+    type: writer
+    marks: false
+    placeholder: Button text...
+  details:
+    label: Accordion text
+    type: writer
+    placeholder: Enter accordion text...
+    marks: true
\ No newline at end of file

www/site/plugins/scd-blocks-factory/blueprints/blocks/audio.yml

+name: Audio
+icon: file-audio
+
+fields:
+  source:
+    type: files
+    label: Datei
+    query: page.getmixedaudios
+    uploads: mp3
+    multiple: false
+  title:
+    type: text 
+    label: Beschriftung
+  subtitle:
+    type: text
+    label: Subheadline
+  description:
+    type: writer
+    icon: text
+    inline: true
+    label: Beschreibung
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+  transcript:
+    type: writer
+    icon: text
+    label: Transkript
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+
+  controls:
+    type: toggle
+    text: Controls zeigen?
+    width: 1/2
+    default: true
+  autoplay:
+    type: toggle
+    text: Autoplay
+    width: 1/2
+    default: false

www/site/plugins/scd-blocks-factory/blueprints/blocks/button.yml

+name: field.blocks.button.name
+icon: angle-right
+fields: 
+  btn_label:
+    type: text
+    label:
+      de: Button Beschriftung
+      en: Button label
+  linkage:
+    type: link
+    label:
+      en: Select link ...
+      de: Link auswählen ...
+  target:
+    type: toggle
+    label:
+      de: Im neuen Fenster?
+      en: In new window?

www/site/plugins/scd-blocks-factory/blueprints/blocks/card.yml

+name: field.blocks.card.name
+icon: image
+fields: 
+  link:
+    type: url
+    label: URL
+  image:
+    label: Image
+    type: files
+    uploads: image
+  heading:
+    label: Heading
+    inline: true
+    marks: false
+    type: writer
+    placeholder: Card headline...
+  text:
+    label: Text
+    type: writer
+    marks: false
+    inline: true
+    placeholder: Text...
\ No newline at end of file

www/site/plugins/scd-blocks-factory/blueprints/blocks/downloaditem.yml

+name: Link Element
+icon: download
+wysiwyg: true
+preview: fields
+fields:
+  link:
+    type: link
+    label: Link
+    width: 1/2
+    options:
+      - file
+      - url
+      - email
+      - tel
+  target:
+    type: toggle
+    width: 1/4
+    default: true
+    label: Im neuen Fenster?
+  icon:
+    type: toggles
+    default: download
+    columns: 5
+    width: 1/2
+    labels: false
+    # values are lucide values
+    options:
+      - value: download
+        text: Download
+        icon: download
+      - value: external-link
+        text: External
+        icon: open
+      - value: phone
+        text: Telefon
+        icon: phone
+      - value: mail
+        text: Email
+        icon: email
+      - value: map-pin
+        text: Map-Pin
+        icon: pin
+
+  linkText:
+    type: text
+    label: Label
+    width: 1/2
+    help: Für Accessibility bitte deskriptiv genug sein.
+  

www/site/plugins/scd-blocks-factory/blueprints/blocks/gridbox.yml

+name: Grid box
+icon: grid
+preview: fields # required
+wysiwyg: true # recommended
+
+fields:
+  headline:
+    type: writer
+    placeholder: Headline ...
+    width: 1/2
+  text:
+    type: writer
+    placeholder: Text ...
+    width: 1/2
+  txtcolor:
+    extends: fields/colorpicker
+    label: Text colour
+    translate: true
+    width: 1/4
+  bgcolor:
+    extends: fields/colorpicker
+    label: BG Colour
+    translate: true
+    width: 1/4
+  align:
+    label: Text align
+    type: select
+    default: "text-left"
+    translate: true
+    width: 1/4
+    options:
+      "text-left": Left
+      "text-center": Center
+      "text-right": Right
+      "text-justify": Justified-Left
+      "text-justify-right": Justified-Right
+  image:
+    extends: fields/simpleimage
+    label: BG image
+    width: 1/4
+
+  image_is_fake3d:
+    label: Has depth-map
+    type: toggle
+  image_depthmap:
+    label: Depth-map image
+    extends: fields/simpleimage
+    width: 1/5
+    whenQuery: image_is_fake3d = true
+  fake3d_focusx:
+    label: Focus X
+    type: range
+    step: 1
+    max: 100
+    min: 0
+    default: 50
+    width: 1/5
+    whenQuery: image_is_fake3d = true
+    help: Links = 0, Mitte = 50, Rechts = 100
+  fake3d_focusy:
+    label: Focus Y
+    type: range
+    step: 1
+    max: 100
+    min: 0
+    default: 50
+    width: 1/5
+    whenQuery: image_is_fake3d = true
+    help: Oben = 0, Mitte = 50, Unten = 100
+  fake3d_threshx:
+    label: Treshold X
+    type: range
+    step: 1
+    max: 100
+    min: 1
+    default: 50
+    width: 1/5
+    whenQuery: image_is_fake3d = true
+    help: Stärke des Effekts in X-Achse
+  fake3d_threshy:
+    label: Treshold Y
+    type: range
+    step: 1
+    max: 100
+    min: 1
+    default: 50
+    width: 1/5
+    whenQuery: image_is_fake3d = true
+    help: Stärke des Effekts in Y-Achse
+
+  imagealpha:
+    label: Image transparency
+    type: range
+    min: 0.05
+    step: 0.01
+    max: 1
+    default: 1
+    width: 1/4
+  gradient:
+    label: Better readability?
+    type: toggle
+    width: 1/4
+    help: Activates BG gradient and text-shadow
+  ratio:
+    label: Box ratio
+    type: select
+    placeholder: Auto
+    width: 1/4
+    options:
+      1/1: "1:1"
+      16/9: "16:9"
+      10/8: "10:8"
+      21/9: "21:9"
+      7/5: "7:5"
+      4/3: "4:3"
+      5/3: "5:3"
+      3/2: "3:2"
+      3/1: "3:1"
+  mobilecard:
+    type: toggle
+    label: As card for mobile?
+    width: 1/4
+  cta:
+    type: toggle
+    label: Activate CTA?
+  cta_link:
+    label: CTA Link
+    type: object
+    when:
+      cta: true
+    fields:
+      is_script:
+        type: toggle
+        label: Trigger Javascript?
+      callback:
+        type: text
+        label: Callback function name
+        help: please include brackets ()
+        when:
+          is_script: true
+      link:
+        type: link
+        when:
+          is_script: false
+      linkText:
+        type: text
+        label: Link Text
+      target:
+        type: toggle
+        text: Open in new window?
+        when:
+          is_script: false
+      classes:
+        type: text
+        label: CSS Classes

www/site/plugins/scd-blocks-factory/blueprints/blocks/heading.yml

+name: field.blocks.heading.name
+icon: title
+wysiwyg: true
+preview: heading
+fields:
+  level:
+    label: field.blocks.heading.level
+    type: toggles
+    empty: false
+    default: "h2"
+    labels: false
+    help: Headline-Level bzw Hierarchie
+    options:
+      - value: h1
+        icon: h1
+        text: H1
+      - value: h2
+        icon: h2
+        text: H2
+      - value: h3
+        icon: h3
+        text: H3
+      - value: h4
+        icon: h4
+        text: H4
+      - value: h5
+        icon: h5
+        text: H5
+      - value: h6
+        icon: h6
+        text: H6
+  text:
+    label: field.blocks.heading.text
+    type: writer
+    inline: true
+    placeholder: field.blocks.heading.placeholder
+  pre_class:
+    label: Vordefinierte CSS-Klassen
+    type: select
+    width: 1/2
+    help: Hilfreich um das Aussehen anzupassen ohne die Hierarchien zu brechen.
+    options:
+      meta: Meta-Headline
+      h1: H1 Aussehen
+      h2: H2 Aussehen
+      h3: H3 Aussehen
+      h4: H4 Aussehen
+  cssclass:
+    label: CSS-Klasse
+    width: 1/2
+    type: text
+    help: Evtl. extra Klasse (muss i.d.R. vom Designer implementiert werden)
+  cssid:
+    label: Element-ID
+    width: 1/2
+    type: slug
+    help: ID des Elements, meistens für Anchor-Links oder bestimmte Funktionalitäten (Letzteres muss i.d.R. vom Designer implementiert werden)
+  responsive_hide:
+    label: Responsives Verstecken
+    help: (optional)
+    type: select
+    options:
+      desktop: Nur auf Desktop anzeigen
+      mobile: Nur auf Mobile anzeigen
\ No newline at end of file

www/site/plugins/scd-blocks-factory/blueprints/blocks/image.yml

+name: field.blocks.image.name
+icon: image
+preview: image
+fields:
+  location:
+    label: field.blocks.image.location
+    type: radio
+    columns: 2
+    default: "kirby"
+    help: Hochgeladene Bilder aus dieser Website oder externe Bilder per URL
+    options:
+      kirby: "{{ t('field.blocks.image.location.internal') }}"
+      web: "{{ t('field.blocks.image.location.external') }}"
+  image:
+    type: files
+    multiple: false
+    width: 1/1
+    query: page.getmixedimages
+    uploads:
+      template: image
+    label: field.blocks.image.name
+    when:
+      location: kirby
+  src:
+    label: field.blocks.image.url
+    type: url
+    when:
+      location: web
+
+  # alt and caption
+  linetexts:
+    type: line
+  alt:
+    label: field.blocks.image.alt
+    type: text
+    icon: title
+    help: Überschreibt an dieser Stelle den eigentlichen Alt-Text, der in einem Bild definiert ist
+  caption:
+    label: field.blocks.image.caption
+    type: writer
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+    icon: text
+    inline: true
+    help: Bildbeschriftung unterhalb des Bildes, falls notwendig
+
+  # link
+  linelink:
+    type: line
+  linkactive:
+    label: Verlinkung aktivieren
+    type: toggle
+  link:
+    label: Link
+    type: link
+    icon: text
+    width: 2/3
+    help: Optional
+    when:
+      linkactive: true
+  link_desc:
+    label: Link Beschreibung
+    type: text
+    icon: text
+    width: 2/3
+    help: Optional für a11y
+    when:
+      linkactive: true
+  target_blank:
+    label: Link im neuen Fenster öffnen
+    type: toggle
+    width: 1/3
+    whenQuery: link
+    help: Optional
+    when:
+      linkactive: true
+
+  
+
+  # styling
+  linestyling:
+    type: line
+  cssclass:
+    type: text
+    label: CSS Klassen
+
+  ratio:
+    label: field.blocks.image.ratio
+    type: select
+    placeholder: Auto
+    width: 1/2
+    help: Beschränkt den Anzeigebereich des Bildes, z.B. in einem Format 16zu9. Das Bild kann dann entweder in diesem Bereich kleiner dargestellt werden, damit es rein passt, oder mit Hilfe des "Beschneiden"-Schalters abgeschnitten werden
+    options:
+      1/1: "1:1"
+      16/9: "16:9"
+      10/8: "10:8"
+      21/9: "21:9"
+      7/5: "7:5"
+      4/3: "4:3"
+      5/3: "5:3"
+      3/2: "3:2"
+      3/1: "3:1"
+  crop:
+    label: field.blocks.image.crop
+    type: toggle
+    width: 1/2
+    help: Schneidet ein Bild mit einem vorgegebenen Seitenverhältnis

www/site/plugins/scd-blocks-factory/blueprints/blocks/mainpage_navitem.yml

+name: field.blocks.mainpage_navitem.name
+label: "{{obj.headline}}"
+preview: fields # required
+wysiwyg: true # recommended
+fields:
+  obj:
+    label: Information
+    type: object
+    fields:
+      photo:
+        extends: fields/globalimage
+      headline:
+        label: Headline
+        type: text
+      btn_label:
+        label:
+          de: Button-Beschriftung
+          en: Button label
+        type: text
+      linkedPage:
+        type: pages
+        label:
+          de: Verlinkte Unterseite
+          en: Linked subpage
+        query: page.childrenAndDrafts.filterBy('intendedTemplate', 'type-button-based-sub')

www/site/plugins/scd-blocks-factory/blueprints/blocks/qrcodeblock.yml

+name: QR Code
+preview: fields # required
+wysiwyg: true # recommended
+fields:
+  customurl:
+    type: text
+    label: Custom URL
+
+  qrcode:
+    type: qrcode
+    title: "{{ block.callMethod(customurl) }}"
+    url: "{{ block.callMethod(customurl) }}"
+
+  qrlabel:
+    type: text
+    label: 
+      de: Beschriftung
+      en: Label
+
+

www/site/plugins/scd-blocks-factory/blueprints/blocks/spacing.yml

+name: field.blocks.audio.spacing
+icon: divider
+fields: 
+  size:
+    type: select
+    label: Größe
+    default: sm
+    options:
+      sm: Small
+      lg: Large

www/site/plugins/scd-blocks-factory/blueprints/blocks/styledtext.yml

+name: Custom Text
+icon: text
+wysiwyg: true
+preview: text
+fields:
+  text:
+    type: writer
+    nodes: false
+    placeholder: field.blocks.text.placeholder
+  txtcolor:
+    extends: fields/colors
+  fontsize:
+    label: Schrifgröße
+    type: range
+    step: 0.25
+    min: 0.5
+    max: 3
+    default: 1
+    width: 1/3
+    help: Werte zwischen 0.5 und 3 der normalen Größe sind erlaubt
+  fontfamily:
+    label: Schriftart
+    type: select
+    width: 1/3
+    options:
+      ghibli: Ghibli
+      poppins: Poppins
+  fontweight:
+    label: Dicke
+    type: select
+    width: 1/3
+    options:
+      normal: Regular
+      bold: Bold
+  pre_class:
+    label: Vordefinierte CSS-Klassen
+    type: select
+    width: 1/2
+    help: Hilfreich um das Aussehen der Textes anzupassen ohne Hierarchien zu brechen.
+    options:
+      meta: Meta-Headline (orange)
+      h1: H1 Aussehen
+      h2: H2 Aussehen
+      h3: H3 Aussehen
+      h4: H4 Aussehen
+  class:
+    label: CSS-Klasse
+    width: 1/2
+    type: text
+    help: Evtl. extra Klasse (muss i.d.R. vom Designer implementiert werden)

www/site/plugins/scd-blocks-factory/blueprints/blocks/subpage_navitem.yml

+name: field.blocks.subpage_navitem.name
+label: "{{obj.headline}}"
+preview: fields # required
+wysiwyg: true # recommended
+fields:
+  obj:
+    label: Information
+    type: object
+    fields:
+      btn_type:
+        type: select
+        label:
+          de: Typ
+          en: Type
+        options:
+          - value: pdf 
+            text: PDF
+          - value: image
+            text:
+              de: Bild
+              en: Image
+          - value: video
+            text: Video
+          - value : mix
+            text: Mix
+      headline:
+        label: Headline
+        type: text
+      subheadline:
+        label: Subheadline
+        type: text
+      btn_label:
+        label:
+          de: Button-Beschriftung
+          en: Button label
+        type: text
+      linkedModal:
+        type: pages
+        label:
+          de: Verlinkter Modal
+          en: Linked modal
+        query: page.parent.childrenAndDrafts.filterBy('intendedTemplate', 'modal-swiper')

www/site/plugins/scd-blocks-factory/blueprints/blocks/table.yml

+name: Table
+icon: menu
+preview: table
+fields:
+  tableheading:
+    type: writer
+    label: Headline
+  showheader:
+    label: Show table header?
+    type: toggle
+    #translate: false
+    help: You can add headings to the columns in your table
+    text:
+      - "Off"
+      - "On"
+  leftheader:
+    label: Left column header
+    type: text
+    width: 1/2
+    when:
+      showheader: true
+  rightheader:
+    label: Right column header
+    type: text
+    width: 1/2
+    when:
+      showheader: true
+  striped:
+    label: Striped?
+    type: toggle
+    #translate: false
+    help: Show striped rows
+    text:
+      - "Off"
+      - "On"
+
+  rows:
+    type: structure
+    columns:
+      topic:
+        width: 1/2
+      description:
+        width: 1/2
+
+    fields:
+      topic:
+        type: writer
+        label: Label
+      description:
+        type: writer
+        label: Description

www/site/plugins/scd-blocks-factory/blueprints/blocks/text.yml

+name: field.blocks.text.name
+icon: text
+wysiwyg: true
+preview: text
+fields:
+  text:
+    type: writer
+    nodes: false
+    placeholder: field.blocks.text.placeholder
+  pre_class:
+    label: Vordefinierte CSS-Klassen
+    type: select
+    width: 1/2
+    help: Hilfreich um das Aussehen anzupassen ohne die Hierarchien zu brechen.
+    options:
+      meta: Meta-Headline
+      h1: H1 Aussehen
+      h2: H2 Aussehen
+      h3: H3 Aussehen
+      h4: H4 Aussehen
+      text--sm: Small Text
+  cssclass:
+    label: CSS-Klasse
+    width: 1/2
+    type: text
+    help: Evtl. extra Klasse (muss i.d.R. vom Designer implementiert werden)
+  responsive_hide:
+    label: Responsives Verstecken
+    help: (optional)
+    type: select
+    options:
+      desktop: Nur auf Desktop anzeigen
+      mobile: Nur auf Mobile anzeigen

www/site/plugins/scd-blocks-factory/blueprints/blocks/threedmodel.yml

+name: field.blocks.threedmodel.name
+icon: image
+fields:
+  placeholder:
+    
+    extends: fields/globalimage
+    label:
+      de: Platzhalter (Preview-Bild)
+      en: Placeholder (Preview image)
+    # type: files
+    # query: site.find('main-library').files.filterBy('template', 'image')
+    # multiple: false
+    # uploads:
+    #   parent: site.find('main-library')
+    #   template: image
+
+  threed_model:
+    type: files
+    label:
+      de: 3D Modell
+      en: 3D model
+    query: site.find('main-library').files.filterBy('template', 'docs')
+    multiple: false
+    uploads:
+      parent: site.find('main-library')
+      template: docs
+
+  threed_model_light:
+    type: range
+    label:
+      de: Belichtung
+      en: Exposure
+    default: 1
+    min: 0
+    max: 2
+    help:
+      de: Die Belichtung des Modells kann optional hier bearbeitet werden.
+      en: The exposure of the model can be adjusted here optionally.
+  ratio:
+    label: field.blocks.image.ratio
+    type: select
+    default: 16/9
+    width: 1/2
+    options:
+      1/1: "1:1"
+      16/9: "16:9"
+      9/16: "9:16"
+      21/9: "21:9"
+      9/21: "9:21"
+      4/3: "4:3"
+      3/4: "3:4"

www/site/plugins/scd-blocks-factory/blueprints/blocks/toast.yml

+name: field.blocks.toast.name
+icon: alert
+wysiwyg: true
+fields:
+  toastType:
+    label: Toast Type
+    type: radio
+    default: text
+    options:
+      - text
+      - bolt
+      - alert
+      - neutral
+  text:
+    label: Text
+    type: writer
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+    placeholder: Enter some text…
\ No newline at end of file

www/site/plugins/scd-blocks-factory/blueprints/blocks/video.yml

+name: field.blocks.video.name
+icon: video
+preview: video
+fields:
+  location:
+    label: field.blocks.video.location
+    type: radio
+    columns: 2
+    default: "kirby"
+    options:
+      kirby: "{{ t('field.blocks.image.location.internal') }}"
+      web: "{{ t('field.blocks.image.location.external') }}"
+  url:
+    label: field.blocks.video.url.label
+    type: url
+    placeholder: field.blocks.video.url.placeholder
+    when:
+      location: web
+  video:
+    label: field.blocks.video.name
+    type: files
+    query: page.getmixedvideos
+    multiple: false
+    uploads:
+      template: video
+    when:
+      location: kirby
+  poster:
+    label: field.blocks.video.poster
+    type: files
+    query: page.getmixedimages
+    multiple: false
+    image:
+      back: black
+    uploads:
+      template: image
+    when:
+      location: kirby
+  alt:
+    label: Titel
+    type: text
+    inline: true
+    help: Wird vom ScreenReader vorgelesen.
+  caption:
+    label: field.blocks.video.caption
+    type: writer
+    inline: true
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+    help: Reguläre, visuelle Videolegende
+  description:
+    label: Beschreibung (für Accessibility)
+    type: writer
+    marks:
+      - bold
+      - italic
+      - underline
+      - strike
+      - clear
+    inline: true
+    help: Eine Art Zusammenfassung. Wird vom ScreenReader erkannt und vorgelesen.
+
+  autoplay:
+    label: field.blocks.video.autoplay
+    type: toggle
+    width: 1/3
+    when:
+      location: kirby
+  muted:
+    label: field.blocks.video.muted
+    type: toggle
+    width: 1/3
+    default: true
+    when:
+      location: kirby
+  loop:
+    label: field.blocks.video.loop
+    type: toggle
+    width: 1/3
+    when:
+      location: kirby
+  controls:
+    label: field.blocks.video.controls
+    type: toggle
+    width: 1/3
+    default: true
+    when:
+      location: kirby
+  preload:
+    label: field.blocks.video.preload
+    type: select
+    width: 2/3
+    default: auto
+    options:
+      - auto
+      - metadata
+      - none
+    when:
+      location: kirby
+
+  # h_a11yline:
+  #   type: line
+  #   when:
+  #     location: kirby
+  # h_a11yheader:
+  #   type: headline
+  #   label: Extra Accessibility-Dateien für Player
+  #   when:
+  #     location: kirby
+
+  # # vtt
+  # vtt_description:
+  #   label: Audiobeschreibung in Video
+  #   type: files
+  #   multiple: false
+  #   max: 1
+  #   help: Für **blinde** Menschen. Wird im Videoplayer automatisch geladen (Aduio Beschreibung synchron zum Video).
+  #   uploads: document
+  #   query: page.files.filterBy('template', 'document')
+  #   when:
+  #     location: kirby
+  # vtt_description_lang:
+  #   label: Sprache - Beschreibung in Video
+  #   type: select
+  #   options:
+  #     - de
+  #     - en
+  #   when:
+  #     location: kirby
+  # vtt_description_label:
+  #   label: Label (im Player) - Audiobeschreibung in Video
+  #   type: text
+  #   when:
+  #     location: kirby
+
+  # vtt_line_1:
+  #   type: line
+  #   when:
+  #     location: kirby
+
+  # vtt_captions:
+  #   label: Captions
+  #   type: files
+  #   multiple: false
+  #   max: 1
+  #   help: Für **taube** Menschen. Wird im Videoplayer automatisch geladen (Captions bzw. Untertitel).
+  #   uploads: document
+  #   query: page.files.filterBy('template', 'document')
+  #   when:
+  #     location: kirby
+  # vtt_captions_lang:
+  #   label: Sprache - Captions
+  #   type: select
+  #   options:
+  #     - de
+  #     - en
+  #   when:
+  #     location: kirby
+  # vtt_captions_label:
+  #   label: Label (im Player) - Captions
+  #   type: text
+  #   when:
+  #     location: kirby
+
+  # vtt_line_2:
+  #   type: line
+  #   when:
+  #     location: kirby
+
+  # vtt_subtitles:
+  #   label: Untertitel
+  #   type: files
+  #   multiple: false
+  #   max: 1
+  #   help: Für Nicht-Muttersprachler. Nur 1 Track ist hier erlaubt, es wird empfohlen Englisch zu verwenden. Wird im Videoplayer automatisch geladen (Untertitel).
+  #   uploads: document
+  #   query: page.files.filterBy('template', 'document')
+  #   when:
+  #     location: kirby
+  # vtt_subtitles_lang:
+  #   label: Sprache - Untertitel
+  #   type: text
+  #   when:
+  #     location: kirby
+  # vtt_subtitles_label:
+  #   label: Titel - Untertitel
+  #   type: text
+  #   when:
+  #     location: kirby

www/site/plugins/scd-blocks-factory/blueprints/blocks/videovlite.yml

+name: field.blocks.videovlite.name
+icon: video
+fields:
+  location:
+    label: Location
+    type: radio
+    columns: 2
+    default: "kirby"
+    options:
+      kirby: Upload
+      web: Web
+      vimeo: Vimeo
+      youtube: YouTube
+      
+  video:
+    label: field.blocks.videovlite.name
+    type: files
+    query: site.find('main-library').files.filterBy('template', 'video')
+    multiple: false
+    image:
+      back: black
+    when:
+      location: kirby
+    uploads:
+      parent: site.find('main-library')
+      template: video
+
+  vimeoID:
+    label: Vimeo (ID)
+    type: text
+    counter: false
+    help:
+      en: Please enter only the video ID
+      de: Bitte geben Sie nur die Video-ID ein
+    when:
+      location: vimeo
+
+  youtubeID:
+    label: YouTube (ID)
+    type: text
+    counter: false
+    help:
+      en: Please enter only the video ID
+      de: Bitte geben Sie nur die Video-ID ein    
+    when:
+      location: youtube
+
+  src:
+    label: URL
+    type: url
+    when:
+      location: web
+
+

www/site/plugins/scd-blocks-factory/composer.json

+{
+    "name": "squareclouds/blocks-factory",
+    "description": "A custom blocks set",
+    "type": "kirby-plugin",
+    "license": "MIT",
+    "authors": [
+        {
+            "name": "Santiago Duque",
+            "email": "info@squareclouds.de"
+        }
+    ],
+    "require": {
+        "getkirby/composer-installer": "^1.1"
+    }
+}

www/site/plugins/scd-blocks-factory/index.css

+.k-innerblock-type-toast {
+  position: relative;
+  padding: 10px;
+  border-radius: 5px;
+}
+
+.k-innerblock-type-toast.toast-text {
+  background: #cce3ff;
+}
+
+.k-innerblock-type-toast.toast-bolt {
+  background: #ffd9b3;
+}
+
+.k-innerblock-type-toast.toast-alert {
+  background: #fcc;
+}
+
+.k-innerblock-type-toast.toast-neutral {
+  background: #ccc;
+}
+
+.k-block-type-toast-icon {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+}
+
+.k-block-type-button input {
+  border: 2px solid #444;
+  border-radius: 3rem;
+  padding: .75rem .75rem;
+  cursor: pointer;
+  font: inherit;
+  text-align: center;
+}
+.k-block-type-button input:focus {
+  outline: 0;
+  border-color: var(--color-focus);
+}
+
+details {
+  margin-left: 1rem;
+}
+
+details summary {
+  margin-left: -1rem;
+  margin-bottom: .5rem;
+  font-weight: 600;
+}
+
+details summary .k-writer {
+  display: inline-block;
+  width: calc(100% - 2rem);
+}
+
+.k-block-container:hover .fieldtype {
+  display: block
+}
+
+.k-block-type-card-heading {
+  margin: 1rem 0;
+}
+
+.k-block-type-card-category {
+  margin-top: 1rem;
+  color: #333;
+
+}
+
+.k-block-type-accset-heading {
+  margin: 1rem 0;
+}
+
+.k-block-type-accset-item {
+  margin-bottom: 1rem;
+}
+
+.k-block-type-testimonial-quote footer {
+  margin-top: 1rem;
+}
+
+.k-block-type-testimonial-quote p {
+  border-left: 2px solid black;
+  padding-left: .75rem;
+  max-width: 25rem;
+}
+
+.k-block-type-testimonial-voice {
+  display: flex;
+  align-items: center;
+}
+
+.k-block-type-testimonial-voice img {
+  margin-right: 10px;
+}
+
+.k-block-type-testimonial-voice input {
+  border: none;
+}
+
+.padded {
+  padding: 10px;
+}
+
+.k-aspect-ratio video{
+  pointer-events: none;
+}
\ No newline at end of file

www/site/plugins/scd-blocks-factory/index.js

+panel.plugin("squareclouds/blocks-factory", {
+  blocks: {
+    // AUDIO
+    audio: {
+      computed: {
+        source() {
+          return this.content.source[0] || {};
+        },
+      },
+      template: `
+        <div>
+          <div v-if="source.url">
+          
+            <h1>
+              <k-writer
+                  ref="title"
+                  :inline="true"
+                  marks="false"
+                  :placeholder="'Keine Beschriftung'"
+                  :value="content.title"
+                  @input="update({ title: $event })"
+                />
+            </h1>
+            <h2>
+              <k-writer
+                  ref="subtitle"
+                  :inline="true"
+                  marks="false"
+                  :placeholder="'Keine Subheadline'"
+                  :value="content.subtitle"
+                  @input="update({ subtitle: $event })"
+                />
+            </h2>
+            <audio controls>
+              <source :src="source.url" type="audio/mpeg">
+            </audio>
+          </div>
+          <div v-else>No audio selected</div>
+        </div>
+      `,
+    },
+    // TOAST
+    toast: {
+      computed: {
+        textField() {
+          return this.field("text");
+        },
+      },
+      template: `
+            <div :class="'k-innerblock-type-toast toast-' + content.toasttype">
+              <k-writer
+                class="label"
+                ref="textbox"
+                :marks="textField.marks"
+                :value="content.text"
+                :placeholder="textField.placeholder || 'Enter text...'"
+                @input="update({ text: $event })"
+              />
+              <k-icon
+                v-if="content.type !== 'neutral'"
+                class="k-block-type-toast-icon"
+                :type="content.toasttype"
+              />
+            </div>
+          `,
+    },
+
+    // NEXT EVENT
+    nextevent: {
+      computed: {
+        pagename() {
+          return this.content.relatedpage[0] || {};
+        },
+      },
+      template: `
+            <div class="k-innerblock-type-nextevent">
+              <div v-if="pagename.text">
+                <h4>Selected Next Event: </h4>
+                <h3 v-html="pagename.text"></h3>
+              </div>
+              <div v-else>No next event page selected yet</div>
+            </div>
+          `,
+    },
+
+    // ACCORDION ELEMENT
+    accordion_element: {
+      computed: {
+        summaryField() {
+          return this.field("summary");
+        },
+        detailsField() {
+          return this.field("details");
+        },
+      },
+      template: `
+          <div @dblclick="open">
+            <details>
+              <summary>
+                <k-writer
+                  ref="summary"
+                  :inline="true"
+                  marks="false"
+                  :placeholder="summaryField.placeholder || 'Add a summary…'"
+                  :value="content.summary"
+                  @input="update({ summary: $event })"
+                />
+              </summary>
+              <k-writer
+                  ref="details"
+                  :inline="detailsField.inline || false"
+                  :marks="detailsField.marks"
+                  :value="content.details"
+                  :placeholder="detailsField.placeholder || 'Add some details'"
+                  @input="update({ details: $event })"
+                />
+            </details>
+          </div>
+        `,
+    },
+
+    // ACCORDION
+    accordion: {
+      computed: {
+        accHeadingField() {
+          return this.field("heading");
+        },
+      },
+
+      template: `
+      <div @dblclick="open">
+        <div :data-level="content.level" class="k-block-type-heading-input padded">
+          <k-writer
+            ref="heading"
+            :inline="accHeadingField.inline || false"
+            :marks="accHeadingField.marks"
+            :value="content.heading"
+            :placeholder="accHeadingField.placeholder || 'Add some headline'"
+            @input="update({ heading: $event })"
+          />
+        </div>
+        
+        <div v-if="content.elements.length">
+          <details
+            class="k-block-type-accset-item"
+            v-for="(item, index) in content.elements"
+            :key="index"
+          >
+            <summary v-html="item.content.summary"></summary>
+              <div v-html="item.content.details"></div>
+            </div>
+          </details>
+        </div>
+        <div v-else>No items yet</div>
+      </div>
+    `,
+    },
+
+    // CARD
+    card: {
+      computed: {
+        headingField() {
+          return this.field("heading");
+        },
+        textField() {
+          return this.field("text");
+        },
+        heading() {
+          return this.content.heading || "Heading...";
+        },
+        image() {
+          return this.content.image[0] || {};
+        },
+        text() {
+          return this.content.text || "Text...";
+        },
+      },
+      template: `
+        <div @dblclick="open">
+          <k-aspect-ratio
+            class="k-block-type-card-image"
+            cover="true"
+            ratio="1/1"
+          >
+            <img
+              v-if="image.url"
+              :src="image.url"
+              alt=""
+            >
+          </k-aspect-ratio>
+          <h2 class="k-block-type-card-heading">
+          <k-writer
+            ref="input"
+            :inline="headingField.inline"
+            :marks="headingField.marks"
+            :placeholder="headingField.placeholder"
+            :value="content.heading"
+            @input="update({ heading: $event })"
+          />
+          </h2>
+          <k-writer
+            ref="input"
+            :inline="textField.inline"
+            :marks="textField.marks"
+            :nodes="textField.nodes"
+            :placeholder="textField.placeholder"
+            :value="content.text"
+            class="k-block-type-card-text"
+            @input="update({ text: $event })"
+          />
+        </div>
+      `,
+    },
+
+    // BUTTON
+    button: {
+      computed: {
+        page() {
+          return this.content.linkedmodal[0] || "No page selected";
+        },
+      },
+      template: `
+          <div @dblclick="open">
+            <input
+              type="button"
+              placeholder="Button text …"
+              :value="content.btn_label"
+              @input="update({ btn_label: $event.target.value })"
+            />
+          </div>
+          `,
+    },
+
+    // VIDEOVLITE
+    videovlite: {
+      computed: {
+        captionMarks() {
+          return this.field("caption", { marks: true }).marks;
+        },
+        isExternal() {
+          if (this.content.location === "web") {
+            return false;
+          }
+          if (this.content.location === "kirby") {
+            return false;
+          }
+          return true;
+        },
+        videosrc() {
+          if (this.content.location === "web") {
+            return this.content.src;
+          } else if (
+            this.content.location === "kirby" &&
+            this.content.video[0]?.url
+          ) {
+            return this.content.video[0].url;
+          } else if (this.content.location == "vimeo") {
+            var vim = "https://vimeo.com/" + this.content.vimeoid;
+            return vim;
+          } else if (this.content.location == "youtube") {
+            var yt = "https://youtu.be/" + this.content.youtubeid;
+            return yt;
+          }
+          return false;
+        },
+        video() {
+          return this.$helper.embed.video(this.videosrc, true);
+        },
+        empty() {
+          return "Please select a video";
+        },
+      },
+      template: `
+      <div v-if="isExternal">
+        <b v-html="videosrc"></b>
+        <k-block-figure
+        :caption="content.caption"
+        :caption-marks="captionMarks"
+        :empty-text="$t('field.blocks.video.placeholder') + ' …'"
+        :is-empty="!video"
+        empty-icon="video"
+        @open="open"
+        @update="update"
+        >
+          <k-aspect-ratio ratio="16/9">
+          <iframe
+          v-if="video"
+          :src="video"
+          referrerpolicy="strict-origin-when-cross-origin"
+          />
+          </k-aspect-ratio>
+        </k-block-figure>
+      </div>
+      <div v-else>
+      <b v-html="videosrc"></b>
+        <k-block-figure
+          :empty-text="empty + ' …'"
+          :is-empty="!videosrc"
+          @open="open"
+          @update="update"
+        >
+          <k-aspect-ratio ratio="16/9">
+            <video controls>
+              <source
+                v-if="videosrc"
+                :src="videosrc" type="video/mp4">
+              Your browser does not support the video tag.
+            </video> 
+          </k-aspect-ratio>
+        </k-block-figure>
+      </div>
+      
+          `,
+    },
+  },
+});

www/site/plugins/scd-blocks-factory/index.php

+<?php
+Kirby::plugin('squareclouds/blocks-factory', [
+  'blueprints' => [
+    'blocks/heading' => __DIR__ . '/blueprints/blocks/heading.yml',
+    'blocks/text' => __DIR__ . '/blueprints/blocks/text.yml',
+    'blocks/styledtext' => __DIR__ . '/blueprints/blocks/styledtext.yml',
+    'blocks/image' => __DIR__ . '/blueprints/blocks/image.yml',
+    'blocks/downloaditem' => __DIR__ . '/blueprints/blocks/downloaditem.yml',
+    'blocks/gridbox' => __DIR__ . '/blueprints/blocks/gridbox.yml',
+    'blocks/accordion_element'   => __DIR__ . '/blueprints/blocks/accordion_element.yml',
+    'blocks/accordion'         => __DIR__ . '/blueprints/blocks/accordion.yml',
+    'blocks/toast'         => __DIR__ . '/blueprints/blocks/toast.yml',
+    'blocks/card'        => __DIR__ . '/blueprints/blocks/card.yml',
+    'blocks/nextevent' => __DIR__ . '/blueprints/blocks/nextevent.yml',
+    'blocks/button' => __DIR__ . '/blueprints/blocks/button.yml',
+    'blocks/video' => __DIR__ . '/blueprints/blocks/video.yml',
+    'blocks/videovlite' => __DIR__ . '/blueprints/blocks/videovlite.yml',
+    'blocks/qrcodeblock' => __DIR__ . '/blueprints/blocks/qrcodeblock.yml',
+    'blocks/threedmodel' => __DIR__ . '/blueprints/blocks/threedmodel.yml',
+    'blocks/mainpage_navitem' => __DIR__ . '/blueprints/blocks/mainpage_navitem.yml',
+    'blocks/subpage_navitem' => __DIR__ . '/blueprints/blocks/subpage_navitem.yml',
+    'blocks/table' => __DIR__ . '/blueprints/blocks/table.yml',
+    'blocks/audio' => __DIR__ . '/blueprints/blocks/audio.yml',
+    'blocks/spacing' => __DIR__ . '/blueprints/blocks/spacing.yml',
+  ],
+  'snippets' => [
+    'blocks/heading' => __DIR__ . '/snippets/blocks/heading.php',
+    'blocks/text' => __DIR__ . '/snippets/blocks/text.php',
+    'blocks/styledtext' => __DIR__ . '/snippets/blocks/styledtext.php',
+    'blocks/image' => __DIR__ . '/snippets/blocks/image.php',
+    'blocks/downloaditem' => __DIR__ . '/snippets/blocks/downloaditem.php',
+    'blocks/gridbox' => __DIR__ . '/snippets/blocks/gridbox.php',
+    'blocks/accordion_element'   => __DIR__ . '/snippets/blocks/accordion_element.php',
+    'blocks/accordion'         => __DIR__ . '/snippets/blocks/accordion.php',
+    'blocks/toast'         => __DIR__ . '/snippets/blocks/toast.php',
+    'blocks/card'        => __DIR__ . '/snippets/blocks/card.php',
+    'blocks/nextevent' => __DIR__ . '/snippets/blocks/nextevent.php',
+    'blocks/button' => __DIR__ . '/snippets/blocks/button.php',
+    'blocks/video' => __DIR__ . '/snippets/blocks/video.php',
+    'blocks/videovlite' => __DIR__ . '/snippets/blocks/videovlite.php',
+    'blocks/qrcodeblock' => __DIR__ . '/snippets/blocks/qrcodeblock.php',
+    'blocks/threedmodel' => __DIR__ . '/snippets/blocks/threedmodel.php',
+    'blocks/mainpage_navitem' => __DIR__ . '/snippets/blocks/mainpage_navitem.php',
+    'blocks/subpage_navitem' => __DIR__ . '/snippets/blocks/subpage_navitem.php',
+    'blocks/table' => __DIR__ . '/snippets/blocks/table.php',
+    'blocks/audio' => __DIR__ . '/snippets/blocks/audio.php',
+    'blocks/spacing' => __DIR__ . '/snippets/blocks/spacing.php',
+  ],
+  'translations' => [
+    'en' => [
+      'field.blocks.styledtext.name'   => 'Styled text',
+      'field.blocks.downloaditem.name'   => 'Download item',
+      'field.blocks.gridbox.name'   => 'Grid box',
+
+      'field.blocks.accordion_element.name'   => 'Accordion, single',
+      'field.blocks.accordion.name'         => 'Accordion group',
+      'field.blocks.toast.name'         => 'Toast',
+      'field.blocks.card.name'        => 'Card',
+      'field.blocks.nextevent.name' => 'Next related Event',
+      'field.blocks.button.name' => 'Button',
+      'field.blocks.videovlite.name' => 'Video Vlite',
+      'field.blocks.qrcodeblock.name' => 'QR Code',
+      'field.blocks.threedmodel.name' => '3D model',
+      'field.blocks.mainpage_navitem.name' => 'Main page, Navi-Item',
+      'field.blocks.subpage_navitem.name' => 'Sub page, Navi-Item',
+      'field.blocks.table.name' => 'Table',
+      'field.blocks.audio.name' => 'Audio',
+      'field.blocks.audio.spacing' => 'Spacing',
+    ],
+    'de' => [
+      'field.blocks.styledtext.name'   => 'Gestylter Text',
+      'field.blocks.downloaditem.name'   => 'Download-Item',
+      'field.blocks.gridbox.name'   => 'Grid-Box',
+
+      'field.blocks.accordion_element.name'   => 'Akkordeon, single',
+      'field.blocks.accordion.name'         => 'Akkordeon-Gruppe',
+      'field.blocks.toast.name'         => 'Toast',
+      'field.blocks.card.name'        => 'Kärtchen',
+      'field.blocks.nextevent.name' => 'Nächstes verbandtes Event',
+      'field.blocks.button.name' => 'Button',
+      'field.blocks.videovlite.name' => 'Video Vlite',
+      'field.blocks.qrcodeblock.name' => 'QR Code',
+      'field.blocks.threedmodel.name' => '3D Modell',
+      'field.blocks.mainpage_navitem.name' => 'Hauptseite, Navi-Item',
+      'field.blocks.subpage_navitem.name' => 'Subseite, Navi-Item',
+      'field.blocks.table.name' => 'Tabelle',
+      'field.blocks.audio.name' => 'Audio',
+      'field.blocks.audio.spacing' => 'Abstand',
+    ]
+  ]
+]);

www/site/plugins/scd-blocks-factory/snippets/blocks/accordion.php

+
+<?php $accordionItems = $block->elements()->toBlocks(); ?>
+<div class="accordion-section">
+  <?php if ($accordionItems->isNotEmpty()) : ?>
+    <<?= $level = $block->level()->or('h2') ?>><?= $block->heading() ?></<?= $level = $block->level()->or('h2') ?>>
+    <?php foreach ($accordionItems as $key=>$accordionItem) : ?>
+      <?php snippet('blocks/' . $accordionItem->type(), [
+        'block' => $accordionItem,
+        'index' => $accordionItem->indexOf(),
+        'as_group' => $block->group()->toBool(),
+        'parentid' => $block->id()
+      ]) ?>
+    <?php endforeach ?>
+  <?php endif; ?>
+</div>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/accordion_element.php

+<?php
+$_index = isset($index) && $index >= 0 ? $index : $block->id();
+$_as_group = isset($as_group) ? $as_group : false;
+$_parentid = isset($parentid) ? '-' . $parentid : $block->id();
+?>
+
+<div class="acc-el">
+  <?php if ($_as_group) : ?>
+    <?php if ($block->summary()->isNotEmpty()) : ?>
+      <input type="radio" id="accrad-<?= $_index ?>" name="accordion" />
+      <label class="acc-item" for="accrad-<?= $_index ?>">
+        <div class="acc-title">
+          <?= $block->summary() ?>
+        </div>
+        <div class="acc-content">
+          <?= $block->details() ?>
+        </div>
+      </label>
+    <?php endif; ?>
+  <?php else : ?>
+    <?php if ($block->summary()->isNotEmpty()) : ?>
+      <input type="checkbox" id="accchk-<?= $_index ?>" name="accordion" />
+      <label class="acc-item" for="accchk-<?= $_index ?>">
+        <div class="acc-title">
+          <?= $block->summary() ?>
+        </div>
+        <div class="acc-content">
+          <?= $block->details() ?>
+        </div>
+      </label>
+    <?php endif; ?>
+  <?php endif ?>
+</div>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/audio.php

+<?php if ($file = $block->source()->toFile()): ?>
+    <div class="audio-wrapper">
+        <p class="h3 audio-title"><?= $block->title()->or($file->title()) ?></p>
+        <p class="audio-subtitle"><?= $block->subtitle()->or($file->subtitle())  ?></p>
+        <!-- Audio Player -->
+        <audio class="audio-element" aria-describedby="audio-desc__<?= Str::slug($file->uuid()) ?>"
+            <?= $block->controls()->isTrue() ? 'controls' : '' ?>
+            <?= $block->autoplay()->isTrue() ? 'autoplay' : '' ?>>
+            <source src="<?= $file->url() ?>" type="<?= $file->mime() ?>">
+            <?= t('audio.noSupport') ?>
+        </audio>
+
+        <!-- Hidden Description for Screen Readers -->
+        <p id="audio-desc__<?= Str::slug($file->uuid()) ?>" class="visually-hidden">
+            <?= $block->description()->or($file->description()) ?>
+        </p>
+
+        <!-- Transcript Section -->
+        <?php if ($block->transcript()->isNotEmpty() || $file->transcript()->isNotEmpty()): ?>
+            <div>
+                <button id="toggle-transcript__<?= Str::slug($file->uuid()) ?>"
+                    aria-expanded="false"
+                    class="btn transcript-btn"
+                    aria-controls="transcript__<?= Str::slug($file->uuid()) ?>"
+                    data-transcript="transcript__<?= Str::slug($file->uuid()) ?>"
+                    data-hide_label="<?= t('audio.transcript.buttonLabel.hide') ?>"
+                    data-show_label="<?= t('audio.transcript.buttonLabel.show') ?>">
+                    <?= t('audio.transcript.buttonLabel.show') ?>
+                </button>
+            </div>
+
+            <div id="transcript__<?= Str::slug($file->uuid()) ?>" class="transcript" hidden aria-live="polite">
+                <strong><?= t('audio.transcript.label') ?>:</strong>
+                <?= $block->transcript()->or($file->transcript()) ?>
+            </div>
+        <?php endif ?>
+
+    </div>
+<?php endif ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/button.php

+<span>
+  <a class="button" href="<?= $block->linkage()->toUrl() ?>" <?= $block->target()->toBool() ? 'target="_blank"' : '' ?>>
+    <?= $block->btn_label()->or($block->linkage())->or('EMPTY')  ?>
+  </a>
+</span>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/card.php

+<?php
+$link     = $block->link()->value();
+$image    = $block->image()->toFile();
+$heading  = $block->heading();
+$text     = $block->text();
+
+$srcsetargs = [
+  '400w'  => ['height' => 225, 'width' => 400, 'quality' => 79, 'format' => 'webp'],
+  '800w'  => ['height' => 450, 'width' => 800, 'quality' => 79, 'format' => 'webp'],
+  '1200w' => ['height' => 562, 'width' => 1000, 'quality' => 79, 'format' => 'webp']
+];
+
+?>
+
+<?php if ($block->isNotEmpty()) : ?>
+  <div class="card">
+    <?php if (!empty($link)) : ?>
+      <a href="<?= $link ?>">
+      <?php endif; ?>
+      <?php if ($image) : ?>
+        <div class="card-image img" style="--w:16;--h:9">
+          <?= $image->responsiveImg('img-responsive'); ?>
+        </div>
+      <?php endif ?>
+      <div class="card-header">
+        <div class="card-title h3">
+          <?= $heading ?>
+        </div>
+      </div>
+      <div class="card-body">
+        <?= $text ?>
+      </div>
+      <?php if (!empty($link)) : ?>
+      </a>
+    <?php endif; ?>
+  </div>
+<?php endif; ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/downloaditem.php

+<?php
+
+/** @var \Kirby\Cms\Block $block */ ?>
+
+<a class="link_dwnld" href="<?= $block->link()->toUrl() ?>" <?= $block->target()->toBool() === true ? 'target="_blank"' : '' ?>>
+    <?= $block->linkText()->or($block->link()) ?>
+</a>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/gridbox.php

+<?php
+$ratio    = $block->ratio()->or('auto');
+$src      = null;
+$txtcolor = $block->txtcolor();
+$bgcolor = $block->bgcolor();
+$imgalpha = $block->imagealpha()->value();
+$class = $block->gradient()->toBool() ? 'gradient' : '';
+
+$is_fake3D = $block->image_is_fake3d()->isTrue();
+$tresholdX =  $block->fake3d_threshx()->value() ?? 50;
+$tresholdY =  $block->fake3d_threshy()->value() ?? 50;
+$imgFocusx =  $block->fake3d_focusx()->value() ?? 50;
+$imgFocusy =  $block->fake3d_focusy()->value() ?? 50;
+
+
+if (!isset($imgcollection)) {
+    if ($image = $block->image()->toFile()) {
+        $src = $image;
+    }
+}
+
+$class .= $block->mobilecard()->toBool()  ? ' visuals' : '';
+
+$ratios = '';
+if ($ratio != 'auto') {
+    $ratio = Str::split($ratio, '/');
+    $w = $ratio[0] ?? 1;
+    $h = $ratio[1] ?? 1;
+    $ratios = '--w:' . $w . '; --h:' . $h . '; ';
+}
+
+$attrs = attr([
+    'style'         => $ratios . '--tColor:' . $txtcolor . '; --bgColor:' . $bgcolor . ';',
+    'class'         => 'gridbox shadow ' . $class,
+]);
+
+
+?>
+<div <?= $attrs ?>>
+
+    <?php if (isset($imgcollection)) : ?>
+        <div class="swiper ui-white" id="swiper-<?= $block->id() ?>">
+            <!-- Additional required wrapper -->
+            <div class="swiper-wrapper">
+                <!-- Slides -->
+                <?php foreach ($imgcollection as $imageitem) : ?>
+                    <?php $imageitem = $imageitem->toFile(); ?>
+                    <div class="swiper-slide">
+                        <div class="img-container" style="--imgalpha:<?= $imgalpha ?>">
+                            <img class="gridbox-bg" style="--objPos:<?= $imageitem->focus() ?>;" src="<?= $imageitem->placeholderUri() ?>" data-srcset="<?= $imageitem->srcset() ?>" data-lazyload alt="<?= $imageitem->alt() ?>" title="<?= $imageitem->alt() ?>">
+                        </div>
+                    </div>
+                <?php endforeach ?>
+            </div>
+            <div class="overlay"></div>
+            <!-- If we need pagination -->
+            <div class="swiper-pagination"></div>
+        </div>
+
+    <?php else : ?>
+        <?php if ($is_fake3D && $depthmap = $block->image_depthmap()->toFile()) : ?>
+            <div class="img-container" style="--imgalpha:<?= $imgalpha ?>">
+                <div class="fake3d-frame" style="--w: <?= $src->width() ?>; --h: <?= $src->height() ?>">
+                    <div class="f3d-canvas" id="gl-<?=$block->id()?>" data-focusx="<?= $imgFocusx ?>" data-focusy="<?= $imgFocusy ?>" data-imageOriginal="<?= $src->url() ?>" data-imageDepth="<?= $depthmap->url() ?>" data-horizontalThreshold="<?= 101 - $tresholdX ?>" data-verticalThreshold="<?= 101 - $tresholdY ?>">
+                    </div>
+                    <div id="f3d-loader-<?=$block->id()?>" class="cpb-progress-container"></div>  
+                </div>
+            </div>
+            <div class="overlay"></div>
+        <?php else : ?>
+
+            <?php if ($src) : ?>
+                <div class="img-container" style="--imgalpha:<?= $imgalpha ?>">
+                    <img class="gridbox-bg" src="<?= $src->placeholderUri() ?>" data-srcset="<?= $src->srcset() ?>" data-lazyload style="--objPos:<?= $src->focus() ?>;">
+                </div>
+                <div class="overlay"></div>
+            <?php endif ?>
+        <?php endif ?>
+    <?php endif ?>
+    <div class="text-area">
+        <?php if ($block->headline()->isNotEmpty()) : ?>
+            <?= $block->headline() ?>
+        <?php endif ?>
+        <?php if ($block->text()->isNotEmpty()) : ?>
+            <?= $block->text() ?>
+        <?php endif ?>
+        <?php if ($block->cta()->isTrue()) : ?>
+            <?php if ($obj = $block->cta_link()->toObject()) : ?>
+
+                <?php if ($obj->is_script()->toBool()) : ?>
+                    <button class="btn" onclick="<?= $obj->callback() ?>"><?= $obj->linkText()->or('EMPTY') ?></button>
+                <?php else : ?>
+                    <a class="btn" href="<?= $obj->link()->toUrl() ?>"><?= $obj->linkText()->or('EMPTY') ?></a>
+                <?php endif ?>
+            <?php endif ?>
+        <?php endif ?>
+    </div>
+</div>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/heading.php

+<?php
+
+/** @var \Kirby\Cms\Block $block */ ?>
+<?php
+$pre_class = $block->pre_class()->isNotEmpty() ? $block->pre_class()->value() : '';
+$responsive_hide = $block->responsive_hide()->isNotEmpty() ? $block->responsive_hide()->value() : '';
+$class = $block->cssclass()->or('');
+$element_id = $block->cssid();
+?>
+<<?= $level = $block->level()->or('h2') ?>
+    <?= e($block->cssid()->isNotEmpty(), 'id="' . $element_id . '"') ?>
+    <?= e($block->pre_class()->isNotEmpty() || $block->cssclass()->isNotEmpty() || $block->responsive_hide()->isNotEmpty(), 'class="' . $class . ' ' . $pre_class . ' ' . $responsive_hide . '"') ?>> <?= $block->text()->permalinksToUrls() ?> </<?= $level ?>>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/image.php

+<?php
+
+/** @var \Kirby\Cms\Block $block */
+$figureClassArray   = [];
+$imgClassArray      = [];
+$alt          = $block->alt();
+$caption      = $block->caption();
+$crop         = $block->crop()->isTrue();
+$link         = $block->link();
+$target_blank  = $block->target_blank()->isTrue();
+$ratio        = $block->ratio()->or('auto');
+$cssclass    = $block->cssclass()->or('');
+$src          = null;
+
+if ($crop)
+  array_push($figureClassArray, 'crop');
+
+
+$figureStyle = '';
+$figureClass = implode(" ", $figureClassArray);
+$imgClass = implode(" ", $imgClassArray);
+$imgClass .= " " . $cssclass;
+$isSVG = false;
+
+if ($block->location() == 'web') {
+  $src = $block->src()->esc();
+} elseif ($image = $block->image()->toFile()) {
+  $alt = $alt->or($image->alt());
+  $caption = $caption->or($image->caption());
+  $src = $image->url();
+  $isSVG    = ($image->extension() == "svg") ? true : false;
+}
+
+if ($ratio == 'auto') {
+  $figureClass .= " auto";
+} else {
+  $figureClass .= " ratioed";
+
+  $ratioData = explode('/', $ratio);
+  $figureStyle = 'style = "--w: ' . $ratioData[0] . '; --h: ' . $ratioData[1] . ';"';
+}
+
+$desktopW = $span / 12 * 100;
+$sizes = 'sizes = "(min-width:1080px) ' . floor($desktopW) . 'vw,			    
+			    100vw"';
+?>
+<?php if ($src) : ?>
+  <figure class="<?= $figureClass ?>" <?= $figureStyle ?>>
+    <?php
+    // WITH LINK
+    if ($link->isNotEmpty() && $block->linkactive()->isTrue()) : ?>
+      <a <?= e($target_blank, 'target="_blank"') ?> href="<?= Str::esc($link->toUrl()) ?>" title="<?= $block->link_desc() ?>">
+        <?php
+        // check if from web
+        if ($block->location() == 'web') : ?>
+          <img class="<?= $imgClass ?>" src="<?= $src ?>" alt="<?= $alt->esc() ?>">
+        <?php
+        // if local, check svg or no scr setting
+        elseif ($isSVG) : ?>
+          <img class="svg <?= $imgClass ?>" src="<?= $src ?>" alt="<?= $alt->esc() ?>">
+        <?php else : ?>
+          <?= $image->responsiveImg($alt, $imgClass, $sizes); ?>
+        <?php endif ?>
+      </a>
+    <?php else :
+      // NO LINK
+    ?>
+      <?php
+      // check if from web
+      if ($block->location() == 'web') : ?>
+        <img class="<?= $imgClass ?>" src="<?= $src  ?>" alt="<?= $alt->esc() ?>">
+      <?php
+      // if local, check svg or no scr setting
+      elseif ($isSVG) : ?>
+        <img class="svg <?= $imgClass ?>" src="<?= $src  ?>" alt="<?= $alt->esc() ?>">
+      <?php else : ?>
+        <?= $image->responsiveImg($alt, $imgClass, $sizes); ?>
+      <?php endif ?>
+    <?php endif ?>
+    <?php if ($caption->isNotEmpty()) : ?>
+      <figcaption>
+        <?= $caption ?>
+      </figcaption>
+    <?php endif ?>
+  </figure>
+<?php endif ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/mainpage_navitem.php

+<?php if ($item = $block->obj()->toObject()) : ?>
+    <?php $image = $item->photo()->toFile(); ?>
+
+
+    <div class="card mainnav-item" style="background-image: url('<?= $image ? $image->url() : '' ?>')">
+        <?php if ($lp = $item->linkedPage()->toPage()) : ?>
+            <a class="no-decoration" href="<?= $lp->url() ?>">
+            <?php endif ?>
+
+            <div class="card-body">
+                <?php if ($item->headline()->isNotEmpty()) : ?>
+                    <div class="h2-container">
+                        <h2><?= $item->headline() ?></h2>
+                    </div>
+                <?php endif ?>
+                <?php if ($item->btn_label()->isNotEmpty() && $lp) : ?>
+                    <div class="btn-container">
+                        <button class="btn btn-primary"><?= $item->btn_label() ?><i class="fas fa-arrow-right"></i></button>
+                    </div>
+                <?php endif ?>
+            </div>
+
+            <?php if ($lp) : ?>
+            </a>
+        <?php endif ?>
+    </div>
+
+<?php endif ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/qrcodeblock.php

+<figure class="auto qrcode">
+    <?php $label = $block->qrlabel() ?>   
+    <?= $page->qrcode(['labelText' => (string)$label,])->html(
+        $page->slug() . '.png', // image format detected from extension
+        ['class' => 'qrcode']
+    ); ?>
+</figure>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/spacing.php

+<hr class="spacing-<?= $block->size() ?>">
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/styledtext.php

+<?php
+
+/** @var \Kirby\Cms\Block $block */ ?>
+
+<?php
+$styles = "";
+$styles .= $block->txtcolor()->isNotEmpty() ? "--b-fc:" . $block->txtcolor() . ";"  : "";
+$styles .= $block->fontsize()->isNotEmpty() ? "--b-fs: calc(" . $block->fontsize() . " * var(--fs-base));"  : "";
+$styles .= $block->fontweight()->isNotEmpty() ? "--b-fw:" . $block->fontweight() . ";"  : "";
+$styles .= $block->fontfamily()->isNotEmpty() ? "--b-ff:" . $block->fontfamily() . ";"  : "";
+
+$pre_class = $block->pre_class()->isNotEmpty() ? $block->pre_class()->value() : '';
+$class = $block->class()->or('');
+
+?>
+<?php if (strlen($styles) > 0) : ?>
+    <span class="txt-styled <?= e($pre_class || $class, $class . ' ' . $pre_class) ?>" style="<?= $styles ?>">
+        <?= $block->text(); ?>
+    </span>
+<?php else : ?>
+    <span <?= e($pre_class || $class, 'class="' . $class . ' ' . $pre_class . '"') ?>>
+        <?= $block->text(); ?>
+    </span>
+<?php endif ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/subpage_navitem.php

+<?php if ($item = $block->obj()->toObject()) : ?>
+    <div class="card subnav-item">
+        <div class="btn-type type-<?= $item->btn_type() ?>">
+            icon
+        </div>
+        <div class="card-body">
+            <div class="headings">
+                <?php if ($item->headline()->isNotEmpty()) : ?>
+                    <div class="h2-container">
+                        <h2><?= $item->headline() ?></h2>
+                    </div>
+                <?php endif ?>
+                <?php if ($item->subheadline()->isNotEmpty()) : ?>
+                    <div class="h3-container">
+                        <h3><?= $item->subheadline() ?></h3>
+                    </div>
+                <?php endif ?>
+            </div>
+
+            <!-- button -->
+            <?php if ($p = $item->linkedmodal()->toPage()) : ?>
+                <?php if (!$p->isDraft()) : ?>
+                    <button class="btn btn-primary" type="button" data-bs-toggle="modal" data-bs-target="#modal__<?= $item->linkedmodal()->toPage()->uid() ?>">
+                        <?= $item->btn_label()->or($item->linkedmodal()->toPage()->title()) ?><i class="fas fa-arrow-right"></i>
+                    </button>
+                <?php else : ?>
+                    <button class="btn btn-primary" disabled>Modal inactive</button>
+                <?php endif ?>
+            <?php else : ?>
+                <button class="btn btn-primary" disabled>No modal selected</button>
+            <?php endif ?>
+        </div>
+    </div>
+
+<?php endif ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/table.php

+<?php
+$rows = $block->rows()->toStructure();
+if ($rows->isNotEmpty()) :?>
+    <table class="table <?= e($block->striped()->toBool(), 'table-striped') ?>">
+        <?php if($block->showheader()->toBool()) : ?>
+        <thead>
+            <tr>
+                <th><?= $block->leftheader() ?></th>
+                <th><?= $block->rightheader() ?></th>
+            </tr>
+        </thead>
+        <?php endif; ?>
+        <tbody>
+            <?php foreach ($rows as $row) : ?>
+                <tr>
+                    <td><?= $row->topic() ?></td>
+                    <td><?= $row->description() ?></td>
+                </tr>
+            <?php endforeach ?>
+        </tbody>
+    </table>
+<?php endif; ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/text.php

+<?php
+$pre_class = $block->pre_class()->isNotEmpty() ? $block->pre_class()->value() : '';
+$responsive_hide = $block->responsive_hide()->isNotEmpty() ? $block->responsive_hide()->value() : '';
+$cssclass = $block->cssclass()->or('');
+
+?>
+<?php /** @var \Kirby\Cms\Block $block */ ?>
+<?php if ($block->pre_class()->isNotEmpty() || $block->cssclass()->isNotEmpty() || $block->responsive_hide()->isNotEmpty()): ?>
+    <span class="<?= $cssclass . ' ' . $pre_class . ' ' . $responsive_hide ?>">
+    <?php endif ?>
+    <?= $block->text()->permalinksToUrls() ?>
+
+    <?php if ($block->pre_class()->isNotEmpty() || $block->cssclass()->isNotEmpty() || $block->responsive_hide()->isNotEmpty()): ?>
+    </span>
+<?php endif ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/threedmodel.php

+<script>
+    self.ModelViewerElement = self.ModelViewerElement || {};
+    self.ModelViewerElement.dracoDecoderLocation = '<?= kirby()->url() ?>/assets/js/vendor/decoder/';
+</script>
+<?= js('/assets/js/vendor/model-viewer.min.js', ['type' => 'module']) ?>
+
+<?php
+
+$imgurl = "";
+$imgalt = "";
+$modelurl = "";
+$exposure = 1;
+
+if ($img = $block->placeholder()->toFile()) {
+
+    $imgurl =  $img->thumb([
+        'width'   => 250,
+        'quality' => 5,
+    ])->url();
+    $imgalt = $img->alt();
+}
+
+if ($model = $block->threed_model()->toFile())
+    $modelurl = $model->url();
+
+$exposure = $block->threed_model_light()->value();
+
+
+
+
+$ratio    = $block->ratio()->or('16/9');
+if ($ratio !== 'auto') {
+  $ratio = Str::split($ratio, '/');
+  $w = $ratio[0] ?? 1;
+  $h = $ratio[1] ?? 1;
+}
+$attrs = attr([
+  'style'         => 'aspect-ratio:' . $w . '/' . $h,
+]);
+?>
+
+<?php if ($modelurl) : ?>
+    <div class="object__viewer" <?= $attrs ?>>
+        <model-viewer class="exhibit-3d" id="reveal" loading="eager" exposure="<?= $exposure ?>" disable-tap disable-pan camera-controls touch-action="pan-y" auto-rotate poster="<?= $imgurl ?>" src="<?= $modelurl ?>" shadow-intensity="0" alt="<?= $imgalt ?>" style="background-color: unset;">
+            <div class="viewer-progress" slot="progress-bar"></div>
+        </model-viewer>
+    </div>
+<?php elseif (!$modelurl && $imgurl) : ?>
+    <div class="digital__container row justify-content-center">
+        <div class="col align-self-center text-center exhibit-digital">
+            <div id="gallery" class="pswp-gallery">
+                <a class="pswp-gallery__item" href="<?= $img->url() ?>" target="_blank" data-pswp-width="<?= $img->width() ?>" data-pswp-height="<?= $img->height() ?>">
+                    <?= $img->responsiveImg($imgalt) ?>
+                </a>
+            </div>
+        </div>
+    </div>
+<?php else : ?>
+    <div class="object__viewer" <?= $attrs ?>>
+        <div class="exhibit-3d no-object row justify-content-center text-center">
+            <span class="empty w-50 text-primary"><i data-lucide="help-circle" class="icon-only"></i></span>
+        </div>
+    </div>
+<?php endif ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/toast.php

+<?php if($block->text()->isNotEmpty()): ?>
+  <div class="toast toast-<?= $block->toastType() ?>">
+    <?= $block->text() ?>
+  </div>
+<?php endif; ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/video.php

+<?php
+
+use Kirby\Cms\Html;
+
+/** @var \Kirby\Cms\Block $block */
+
+if (
+    $block->location() == 'kirby' &&
+    $video = $block->video()->toFile()
+) {
+    // recheck, since the file might have own information
+    $caption = $block->caption()->or($video->caption());
+    $alt = $block->alt()->or($video->alt());
+    $desc = $block->description()->or($video->description());
+
+    $url   = $video->url();
+    $attrs = array_filter([
+        'autoplay'    => $block->autoplay()->toBool(),
+        'controls'    => $block->controls()->toBool(),
+        'loop'        => $block->loop()->toBool(),
+        'muted'       => $block->muted()->toBool() || $block->autoplay()->toBool(),
+        'playsinline' => $block->autoplay()->toBool(),
+        'poster'      => $video->poster()->toFile()?->url(),
+        'preload'     => $block->preload()->value(),
+        'aria-describedby' => "video-desc-" . $block->id(),
+        'title'         =>  $alt,
+        'id'          => $block->id(),
+    ]);
+} else {
+
+    $url = $block->url();
+    $desc = $block->description();
+    $caption = $block->caption();
+    $alt = $block->alt();
+
+    $attrs = array_filter([
+        /* 'autoplay'    => $block->autoplay()->toBool(),
+        'controls'    => $block->controls()->toBool(),
+        'loop'        => $block->loop()->toBool(),
+        'muted'       => $block->muted()->toBool() || $block->autoplay()->toBool(),
+        'playsinline' => $block->autoplay()->toBool(),
+        'poster'      => $block->poster()->toFile()?->url(),
+        'preload'     => $block->preload()->value(), */
+
+        'frameborder' => '0', // not working
+        'aria-describedby' => "video-desc-" . $block->id(),
+        'allowfullscreen' => 'true',
+        'allow' => 'fullscreen',
+        'title'         =>  $alt,
+        'id'          => $block->id(),
+    ]);
+}
+
+?>
+<?php if (
+    $block->location() == 'kirby' &&
+    $video = $block->video()->toFile()
+): ?>
+    <figure>
+        <video <?= attr($attrs ?? []) ?>>
+            <source src="<?= $url ?>" type="video/mp4" />
+
+            <!-- for blind people -->
+            <?php if ($vtt_description = $video->content()->get('vtt_description_' . $kirby->language())): ?>
+                <track src="<?= $vtt_description->toFile() ?>" kind="descriptions" srclang="<?= $kirby->language() ?>" label="<?= $video->content()->get('vtt_description_label_' . $kirby->language()) ?>">
+            <?php endif ?>
+
+            <!-- for deaf people -->
+            <?php if ($vtt_captions_de = $video->vtt_captions_de()->toFile()): ?>
+                <track src="<?= $vtt_captions_de->url() ?>" kind="captions" srclang="de" label="<?= $video->vtt_captions_label_de() ?>">
+            <?php endif ?>
+            <?php if ($vtt_captions_en = $video->vtt_captions_en()->toFile()): ?>
+                <track src="<?= $vtt_captions_en->url() ?>" kind="captions" srclang="en" label="<?= $video->vtt_captions_label_en() ?>">
+            <?php endif ?>
+
+            <?= t('video.noSupport') ?>
+        </video>
+        <?php if ($caption): ?>
+            <figcaption><?= $caption ?></figcaption>
+        <?php endif ?>
+    </figure>
+<?php else: ?>
+
+    <?php
+    $cookie = $_COOKIE['cc_cookie'] ?? null;
+    if ($cookie) {
+        $cookieData = json_decode($_COOKIE['cc_cookie'], true);
+        $externalVideos = in_array('experience', $cookieData['categories']) ?? null;
+    } else {
+        $externalVideos = false;
+    }
+
+    if ($externalVideos): ?>
+        <?php if ($video = Html::video($url, [], $attrs ?? [])): ?>
+            <figure class="iframe-container">
+                <?= $video ?>
+                <?php if ($caption): ?>
+                    <figcaption><?= $caption ?></figcaption>
+                <?php endif ?>
+            </figure>
+        <?php endif ?>
+    <?php else: ?>
+        <figure class="crop ratioed">
+            <div class="video-placeholder" data-src="<?= $url ?>">
+                <p><?= snippet('t_labels', ['var' => 'cookies.activateCookies']) ?></p>
+            </div>
+            <?php if ($caption): ?>
+                <figcaption><?= $caption ?></figcaption>
+            <?php endif ?>
+        </figure>
+    <?php endif ?>
+
+<?php endif ?>
+
+<?php if ($desc->isNotEmpty()): ?>
+    <p id="video-desc-<?= $block->id() ?>" class="visually-hidden">
+        <?= $desc ?>
+    </p>
+<?php endif ?>
+
+<?php if ($vtt_description ?? null): ?>
+    <p id="descAudioOutput__<?= $block->id() ?>" class="visually-hidden" aria-live="polite"></p>
+<?php endif ?>
\ No newline at end of file

www/site/plugins/scd-blocks-factory/snippets/blocks/videovlite.php

+<?php
+$src = null;
+$providerAttr = null;
+$provider = null;
+if ($block->location() == 'web') {
+    $src = $block->src();
+} elseif ($block->location() == 'vimeo') {
+    $providerAttr = 'data-vimeo-id="' . $block->vimeoID() . '"';
+    $provider = 'vimeo';
+} elseif ($block->location() == 'youtube') {
+    $providerAttr = 'data-youtube-id="' . $block->youtubeID() . '"';
+    $provider = 'youtube';
+} elseif ($video = $block->video()->toFile()) {
+    $src = $video->url();
+}
+?>
+
+
+<?php if ($src) : ?>
+    <video id="<?= $block->id() ?>" class="vlite-js modal__video <?= e($block->cover()->toBool(), 'cover') ?>" src="<?= $src ?>" crossorigin>
+    </video>
+<?php elseif ($provider) : ?>
+    <div id="<?= $block->id() ?>" class="vlite-js modal__video <?= e($block->cover()->toBool(), 'cover') ?>" <?= $providerAttr ?> <?= "provider='" . $provider . "'" ?>></div>
+<?php else : ?>
+    <div>No video selected</div>
+<?php endif ?>
+

www/site/plugins/scd-custom-methods/composer.json

+{
+    "name": "scd/custom-methods",
+    "description": "Field and file methods",
+    "type": "kirby-plugin",
+    "license": "GNU",
+    "authors": [
+        {
+            "name": "SCD, Santiago Duque",
+            "email": "sd@squareclouds.de"
+        }
+    ],
+    "require": {
+        "getkirby/composer-installer": "^1.1"
+    }
+}

www/site/plugins/scd-custom-methods/index.php

+<?php
+
+/**
+ * Helpful extra functions for fields or files
+ * to get information more easily inside yaml files or php
+ */
+Kirby::plugin('scd/custom-methods', [
+    'collectionMethods' => [],
+    'pageMethods' => [
+        'zips' => function () {
+            return $this->files()->filterBy('template', 'zip');
+        },
+        'getsyncedfiles' => function () {
+            $currentFiles = $this->files()->filterBy('template', 'in', ['image', 'video', 'mp3']);
+            $resultAssets = $currentFiles;
+            $syncedPages = $this->sync_events()->toPages();
+
+            foreach ($syncedPages as $syncedPage) {
+                $resultAssets->add($syncedPage->files()->filterBy('template', 'in', ['image', 'video', 'mp3']));
+            }
+
+            $siteAssets = kirby()->site()->files();
+            $resultAssets->add($siteAssets);
+
+            return $resultAssets;
+        },
+        'getmixedimages' => function () {
+            $siteAssets = kirby()->site()->files()->filterBy('template', 'image');
+            $currentPage = $this;
+            $resultAssets;
+
+            if ($currentPage->isModule()) {
+                $resultAssets = $currentPage->page()->files()->filterBy('template', 'image');
+            } elseif ($currentPage->intendedTemplate() == "pressesub") {
+                $resultAssets = $currentPage->getsyncedfiles()->filterBy('template', 'image');
+            } else {
+                $resultAssets = $currentPage->files()->filterBy('template', 'image');
+            }
+
+            return $resultAssets->add($siteAssets);
+        },
+        'getmixedvideos' => function () {
+            $siteAssets = kirby()->site()->files()->filterBy('template', 'video');
+            $currentPage = $this;
+            $resultAssets;
+
+            if ($currentPage->isModule()) {
+                $resultAssets = $currentPage->page()->files()->filterBy('template', 'video');
+            } elseif ($currentPage->intendedTemplate() == "pressesub") {
+                $resultAssets = $currentPage->getsyncedfiles()->filterBy('template', 'video');
+            } else {
+                $resultAssets = $currentPage->files()->filterBy('template', 'video');
+            }
+
+            return $resultAssets->add($siteAssets);
+        },
+        'getmixedaudios' => function () {
+            $siteAssets = kirby()->site()->files()->filterBy('template', 'mp3');
+            $currentPage = $this;
+            $resultAssets;
+
+            if ($currentPage->isModule()) {
+                $resultAssets = $currentPage->page()->files()->filterBy('template', 'mp3');
+            } elseif ($currentPage->intendedTemplate() == "pressesub") {
+                $resultAssets = $currentPage->getsyncedfiles()->filterBy('template', 'mp3');
+            } else {
+                $resultAssets = $currentPage->files()->filterBy('template', 'mp3');
+            }
+
+            return $resultAssets->add($siteAssets);
+        },
+
+    ],
+    'fieldMethods' => [
+        'toPagesAndDrafts' => function ($field) {
+            $result = new Pages();
+            if ($field && $field->isNotEmpty()) {
+                $selectedPages = $field->yaml();
+
+                foreach ($selectedPages as $page) {
+                    $result->add(kirby()->page($page));
+                }
+            }
+            return $result;
+        },
+
+        'toPageOrDraft' => function ($field) {
+            if ($field && $field->isNotEmpty()) {
+                $selectedPages = $field->yaml();
+                foreach ($selectedPages as $page) {
+                    $result = kirby()->page($page);
+                    if ($result) {
+                        return $result;
+                    } else {
+                        return false;
+                    }
+                }
+            } else {
+                return false;
+            }
+        },
+
+        'dbstructure' => function ($field) {
+            $_structure = new Kirby\Cms\Structure();
+            $collection = $field->toStructure();
+
+            foreach ($collection as $item) {
+                $_structure->add(new Kirby\Cms\StructureObject([
+                    'id'        => $item->id(),
+                    'content'   => [
+                        'desc' => $item->content()->get(kirby()->language()),
+                    ],
+                ]));
+            }
+
+            return $_structure;
+        },
+
+        'mapValueToLabel' => function ($field) {
+            $context = $field->parent()->parent();
+            $options = $context->content()->get($field->key())->toStructure();
+
+            if ($field->value() != '' || $field->value() != null) {
+                $value = $options->findBy('id', $field->value());
+                if ($value) {
+                    $value = $value->content()->get(kirby()->language());
+                }
+            } else {
+                $value = null;
+            }
+
+            return $value;
+        },
+    ],
+    'fileMethods' => [
+        'responsiveImg' => function ($alt, $imgclass = 'regular-img', $sizes = null) {
+            $sizesAttr = "";
+            if ($sizes)
+                $sizesAttr = $sizes;
+
+            if ($this->focus()->isNotEmpty())
+                //    $tag = "<img class='{$imgclass}' style='--objPos:{$this->focus()}' alt='{$alt}' src='{$this->src()}' srcset='{$this->srcset('webp')}' width='{$this->width()}' height='{$this->height()}' draggable='false' onerror=\"this.src='{$this->src()}'\">";
+                $tag = "<picture style='--objPos:{$this->focus()}'>
+                        <source {$sizesAttr} srcset='{$this->srcset('webp')}' type='image/webp'>
+                        <source {$sizesAttr} srcset='{$this->srcset('default')}' type='image/jpeg'>
+                        <img class='{$imgclass}' alt='{$alt}' src='{$this->resize(900)->url()}' width='{$this->width()}' height='{$this->height()}' draggable='false'>
+                    </picture>";
+            else
+                //$tag = "<img class='{$imgclass}' alt='{$alt}' srcset='{$this->srcset('webp')}' width='{$this->width()}' height='{$this->height()}' draggable='false' onerror=\"this.src='{$this->src()}'\">";
+
+                $tag = "<picture>
+                        <source {$sizesAttr} srcset='{$this->srcset('webp')}' type='image/webp'>
+                        <source {$sizesAttr} srcset='{$this->srcset('default')}' type='image/jpeg'>
+                        <img class='{$imgclass}' alt='{$alt}' src='{$this->resize(900)->url()}' width='{$this->width()}' height='{$this->height()}' draggable='false'>
+                    </picture>";
+
+            return $tag;
+        },
+    ],
+]);

www/site/plugins/scd-global-functions/composer.json

+{
+    "name": "scd/global-functions",
+    "description": "Global system functions for data handling",
+    "type": "kirby-plugin",
+    "license": "GNU",
+    "authors": [
+        {
+            "name": "scd, Santiago Duque",
+            "email": "sd@squareclouds.design"
+        }
+    ],
+    "require": {
+        "getkirby/composer-installer": "^1.1"
+    }
+}

www/site/plugins/scd-global-functions/index.php

+<?php
+

www/site/plugins/scd-panel-icons/index.js

+panel.plugin('scd/panel-icons', {
+    icons: {
+        'layout-top': '<path d="M21 3C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H21ZM20 5H4V19H20V5ZM18 7V9H6V7H18Z" />',
+        'layout-bot': '<path d="M21 3C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H21ZM20 5H4V19H20V5ZM18 15V17H6V15H18Z" />',
+        'layout-mid': '<path d="M19 11V5H5V11H19ZM19 13H5V19H19V13ZM4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3Z" />',
+    }
+});
\ No newline at end of file

www/site/plugins/scd-panel-icons/index.php

+<?php
+
+Kirby::plugin('scd/panel-icons', [
+    'icons' => [
+    ]
+]);
\ No newline at end of file