{{ define "main" }}

{{ $data := .Site.Data }}

{{ if $data.homepage.slider.enable }}
{{ with $data.homepage.slider }}
<section class="hero-section overlay bg-cover hero-default" data-background="{{ .bg_image | absURL }}">
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <h2 class="text-white position-relative">{{ $data.homepage.slider.title | markdownify }}</h2>
        <div class="hero-slider">
          {{ range .slider_item }}
          <div class="hero-slider-item">
            <p class="text-muted mb-4" >{{ .content | markdownify }}</p>
            {{ if .button.enable }}
              <a href="{{ .button.link | absURL }}" class="btn btn-primary">{{ .button.label }}</a>
            {{ end }}
          </div>
        {{ end }}
        </div>
      </div>
    </div>
  </div>
</section>
{{ end }}
<noscript>
  <style>
    .hero-default {
      display: none;
    }
  </style>
  <section class="hero-section overlay bg-cover" style="background-image: url('{{ $data.homepage.slider.bg_image | absURL }}');">
    <div class="container">
      <div class="hero-slider">
          <div class="row">
            <div class="col-md-12">
              <h1 class="text-white">{{ $data.homepage.slider.title | markdownify }}</h1>
              {{ range first 1 $data.homepage.slider.slider_item }}
                <p class="text-muted mb-4">{{ .content | markdownify }}</p>
                {{ if .button.enable }}
                  <a href="{{ .button.link | absURL }}" class="btn btn-primary">{{ .button.label }}</a>
                {{ end }}
              {{ end }}
            </div>
          </div>
        </div>
    </div>
  </section>
</noscript>
{{ end }}

{{ if $data.homepage.header_logos.enable }}
{{ with $data.homepage.header_logos }}
<section class="bg-white">
  <div class="container">
    <div class="row align-items-center justify-content-center">
      {{ range .logos }}
        <div class="col-md-3 col-6 mt-4">
          <a href="{{ .link }}" target="_blank" title="{{ .title }}"><img class="img-fluid w-100" src="{{ .image }}"></a>
        </div>
		  {{ end }}
    </div>
  </div>
</section>
{{ end }}
{{ end }}

{{ if $data.homepage.about.enable }}
{{ with $data.homepage.about }}
<section class="section">
  <div class="container">
    <div class="row align-items-center">
      <div class="col-md-10 order-2 order-md-1">
        <h3 class="mb-4">{{ .title | markdownify }}</h3>
        <div class="content text-justify">
          {{ .content | markdownify }}
        </div>
        {{ if .button.enable }}
        {{ with .button }}
        <a href="{{ .link | absURL }}" class="btn btn-primary">{{ .label }}</a>
        {{ end }}
        {{ end }}
      </div>
      {{ with .image }}
      <div class="col-md-2 col-6 order-1 order-md-2 mb-md-0 mx-auto">
        <img class="img-fluid w-100" src="{{ . | absURL }}">
      </div>
      {{ end }}
    </div>
  </div>
</section>
{{ end }}
{{ end }}

{{ if $data.ausblick.enable }}
{{ with $data.ausblick }}
  {{ partial "modal" . }}
{{ end }}
{{ end }}

{{ if $data.homepage.blog.enable }}
<section class="section mb-4">
  <div class="container">
    <div class="d-flex align-items-center mb-4 justify-content-between">
      <h2 class="mb-0 text-nowrap me-3">{{ $data.homepage.blog.title }}</h2>
      <div class="border-top w-100 border-primary d-none d-sm-block"></div>
      <div>
        <a href="{{ `blog` | relURL }}" class="btn btn-sm btn-primary-outline ms-sm-3 d-none d-sm-block">Alle anzeigen</a>
      </div>
    </div>
    <div class="row justify-content-center">
      {{ if $data.ausblick.enable }}
      {{ with $data.ausblick }}
      <div class="col-lg-4 col-sm-6 mb-4 mb-lg-0 d-flex align-items-stretch">
        <div class="card border-info rounded-0 hover-shadow mb-2">
          <span class="position-absolute top-0 start-0 ms-5 translate-middle p-2 text-bg-info border border-info rounded-pill">
            <i class="mdi mdi-pin me-2">Angeheftet</i>
          </span>        
          <img class="card-img-top rounded-0" src="{{ .image | relURL }}" alt="{{ .title }}" onclick="$('#{{ md5 .title }}').modal('show');">
          <div class="card-body d-flex flex-column">
            <span class="text-truncate mb-2">
              <i class="mdi mdi-fountain-pen-tip me-2"></i>
              {{ partial "authors" (dict "Site" $.Site "author" .author )}}
            </span>
            <h4 class="card-title text-truncate" onclick="$('#{{ md5 .title }}').modal('show');">{{ .title }}</h4>
            <p class="card-text" onclick="$('#{{ md5 .title }}').modal('show');">{{ partial "summary" .content }}</p>
            <button type="button" class="btn btn-primary btn-sm mt-auto align-self-start" onclick="$('#{{ md5 .title }}').modal('show');">Mehr anzeigen</button>
          </div>
        </div>
      </div>
      {{ end }}
      {{ end }}
      {{ range first (cond $data.ausblick.enable (int $data.homepage.blog.number) (add $data.homepage.blog.number 1)) (where .Site.RegularPages "Type" "post")}}
      <div class="col-lg-4 col-sm-6 mb-4 mb-lg-0 d-flex align-items-stretch">
        {{ partial "card-article" . }}
      </div>
      {{ end }}
    </div>
  </div>
