Refactor sidebar logic + Add Table of Contents in reading page (#33)
* Refactor sidebar logic + fix responsiveness * Add TOC * Add Pagination * Update exampleSite * Update README.md
This commit is contained in:
Md. Emruz Hossain
GitHub
parent
647578e88b
commit
fa4d474974
59 changed files with 1735 additions and 679 deletions
45
layouts/partials/sections/about.html
Normal file
45
layouts/partials/sections/about.html
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
<div class="container anchor p-lg-5 about-section" id="{{ replace (lower .section.name) " " "-" }}">
|
||||
<div class="row pt-sm-2 pt-md-4 align-self-center">
|
||||
<!-- summary -->
|
||||
<div class="col-sm-6">
|
||||
<h3 class="p-1">{{ site.Params.author.name }}</h3>
|
||||
{{ if .designation }}
|
||||
<h5 class="p-1">
|
||||
{{ .designation }}
|
||||
{{ if .company }}
|
||||
at <a href="{{ .company.url }}">{{ .company.name }}</a>
|
||||
{{ end }}
|
||||
</h5>
|
||||
{{ end }}
|
||||
<p class="p-1 text-justify">
|
||||
{{ .summary | markdownify }}
|
||||
</p>
|
||||
<div class="text-container ml-auto">
|
||||
<ul class="social-link d-flex">
|
||||
{{ range .socialLinks }}
|
||||
<li>
|
||||
{{ if eq .name "Email" }}
|
||||
<a href="mailto:{{ .url }}" target="/"><i class="{{ .icon }}"></i></a>
|
||||
{{ else }}
|
||||
<a href="{{ .url }}" target="/"><i class="{{ .icon }}"></i></a>
|
||||
{{ end }}
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</div>
|
||||
{{ if .resume }}
|
||||
<a href="{{ .resume }}" target="#"
|
||||
><button class="btn btn-dark">My Resume</button></a
|
||||
>
|
||||
{{ end }}
|
||||
</div>
|
||||
<!-- soft skills circular-progressbar -->
|
||||
<div class="col-sm-6 pt-5 pl-md-4 pl-sm-3 pt-sm-0">
|
||||
<div class="row">
|
||||
{{ range .softSkills }}
|
||||
{{ partial "misc/soft-skills.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
15
layouts/partials/sections/achievements.html
Normal file
15
layouts/partials/sections/achievements.html
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<div class="container-fluid anchor pb-5 achievements-section" id="{{ replace (lower .section.name) " " "-" }}">
|
||||
{{ if not (.section.hideTitle) }}
|
||||
<h1 class="text-center">{{ .section.name }}</h1>
|
||||
{{ end }}
|
||||
<div class="container">
|
||||
<div class="row" id="gallery">
|
||||
</div>
|
||||
</div>
|
||||
<!-- achievements-holder holds achievement-entry -->
|
||||
<div class="d-none" id="achievements-holder">
|
||||
{{ range .achievements }}
|
||||
{{ partial "sections/achievements/entry.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
11
layouts/partials/sections/achievements/entry.html
Normal file
11
layouts/partials/sections/achievements/entry.html
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
<div
|
||||
class="achievement-entry text-center"
|
||||
style="background-image: url({{ .image }});"
|
||||
>
|
||||
<i class="fas fa-search-plus" id="enlarge-icon"></i>
|
||||
<h4 class="title" id="achievement-title">{{ .title }}</h4>
|
||||
<div class="caption hidden col-lg-6 text-left" id="caption">
|
||||
<h4>{{ .title }}</h4>
|
||||
<p>{{ .summary | markdownify }}</p>
|
||||
</div>
|
||||
</div>
|
||||
25
layouts/partials/sections/experiences.html
Normal file
25
layouts/partials/sections/experiences.html
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
<div class="container-fluid anchor pb-5 experiences-section" id="{{ replace (lower .section.name) " " "-" }}">
|
||||
{{ if not (.section.hideTitle) }}
|
||||
<h1 class="text-center">{{ .section.name }}</h1>
|
||||
{{ end }}
|
||||
|
||||
<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 "sections/experiences/vertical-line.html" $index }}
|
||||
{{ partial "sections/experiences/experience-info.html" $experience }}
|
||||
</div>
|
||||
{{else}}
|
||||
<div class="row align-items-center justify-content-end d-flex">
|
||||
{{ partial "sections/experiences/experience-info.html" $experience }}
|
||||
{{ partial "sections/experiences/vertical-line.html" $index }}
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ if lt $index (sub $totalExperiences 1) }}
|
||||
{{ partial "sections/experiences/horizontal-line.html" $index }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
{{ if gt (len .positions) 1 }}
|
||||
{{ partial "sections/experiences/multiple-positions" . }}
|
||||
{{ else }}
|
||||
{{ partial "sections/experiences/single-position.html" . }}
|
||||
{{ end }}
|
||||
11
layouts/partials/sections/experiences/horizontal-line.html
Normal file
11
layouts/partials/sections/experiences/horizontal-line.html
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
<div class="row horizontal-line">
|
||||
<div class="col-1 col-lg-2 timeline-side-div">
|
||||
<div class="corner"></div>
|
||||
</div>
|
||||
<div class="col-10 col-lg-8">
|
||||
<hr />
|
||||
</div>
|
||||
<div class="col-1 col-lg-2 timeline-side-div">
|
||||
<div class="corner"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<div class="col-10 col-lg-8">
|
||||
<div class="experience-entry-heading">
|
||||
<!-- For multiple positions, give emphasis on the company name-->
|
||||
<h5>{{ if .company.url }}<a href={{.company.url}}>{{ .company.name }}</a>{{ else }}{{ .company.name }}{{ end }}</h5>
|
||||
|
||||
<!-- 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}}
|
||||
<p class="text-muted">
|
||||
{{ $oldestPosition.start }} - {{ if $mostRecentPosition.end }}{{ $mostRecentPosition.end }}{{ else }}Present{{ end }},
|
||||
{{ .company.location }}
|
||||
</p>
|
||||
<!-- Add company overview -->
|
||||
<p>{{ .company.overview | markdownify }}</p>
|
||||
</div>
|
||||
<!-- Add the positions information -->
|
||||
<div class="positions">
|
||||
{{ range $index,$position:= .positions }}
|
||||
<h6 class="designation">{{ $position.designation }}</h6>
|
||||
<p class="text-muted">{{ $position.start }} - {{if $position.end }} {{ $position.end }} {{else}} Present {{end}}</p>
|
||||
<!-- Add the responsibilities handled at this position -->
|
||||
<ul class="justify-content-around">
|
||||
{{ range $position.responsibilities }}
|
||||
<li>{{ . | markdownify }}</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
21
layouts/partials/sections/experiences/single-position.html
Normal file
21
layouts/partials/sections/experiences/single-position.html
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
<div class="col-10 col-lg-8">
|
||||
<div class="experience-entry-heading">
|
||||
{{ $position:= index .positions 0 }}
|
||||
<!-- For single position, give emphasis on the designation-->
|
||||
<h5>{{ $position.designation }}</h5>
|
||||
<h6>{{ if .company.url }}<a href={{.company.url}}>{{ .company.name }}</a>{{ else }}{{ .company.name }}{{ end }}</h6>
|
||||
<!-- Add experience duration info -->
|
||||
<p class="text-muted">{{ $position.start }} - {{ if $position.end }}{{ $position.end }}{{ else }}Present{{ end }},
|
||||
{{ .company.location }}
|
||||
</p>
|
||||
</div>
|
||||
<!-- Add company overview -->
|
||||
<p>{{ .company.overview | markdownify }}</p>
|
||||
<!-- Add the responsibilities handled at this position -->
|
||||
<h6 class="text-muted">Responsibilities:</h6>
|
||||
<ul class="justify-content-around">
|
||||
{{ range $position.responsibilities }}
|
||||
<li>{{ . | markdownify }}</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</div>
|
||||
3
layouts/partials/sections/experiences/vertical-line.html
Normal file
3
layouts/partials/sections/experiences/vertical-line.html
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<div class="col-1 col-lg-2 text-center vertical-line d-inline-flex justify-content-center">
|
||||
<div class="circle font-weight-bold">{{ add . 1 }}</div>
|
||||
</div>
|
||||
34
layouts/partials/sections/home.html
Normal file
34
layouts/partials/sections/home.html
Normal file
|
|
@ -0,0 +1,34 @@
|
|||
<div class="container-fluid home" id="home">
|
||||
<div
|
||||
class="background container-fluid"
|
||||
style="background-image: url('{{ if .Site.Params.background }}{{ .Site.Params.background }}{{ else }}/assets/images/default-background.jpg{{ end }}');"
|
||||
></div>
|
||||
<div class="container content text-center">
|
||||
<img src="{{ if .Site.Params.author.image }}{{ .Site.Params.author.image }}{{ else }}/assets/images/default-avatar.png{{ end }}"
|
||||
class="rounded-circle mx-auto d-block img-fluid"
|
||||
/>
|
||||
<h1 class="greeting">Hi, I am
|
||||
{{ if .Site.Params.author.nickname }}
|
||||
{{ .Site.Params.author.nickname }}
|
||||
{{ else if .Site.Params.author.name }}
|
||||
{{ .Site.Params.author.name }}
|
||||
{{ else }}
|
||||
Jane Doe
|
||||
{{ end }}
|
||||
</h1>
|
||||
<div class="typing-carousel">
|
||||
<span id="ityped" class="ityped"></span>
|
||||
<span class="ityped-cursor"></span>
|
||||
</div>
|
||||
<ul id="typing-carousel-data">
|
||||
{{ range .Site.Params.author.summary }}
|
||||
<li>{{ . }}</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ if .Site.Data.sections }}
|
||||
{{ range first 1 (where (sort .Site.Data.sections "section.weight") ".section.enable" true) }}
|
||||
<a href="#{{ replace (lower .section.name) " " "-" }}"><i class="arrow bounce fa fa-chevron-down"></i></a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
21
layouts/partials/sections/projects.html
Normal file
21
layouts/partials/sections/projects.html
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
<div class="container-fluid anchor pb-5 projects-section" id="{{ replace (lower .section.name) " " "-" }}">
|
||||
{{ if not (.section.hideTitle) }}
|
||||
<h1 class="text-center">{{ .section.name }}</h1>
|
||||
{{ end }}
|
||||
<div class="container ml-auto text-center">
|
||||
<div class="btn-group flex-wrap" role="group" id="project-filter-buttons">
|
||||
{{ range .buttons }}
|
||||
<button type="button" class="btn btn-dark" data-filter="{{ .filter }}">
|
||||
{{ .name }}
|
||||
</button>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="container filtr-projects">
|
||||
<div class="row" id="project-card-holder">
|
||||
{{ range .projects }}
|
||||
{{ partial "cards/project" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
12
layouts/partials/sections/recent-posts.html
Normal file
12
layouts/partials/sections/recent-posts.html
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
<div class="container-fluid anchor pb-5 recent-posts-section" id="{{ replace (lower .section.name) " " "-" }}">
|
||||
{{ if not (.section.hideTitle) }}
|
||||
<h1 class="text-center">{{ .section.name }}</h1>
|
||||
{{ end }}
|
||||
<div class="container">
|
||||
<div class="row" id="recent-post-cards">
|
||||
{{ range first 3 (where site.RegularPages.ByDate.Reverse "Type" "in" site.Params.mainSections )}}
|
||||
{{ partial "cards/recent-post.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
12
layouts/partials/sections/skills.html
Normal file
12
layouts/partials/sections/skills.html
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
<div class="container-fluid anchor pb-5 skills-section" id="{{ replace (lower .section.name) " " "-" }}">
|
||||
{{ if not (.section.hideTitle) }}
|
||||
<h1 class="text-center">{{ .section.name }}</h1>
|
||||
{{ end }}
|
||||
<div class="container d-flex-block">
|
||||
<div class="row" id="primary-skills">
|
||||
{{ range .skills }}
|
||||
{{ partial "cards/skill.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue