hugo-toha/layouts/partials/experiences.html

<div class="container-fluid anchor pb-5" id="{{ replace (lower .section.name) " " "-" }}">
  <div id="experiences-template">
    <h1 class="text-center">{{ .section.name }}</h1>

    <div class="container timeline text-justify">
     {{ $totalExperiences:= len .experiences }}
     {{ range $index,$experience:= .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>
  </div>
</div>