hugo-toha/layouts/partials/experiences.html

<div class="container-fluid experiences bg-white anchor" id="experiences">
  {{ if .Site.Data.experiences }}
    <h1 class="text-center">Experiences</h1>

    <div class="container timeline text-justify">
      {{ $totalExperiences:= len .Site.Data.experiences.experiences }}
      {{ range $index,$experience:= .Site.Data.experiences.experiences }}
        {{ if eq (mod $index 2) 0 }}
          <div class="row align-items-center  d-flex">
            {{ partial "experiences/vertical-line.html" $index }}
            {{ partial "experiences/experience-info.html" $experience }}
          </div>
        {{else}}
          <div class="row align-items-center justify-content-end d-flex">
            {{ partial "experiences/experience-info.html" $experience }}
            {{ partial "experiences/vertical-line.html" $index }}
          </div>
        {{ end }}
        {{ if lt $index (sub $totalExperiences 1) }}
          {{ partial "experiences/horizontal-line.html" $index }}
        {{ end }}
      {{ end }}
    </div>
  {{ end }}
</div>