majorItems:
    - type: "sectionTitle"
      title: { de: "Website Perfomance", en: "Website Perfomance" }
      appendix:
          collection: lighthouse
          eval: |
              (function(){
                 return "  " + new Date($date).toLocaleDateString() + ""
              })()
    - type: graph
      filter: false
      graphType: radialBar
      until: "lastYear"
      value: total
      containerProps:
          #optional class prop
          layout:
              breakBefore: false
              breakAfter: false
              size:
                  default: "col-6"
                  small: "col-12"
                  large: "col-3"
      options:
          {
              property: plotOptions,
              value:
                  {
                      radialBar:
                          {
                              hollow: { margin: 0, size: "70%" },
                              track: { dropShadow: { enabled: true, top: 2, left: 0, blur: 4, opacity: 0.15 } },
                              dataLabels:
                                  {
                                      name: { offsetY: -10, color: "#000", fontSize: "13px" },
                                      value: { color: "#000", fontSize: "30px", show: true },
                                  },
                          },
                  },
          }
      graphs:
          - collection: lighthouse
            field: performance
            yAxis: latestValue
            graphName: { de: "Perfomance Score", en: "Perfomance Score" }
            dateTimeField: insertTime

    - type: graph
      filter: false
      graphType: radialBar
      until: "lastYear"
      value: total
      containerProps:
          #optional class prop
          layout:
              breakBefore: false
              breakAfter: false
              size:
                  default: "col-6"
                  small: "col-12"
                  large: "col-3"
      options:
          {
              property: plotOptions,
              value:
                  {
                      radialBar:
                          {
                              hollow: { margin: 0, size: "70%" },
                              track: { dropShadow: { enabled: true, top: 2, left: 0, blur: 4, opacity: 0.15 } },
                              dataLabels:
                                  {
                                      name: { offsetY: -10, color: "#000", fontSize: "13px" },
                                      value: { color: "#000", fontSize: "30px", show: true },
                                  },
                          },
                  },
          }
      graphs:
          - collection: lighthouse
            field: accessibility
            yAxis: latestValue
            graphName: { de: "Accessibility Score", en: "Accessibility Score" }
            dateTimeField: insertTime

    - type: graph
      filter: false
      graphType: radialBar
      until: "lastYear"
      value: total
      containerProps:
          #optional class prop
          layout:
              breakBefore: false
              breakAfter: false
              size:
                  default: "col-6"
                  small: "col-12"
                  large: "col-3"
      options:
          {
              property: plotOptions,
              value:
                  {
                      radialBar:
                          {
                              hollow: { margin: 0, size: "70%" },
                              track: { dropShadow: { enabled: true, top: 2, left: 0, blur: 4, opacity: 0.15 } },
                              dataLabels:
                                  {
                                      name: { offsetY: -10, color: "#000", fontSize: "13px" },
                                      value: { color: "#000", fontSize: "30px", show: true },
                                  },
                          },
                  },
          }
      graphs:
          - collection: lighthouse
            field: bestPractices
            yAxis: latestValue
            graphName: { de: "Best Practices Score", en: "Best Practices Score" }
            dateTimeField: insertTime

    - type: graph
      filter: false
      graphType: radialBar
      until: "lastYear"
      value: total
      containerProps:
          #optional class prop
          layout:
              breakBefore: false
              breakAfter: false
              size:
                  default: "col-6"
                  small: "col-12"
                  large: "col-3"
      options:
          {
              property: plotOptions,
              value:
                  {
                      radialBar:
                          {
                              hollow: { margin: 0, size: "70%" },
                              track: { dropShadow: { enabled: true, top: 2, left: 0, blur: 4, opacity: 0.15 } },
                              dataLabels:
                                  {
                                      name: { offsetY: -10, color: "#000", fontSize: "13px" },
                                      value: { color: "#000", fontSize: "30px", show: true },
                                  },
                          },
                  },
          }
      graphs:
          - collection: lighthouse
            field: seo
            yAxis: latestValue
            graphName: { de: "SEO Score", en: "SEO Score" }
            dateTimeField: insertTime

    - type: swiper # Art des Elements, hier ein Swiper
      containerProps:
          #optional class prop
          layout:
              breakBefore: false
              breakAfter: false
              size:
                  default: "col-12"
                  small: "col-12"
                  large: "col-6 row-2-4"

      elements: # Liste der Elemente in diesem Swiper
          - type: graph
            title:
                value: { de: "Ladezeit (Score)", en: "Loadtime (Score)" }
            xAxis: manual
            until: "lastYear"
            filter: false #deaktiviert die Filter möglichkeit für den Nutzer beim diagramm, normalerweise aktiviert. Hierbei sind alle kombinationen x >= until möglich
            columns:
                - name: { de: '["Erstes sichtbares", "Element"]', en: '["First Contentful", "Paint"]' }
                  field: lighthouseMetrics.FCPS

                - name: { de: '["Erstes bedeutsames", "Element"]', en: '["First Meaningful", "Paint"]' }
                  field: lighthouseMetrics.FMPS

                - name:
                      {
                          de: '["Maximale potenzielle", "erste", "ingabeverzögerung"]',
                          en: '["Max Potential", "First Input", "Delay"]',
                      }
                  field: lighthouseMetrics.FPIDS

                - name: { de: '["Zeit bis", "zur", "Interaktivität"]', en: '["Time to", "Interactive"]' }
                  field: lighthouseMetrics.TTIS

                - name: { de: '["Geschwindigkeitsindex"]', en: '["Speed Index"]' }
                  field: lighthouseMetrics.SIS

            graphType: "bar"
            graphs:
                - graphName: { de: "Lighthouse Metriken", en: "Lighthouse Metrics" }
                  yAxis: latestValue
                  collection: lighthouse
                  dateTimeField: insertTime
          - type: graph
            title:
                value: { de: "Ladezeit (Sekunden)", en: "Loadtime (seconds)" }
            xAxis: manual
            until: "lastYear"
            filter: false #deaktiviert die Filter möglichkeit für den Nutzer beim diagramm, normalerweise aktiviert. Hierbei sind alle kombinationen x >= until möglich
            columns:
                - name: { de: '["Erstes sichtbares", "Element"]', en: '["First Contentful", "Paint"]' }
                  field: lighthouseMetrics.FCPV

                - name: { de: '["Erstes bedeutsames", "Element"]', en: '["First Meaningful", "Paint"]' }
                  field: lighthouseMetrics.FMPV

                - name:
                      {
                          de: '["Maximale potenzielle", "erste", "ingabeverzögerung"]',
                          en: '["Max Potential", "First Input", "Delay"]',
                      }
                  field: lighthouseMetrics.FPIDV

                - name: { de: '["Zeit bis", "zur", "Interaktivität"]', en: '["Time to", "Interactive"]' }
                  field: lighthouseMetrics.TTIV

                - name: { de: '["Geschwindigkeitsindex"]', en: '["Speed Index"]' }
                  field: lighthouseMetrics.SIV

            graphType: "bar"
            graphs:
                - graphName: { de: "Lighthouse Metriken", en: "Lighthouse Metrics" }
                  yAxis: latestValue
                  collection: lighthouse
                  dateTimeField: insertTime

    - type: "sectionTitle"
      title: { de: "Seiteninhalte", en: "Page content" }

    - collection: content
      type: reference
      style:
          upper: rgba(3, 50, 59, 0.7)
          lower: rgba(3, 50, 59)

    - collection: navigation
      type: reference
      style:
          upper: rgba(3, 50, 59, 0.7)
          lower: rgba(3, 50, 59)

    - collection: forms
      type: reference
      style:
          upper: rgba(3, 50, 59, 0.7)
          lower: rgba(3, 50, 59)

    - type: "sectionTitle"
      title: { de: "Aktionen", en: "Actions" }

    - collection: lighthouse
      type: action
      action: "Lighthouse Durchlauf starten"
      backgroundAction: true
      modalText:
          {
              de: "Zur Analyse der Website werden einige Zeitintensive prozesse gestartet, daher wird dies im Hintergrund ausgeführt. Es kann einige Minuten dauern bis das Dashboard aktuallisiert wird, bitte haben Sie etwas Geduld.",
              en: "To analyze the website, some time-intensive processes are started, so this is done in the background. It may take a few minutes for the dashboard to be updated, please be patient.",
          }
      properties:
          url: https://allkids-erfurt.de
          type: post
      style:
          upper: rgba(3, 50, 59, 0.7)
          lower: rgba(3, 50, 59)

minorItems: []