Make home page sections dynamic and configurable (#14)
* Make home page sections dynamic and configurable * Fix navbar issue when no section is configured + fix next-prev navigator * Update exampleSite * Fix next-prev navigator * Make navbar brand URL context aware
This commit is contained in:
parent
8f99f05a98
commit
e2d376215a
32 changed files with 455 additions and 363 deletions
|
@ -1,49 +1,45 @@
|
|||
<div class="container-fluid about bg-white anchor p-md-5 d-flex" id="about">
|
||||
<div class="container">
|
||||
<div class="row pt-sm-2 pt-md-4 align-self-center">
|
||||
{{ if .Site.Data.about }}
|
||||
<!-- summery -->
|
||||
<div class="col-md-6">
|
||||
<h3 class="p-1">{{ .Site.Data.site.author.name }}</h3>
|
||||
{{ if .Site.Data.about.designation }}
|
||||
<h5 class="p-1">
|
||||
{{ .Site.Data.about.designation }}
|
||||
{{ if .Site.Data.about.company }}
|
||||
at <a href="{{ .Site.Data.about.company.url }}">{{ .Site.Data.about.company.name }}</a>
|
||||
{{ end }}
|
||||
</h5>
|
||||
{{ end }}
|
||||
<p class="p-1 text-justify">
|
||||
{{ .Site.Data.about.summary | markdownify }}
|
||||
</p>
|
||||
<div class="text-container ml-auto">
|
||||
<ul class="social-link d-flex">
|
||||
{{ range .Site.Data.about.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 .Site.Data.about.resume }}
|
||||
<a href="{{ .Site.Data.about.resume }}" target="#"
|
||||
><button class="btn btn-dark">My Resume</button></a
|
||||
>
|
||||
{{ end }}
|
||||
</div>
|
||||
<!-- soft skills circular-progressbar -->
|
||||
<div class="col-md-6 pt-5 pl-md-4 pl-sm-3 pt-md-0">
|
||||
<div class="row">
|
||||
{{ range .Site.Data.about.softSkills }}
|
||||
{{ partial "progress/soft-skills" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="container anchor p-md-5" id="about">
|
||||
<div class="row pt-sm-2 pt-md-4 align-self-center">
|
||||
<!-- summery -->
|
||||
<div class="col-md-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-md-6 pt-5 pl-md-4 pl-sm-3 pt-md-0">
|
||||
<div class="row">
|
||||
{{ range .softSkills }}
|
||||
{{ partial "progress/soft-skills" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,16 +1,13 @@
|
|||
<div class="container-fluid achievements bg-dimmed anchor pb-5" id="achievements">
|
||||
{{ if .Site.Data.achievements }}
|
||||
<h1 class="text-center">Achievements</h1>
|
||||
|
||||
<div class="container">
|
||||
<div class="row" id="gallery">
|
||||
</div>
|
||||
<div class="container-fluid anchor pb-5" id="achievements">
|
||||
<h1 class="text-center">{{ .section.name }}</h1>
|
||||
<div class="container">
|
||||
<div class="row" id="gallery">
|
||||
</div>
|
||||
<!-- achievements-holder holds achievement-entry -->
|
||||
<div class="d-none" id="achievements-holder">
|
||||
{{ range .Site.Data.achievements.achievements }}
|
||||
{{ partial "misc/achievement.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<!-- achievements-holder holds achievement-entry -->
|
||||
<div class="d-none" id="achievements-holder">
|
||||
{{ range .achievements }}
|
||||
{{ partial "misc/achievement.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,25 +1,23 @@
|
|||
<div class="container-fluid experiences bg-white anchor" id="experiences">
|
||||
{{ if .Site.Data.experiences }}
|
||||
<h1 class="text-center">Experiences</h1>
|
||||
<div class="container-fluid anchor" id="experiences">
|
||||
<h1 class="text-center">{{ .section.name }}</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 }}
|
||||
<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 }}
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ if lt $index (sub $totalExperiences 1) }}
|
||||
{{ partial "experiences/horizontal-line.html" $index }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -3,20 +3,23 @@
|
|||
<div class="row text-left">
|
||||
<div class="col-md-4 col-sm-12">
|
||||
<h5>Navigation</h5>
|
||||
{{ if .Site.Data.site }}
|
||||
<ul>
|
||||
{{ range .Site.Data.site.menus }}
|
||||
{{ if .Site.Data.sections }}
|
||||
<ul>
|
||||
{{- range sort .Site.Data.sections "section.weight" }}
|
||||
{{ if .section.enable }}
|
||||
<li class="nav-item">
|
||||
<a class="smooth-scroll" href="{{ .url }}">{{ .name }}</a>
|
||||
<a class="smooth-scroll" href="#{{ replace (lower .section.name) " " "-" }}">{{ .section.name }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{- end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-12">
|
||||
<h5>Contact Me</h5>
|
||||
<ul>
|
||||
{{ range $key,$value:=.Site.Data.site.author.contactInfo }}
|
||||
{{ range $key,$value:=.Site.Params.author.contactInfo }}
|
||||
<li><span>{{ title $key }}: </span> <span>{{ $value }}</span></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
|
|
|
@ -1,20 +1,20 @@
|
|||
<div class="container-fluid home" id="home">
|
||||
<div
|
||||
class="background container-fluid"
|
||||
style="background-image: url('{{ if .Site.Data.site.background }}{{ .Site.Data.site.background }}{{ else }}/assets/images/default-background.jpg{{ end }}');"
|
||||
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.Data.site.author.image }}{{ .Site.Data.site.author.image }}{{ else }}/assets/images/default-avatar.png{{ end }}"
|
||||
<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.Data.site.author.name }}{{ .Site.Data.site.author.name }}{{ else }}Jane Doe{{ end }}
|
||||
<h1 class="greeting">Hi, I am {{ 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.Data.site.author.summary }}
|
||||
{{ range .Site.Params.author.summary }}
|
||||
<li>{{ . }}</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<nav class="navbar navbar-expand-lg top-navbar final-navbar shadow">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="{{ .baseURL }}">
|
||||
<a class="navbar-brand" href="{{ .navBrandURL }}">
|
||||
<img src="/assets/images/logo.png">
|
||||
{{- .title -}}
|
||||
</a>
|
||||
|
@ -11,7 +11,6 @@
|
|||
<div class="collapse navbar-collapse" id="top-nav-items">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
</ul>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
|
|
@ -16,15 +16,37 @@
|
|||
|
||||
<div class="collapse navbar-collapse" id="top-nav-items">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
{{ range .Site.Data.site.menus }}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link smooth-scroll" href="{{ .url }}">{{ .name }}</a>
|
||||
<a class="nav-link smooth-scroll" href="#home">Home</a>
|
||||
</li>
|
||||
{{- if .Site.Data.sections }}
|
||||
{{- range sort .Site.Data.sections "section.weight" }}
|
||||
{{ if .section.showOnNavbar }}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link smooth-scroll" href="#{{ replace (lower .section.name) " " "-" }}">{{ .section.name }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
{{ $hasCustomMenus:= false }}
|
||||
{{ if and site.Params.customMenus }}
|
||||
{{ if gt (len site.Params.customMenus) 0 }}
|
||||
{{ $hasCustomMenus = true }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ if (or site.Params.enableBlogPost $hasCustomMenus) }}
|
||||
<div class="dropdown-divider" id="top-navbar-divider"></div>
|
||||
{{ end }}
|
||||
{{ if site.Params.enableBlogPost }}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" id="blog-link" href="/posts">Posts</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
{{ range site.Params.customMenus }}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{{ .url }}" target="/">{{ .name }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
<div class="dropdown-divider" id="top-navbar-divider"></div>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" id="blog-link" href="/posts">Blog</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
|
35
layouts/partials/next-prev-navigator.html
Normal file
35
layouts/partials/next-prev-navigator.html
Normal file
|
@ -0,0 +1,35 @@
|
|||
<div class="row next-prev-navigator">
|
||||
{{ $currentPage := . }}
|
||||
{{ range (where site.RegularPages.ByDate "Type" "in" site.Params.mainSections )}}
|
||||
{{ if eq .RelPermalink $currentPage.RelPermalink }}
|
||||
{{ if .Next }}
|
||||
{{ if (in site.Params.mainSections .Next.Type) }}
|
||||
<div class="col-md-6 previous-article">
|
||||
<a href="{{.Next.RelPermalink}}" class="btn btn-outline-info">
|
||||
<span><i class="fas fa-chevron-circle-left"></i> Prev</span>
|
||||
<br />
|
||||
<span>{{ .Next.Title }}</span>
|
||||
</a>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ if .Prev }}
|
||||
{{ if (in site.Params.mainSections .Prev.Type) }}
|
||||
{{ $columnWidth:="col-md-12" }}
|
||||
{{ if .Next }}
|
||||
{{ if (in site.Params.mainSections .Next.Type) }}
|
||||
{{ $columnWidth = "col-md-6" }}
|
||||
{{ end }}
|
||||
{{ end}}
|
||||
<div class="{{ $columnWidth }} next-article">
|
||||
<a href="{{ .Prev.RelPermalink }}" class="btn btn-outline-info">
|
||||
<span>Next <i class="fas fa-chevron-circle-right"></i></span>
|
||||
<br />
|
||||
<span>{{ .Prev.Title }}</span>
|
||||
</a>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
|
@ -1,21 +1,19 @@
|
|||
<div class="container-fluid projects bg-dimmed anchor pb-5" id="projects">
|
||||
{{ if .Site.Data.projects }}
|
||||
<h1 class="text-center">Projects</h1>
|
||||
<div class="container ml-auto text-center">
|
||||
<div class="btn-group flex-wrap" role="group" id="project-filter-buttons">
|
||||
{{ range .Site.Data.projects.buttons }}
|
||||
<button type="button" class="btn btn-dark" data-filter="{{ .filter }}">
|
||||
{{ .name }}
|
||||
</button>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="container-fluid anchor pb-5" id="projects">
|
||||
<h1 class="text-center">{{ .section.name }}</h1>
|
||||
<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 class="container filtr-projects">
|
||||
<div class="row" id="project-card-holder">
|
||||
{{ range .Site.Data.projects.projects }}
|
||||
{{ partial "cards/project" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="container filtr-projects">
|
||||
<div class="row" id="project-card-holder">
|
||||
{{ range .projects }}
|
||||
{{ partial "cards/project" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<div class="container-fluid recent-posts bg-white anchor pb-5" id="recent-posts">
|
||||
<h1 class="text-center">Recent Posts</h1>
|
||||
<div class="container-fluid anchor pb-5" id="recent-posts">
|
||||
<h1 class="text-center">{{ .section.name }}</h1>
|
||||
<div class="container">
|
||||
<div class="row" id="recent-post-cards">
|
||||
{{ range first 3 (where .Site.RegularPages.ByDate.Reverse "Type" "in" site.Params.mainSections )}}
|
||||
{{ range first 3 (where site.RegularPages.ByDate.Reverse "Type" "in" site.Params.mainSections )}}
|
||||
{{ partial "cards/recent-post.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
|
|
|
@ -1,13 +1,11 @@
|
|||
<div class="container-fluid skills bg-dimmed anchor pb-5" id="skills">
|
||||
{{ if .Site.Data.skills }}
|
||||
<h1 class="text-center">Skills</h1>
|
||||
<div class="container-fluid anchor pb-5" id="skills">
|
||||
<h1 class="text-center">{{ .section.name }}</h1>
|
||||
|
||||
<div class="container d-flex-block">
|
||||
<div class="row" id="primary-skills">
|
||||
{{ range .Site.Data.skills.skills }}
|
||||
{{ partial "cards/skill.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="container d-flex-block">
|
||||
<div class="row" id="primary-skills">
|
||||
{{ range .skills }}
|
||||
{{ partial "cards/skill.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue