gurusabarish
167 lines
9.5 KiB
HTML
167 lines
9.5 KiB
HTML
<section id="experience" class="py-5">
|
|
<div class="container">
|
|
<h3 class="text-center">Experience</h3>
|
|
<div class="row justify-content-center">
|
|
<div class="col-sm-12 col-md-8 col-lg-8 py-5">
|
|
<div class="experience-container px-3 pt-2">
|
|
<ul class="nav nav-pills mb-3 bg-transparent" id="pills-tab" role="tablist">
|
|
{{ range $index, $element := .Site.Params.experience.items }}
|
|
{{ if (eq $index 0) }}
|
|
<li class="nav-item px-1 bg-transparent" role="presentation">
|
|
<div
|
|
class="nav-link active bg-transparent"
|
|
aria-selected="true"
|
|
type="button"
|
|
role="tab"
|
|
data-bs-toggle="pill"
|
|
id='{{ replace .company " " "-" }}-{{ replace .date " " "-" }}-tab'
|
|
data-bs-target='#pills-{{ replace .company " " "-" }}-{{ replace .date " " "-" }}'
|
|
aria-controls='{{ replace .company " " "-" }}-{{ replace .date " " "-" }}'
|
|
>
|
|
{{ .company }}
|
|
</div>
|
|
</li>
|
|
{{ else }}
|
|
<li class="nav-item px-1 bg-transparent" role="presentation">
|
|
<div
|
|
class="nav-link bg-transparent"
|
|
aria-selected="true"
|
|
type="button"
|
|
role="tab"
|
|
data-bs-toggle="pill"
|
|
id='{{ replace .company " " "-" }}-{{ replace .date " " "-" }}-tab'
|
|
data-bs-target='#pills-{{ replace .company " " "-" }}-{{ replace .date " " "-" }}'
|
|
aria-controls='{{ replace .company " " "-" }}-{{ replace .date " " "-" }}'
|
|
>
|
|
{{ .company }}
|
|
</div>
|
|
</li>
|
|
{{ end }}
|
|
{{ end }}
|
|
</ul>
|
|
<div class="tab-content pb-5 pt-2 bg-transparent primary-font" id="pills-tabContent">
|
|
{{ range $index, $element := .Site.Params.experience.items }}
|
|
{{ if (eq $index 0) }}
|
|
<div
|
|
class="tab-pane fade show active bg-transparent"
|
|
role="tabpanel"
|
|
id='pills-{{ replace .company " " "-" }}-{{ replace .date " " "-" }}'
|
|
aria-labelledby='pills-{{ replace .company " " "-" }}-{{ replace .date " " "-" }}-tab'
|
|
>
|
|
<div>
|
|
<span class="h4">{{ .job }}</span>
|
|
<small>-</small>
|
|
<a href="{{ .companyUrl }}" target="_blank">{{ .company }}</a>
|
|
<div class="pb-1">
|
|
<small>{{ .date }}</small>
|
|
{{ if .info.enable | default true }}
|
|
<span class="p-2">
|
|
<span
|
|
data-bs-toggle="tooltip"
|
|
data-bs-placement="top"
|
|
data-bs-original-title={{ .info.content | default (print "Working as a " .job " at " .company ) }}
|
|
>
|
|
<i class="fas fa-info-circle fa-xs"></i>
|
|
</span>
|
|
</span>
|
|
{{ end }}
|
|
</div>
|
|
|
|
{{ if .featuredLink.enable | default false }}
|
|
<div class="py-2 featuredLink">
|
|
<a class="p-2 px-4 btn btn-outline-primary btn-sm" href={{ .featuredLink.url | default "#" }} target="_blank">
|
|
{{ .featuredLink.name | default "Featured Link" }}
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
|
|
{{ .content | markdownify}}
|
|
</div>
|
|
{{ else }}
|
|
<div
|
|
class="tab-pane fade bg-transparent"
|
|
role="tabpanel"
|
|
id='pills-{{ replace .company " " "-" }}-{{ replace .date " " "-" }}'
|
|
aria-labelledby='pills-{{ replace .company " " "-" }}-{{ replace .date " " "-" }}-tab'
|
|
>
|
|
<div>
|
|
<span class="h4">{{ .job }}</span>
|
|
<small>-</small>
|
|
<a href="{{ .companyUrl }}" target="_blank">{{ .company }}</a>
|
|
|
|
<div class="pb-1">
|
|
<small>{{ .date }}</small>
|
|
{{ if .info.enable | default true }}
|
|
<span class="p-2">
|
|
<span
|
|
data-bs-toggle="tooltip"
|
|
data-bs-placement="top"
|
|
data-bs-original-title={{ .info.content | default (print "Worked as a " .job " at " .company ) }}
|
|
>
|
|
<i class="fas fa-info-circle fa-xs"></i>
|
|
</span>
|
|
</span>
|
|
{{ end }}
|
|
</div>
|
|
|
|
{{ if .featuredLink.enable | default false }}
|
|
<div class="py-2 featuredLink">
|
|
<a class="p-2 px-4 btn btn-outline-primary btn-sm" href={{ .featuredLink.url | default "#" }} target="_blank">
|
|
{{ .featuredLink.name | default "Featured Link" }}
|
|
</a>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
|
|
<div class="pt-2">
|
|
{{ .content | markdownify}}
|
|
</div>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
|
|
<!-- <div class="tab-pane fade show active bg-transparent" id="pills-home" role="tabpanel"
|
|
aria-labelledby="pills-home-tab">
|
|
<h4>Software developer</h4>
|
|
<small>Feb 2021 - present</small>
|
|
<p>
|
|
Home is some placeholder content the Contact tab's associated content. Clicking another
|
|
tab
|
|
will
|
|
toggle the visibility
|
|
of this one for the next.
|
|
</p>
|
|
<ul>
|
|
<li>Lead backend developer for a product.</li>
|
|
<li>Created a frontend design for a product.</li>
|
|
</ul>
|
|
</div>
|
|
<div class="tab-pane fade bg-transparent" id="pills-profile" role="tabpanel"
|
|
aria-labelledby="pills-profile-tab">
|
|
Profile is some placeholder content the Contact tab's associated content. Clicking another
|
|
tab
|
|
will
|
|
toggle the visibility
|
|
of this one for the next. The tab JavaScript swaps classes to control the content visibility
|
|
and
|
|
styling. You can use it
|
|
with tabs, pills, and any other .nav-powered navigation.
|
|
</div>
|
|
<div class="tab-pane fade bg-transparent" id="pills-contact" role="tabpanel"
|
|
aria-labelledby="pills-contact-tab">
|
|
Contact is some placeholder content the Contact tab's associated content. Clicking another
|
|
tab
|
|
will
|
|
toggle the visibility
|
|
of this one for the next. The tab JavaScript swaps classes to control the content visibility
|
|
and
|
|
styling. You can use it
|
|
with tabs, pills, and any other .nav-powered navigation.
|
|
</div> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section> |