</section>
{{ end }}

{{ if $data.homepage.success_banner.enable }}
{{ with $data.homepage.success_banner }}
<section class="section bg-cover" data-background="{{ .image | absURL }}" id="success">
  <div class="container">
    <div class="row feature-blocks bg-white justify-content-between">
      {{ range .feature_item }}
      <div class="col-xl-5 mb-xl-5 mb-4">
        {{ with .image }}
          <img src="{{ . }}" class="mb-xl-4 mb-lg-3 mb-4 feature-icon"></img>
        {{ end }}
        {{ with .icon }}
          <i class="{{ . }} mb-xl-4 mb-lg-3 mb-4 feature-icon"></i>
        {{ end }}
        <h3 class="mb-xl-4 mb-lg-3 mb-4">{{ .name | markdownify }}</h3>
        <div class="content">
          {{ .content | markdownify }}
        </div>
      </div>
      {{ end }}
    </div>
  </div>
</section>
{{ end }}
{{ end }}

{{ if $data.homepage.ganztagsangebote.enable }}
<section class="section">
  <div class="container">
    <div class="d-flex align-items-center mb-4 justify-content-between">
      <h2 class="mb-0 text-nowrap me-3">{{ $data.homepage.ganztagsangebote.title }}</h2>
      <div class="border-top w-100 border-primary d-none d-sm-block"></div>
      <div>
        <a href="{{ `ganztagsangebote` | relURL }}" class="btn btn-sm btn-primary-outline ms-sm-3 d-none d-sm-block">Alle anzeigen</a>
      </div>
    </div>
    <div class="row justify-content-center">
      {{ range first (int $data.homepage.ganztagsangebote.number) (where .Site.RegularPages "Type" "ganztagsangebote" | shuffle)}}
      <div class="col-lg-4 col-sm-6">
        {{ partial "ganztag" . }}
      </div>
      {{ end }}
    </div>
  </div>
</section>
{{ end }}

{{ if $data.homepage.cta.enable }}
{{ with $data.homepage.cta }}
<section class="section bg-primary">
  <div class="container text-center">
    <h2 class="text-white mb-0">{{ .title | markdownify }}</h2>
    <h5 class="mb-4 text-white">{{ .subtitle | markdownify }}</h5>
    {{ if .button.enable }}
    {{ with .button }}
    <a href="{{ .link | absURL }}" class="btn btn-secondary text-uppercase">{{ .label }}</a>
    {{ end }}
    {{ end }}
  </div>
</section>
{{ end }}
{{ end }}

{{ if $data.homepage.info.enable }}
{{ partial "info.html" . }}
{{ end }}

{{ if $data.homepage.termine.enable }}
<section class="section bg-body-tertiary">
  <div class="container">
    <div class="d-flex align-items-center mb-4 justify-content-between">
      <h2 class="mb-0 text-nowrap me-3">{{ $data.homepage.termine.title }}</h2>
      <div class="border-top w-100 border-primary d-none d-sm-block"></div>
      <div>
        <a href="{{`termine` | relURL }}" class="btn btn-sm btn-primary-outline ms-sm-3 d-none d-sm-block text-nowrap">Alle anzeigen</a>
      </div>
    </div>
    <div class="row justify-content-center px-2">
      
      {{ with .Site.GetPage "/termine/_index.md" }}

      {{ $events := slice }}
      {{ range .Params.events }}
        {{ if or (ge (.date | time.AsTime).Unix now.Unix) (and .enddate (ge (.enddate | time.AsTime).Unix now.Unix)) }}
          {{ $events = $events | append . }}
        {{ end }}
      {{ end }}

      {{ range first (int $data.homepage.termine.number) $events }}
        {{ partial "termin" . }}
      {{ end }}

      {{ end }}

    </div>
    <div class="row">
      <div class="col-12 text-center">
        <a href="{{`termine` | relURL }}" class="btn btn-sm btn-primary-outline d-sm-none d-inline-block">Alle anzeigen</a>
      </div>
    </div>
  </div>
</section>
{{ end }}

{{ if $data.homepage.digitalpakt.enable }}
{{ with $data.homepage.digitalpakt }}
<section class="section bg-footer">
  <div class="container">
    <div class="row align-items-center">
      <div class="col-md-7 order-2 order-md-1">
        <h3 class="mb-4 text-white">{{ .title | markdownify }}</h2>
        <div class="content text-white text-opacity-50">
          {{ .content | markdownify }}
        </div>
        {{ if .button.enable }}
        {{ with .button }}
        <a href="{{ .link | absURL }}" class="btn btn-primary">{{ .label }}</a>
        {{ end }}
        {{ end }}
      </div>
      {{ with .image }}
      <div class="col-md-5 order-1 order-md-2 mb-4 mb-md-0">
        <img class="img-fluid w-100" src="{{ . | absURL }}">
      </div>
      {{ end }}
    </div>
  </div>
</section>
{{ end }}
{{ end }}

{{ if $data.homepage.footer_logos.enable }}
{{ with $data.homepage.footer_logos }}
<section class="bg-footer">
  <div class="container">
    <div class="row justify-content-center">
		{{ range .logos }}
        <div class="col-md-2 col-4 mb-4">
          <a href="{{ .link }}" target="_blank" title="{{ .title }}"><img class="img-fluid w-100" src="{{ .image }}"></a>
        </div>
		{{ end }}
    </div>
  </div>
</section>
{{ end }}
{{ end }}

{{ end }}