hugo-toha/layouts/partials/sections/experiences/positions.html

<div class="col-10 col-lg-8">
    <div class="experience-entry-heading">
        {{ $logoImage:= resources.Get .company.logo}}
            {{ if $logoImage }}
            <div class="logo-holder">
                <img class="company-logo" src="{{ $logoImage.RelPermalink }}" alt="{{ .name }}" />
            </div>
            {{ end }}
        <!-- Total experience duration on a company is time between the starting date of the oldest position and ending date of most recent position -->
        {{ $oldestPosition := index (last 1 .positions) 0}}
        {{ $mostRecentPosition := index (first 1 .positions) 0}}
        <div class="company-heading">
            <h5>{{ if .company.url }}<a href={{.company.url}} title="{{ .company.name }}" target="_blank" rel="noopener">{{ .company.name }}</a>{{ else }}{{ .company.name }}{{ end }}</h5>
            <p class="text-muted">
                {{ $oldestPosition.start }} - {{ if $mostRecentPosition.end }}{{ $mostRecentPosition.end }}{{ else }}{{ i18n "present" }}{{ end }}
            </p>
        </div>
        <p class="text-muted">
            <i class="fa-solid fa-location-dot"></i> {{ .company.location }}
        </p>
        <!-- Add company overview -->
        <p>{{ .company.overview | markdownify }}</p>
    </div>
    <!-- Add the positions information -->
    <div class="positions">
    {{ range $index,$position:= .positions }}
        <div class="company-heading">
            <h5 class="designation">{{ $position.designation }}</h5>
            <p class="text-muted">{{ $position.start }} - {{if $position.end }} {{ $position.end }} {{else}} {{ i18n "present" }} {{end}}</p>
        </div>
        <!-- Add the responsibilities handled at this position -->
        {{ if $position.responsibilities }}
            <h6 class="text-heading">{{ i18n "responsibilities" }}</h6>
            <ul class="justify-content-around">
                {{ range $position.responsibilities }}
                    <li>{{ . | markdownify }}</li>
                {{ end }}
            </ul>
        {{ end }}
    {{ end }}
    </div>
</div>