diff options
author | Md. Emruz Hossain <hossainemruz@gmail.com> | 2020-06-29 22:54:28 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2020-06-29 22:54:28 +0300 |
commit | e2d376215ac52d8d69a5a1fae7eb8041d0f4fa23 (patch) | |
tree | ba66eb0e2d375c7f75caade05d0570843f55c5fb /layouts | |
parent | 8f99f05a984f94b5ab8aa6af85f4e93d37464c6c (diff) |
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
Diffstat (limited to 'layouts')
-rw-r--r-- | layouts/_default/list.html | 2 | ||||
-rw-r--r-- | layouts/_default/single.html | 28 | ||||
-rw-r--r-- | layouts/index.html | 37 | ||||
-rw-r--r-- | layouts/partials/about.html | 82 | ||||
-rw-r--r-- | layouts/partials/achievements.html | 25 | ||||
-rw-r--r-- | layouts/partials/experiences.html | 42 | ||||
-rw-r--r-- | layouts/partials/footer.html | 15 | ||||
-rw-r--r-- | layouts/partials/home.html | 8 | ||||
-rw-r--r-- | layouts/partials/navbar-2.html | 3 | ||||
-rw-r--r-- | layouts/partials/navbar.html | 34 | ||||
-rw-r--r-- | layouts/partials/next-prev-navigator.html | 35 | ||||
-rw-r--r-- | layouts/partials/projects.html | 34 | ||||
-rw-r--r-- | layouts/partials/recent-posts.html | 6 | ||||
-rw-r--r-- | layouts/partials/skills.html | 18 |
14 files changed, 196 insertions, 173 deletions
diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 7b00091..5f463ab 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -3,7 +3,7 @@ {{ end }} {{ define "navbar" }} - {{ partial "navbar-2.html" (dict "baseURL" .Site.BaseURL "title" .Site.Title "hasToggleButton" true) }} + {{ partial "navbar-2.html" (dict "baseURL" .Site.BaseURL "title" .Site.Title "hasToggleButton" true "navBrandURL" .Site.BaseURL ) }} {{ end }} {{ define "content" }} diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 30dc63d..42b71f7 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -7,7 +7,7 @@ {{ end }} {{ define "navbar" }} - {{ partial "navbar-2.html" (dict "baseURL" .Site.BaseURL "title" .Site.Title "hasToggleButton" false) }} + {{ partial "navbar-2.html" (dict "baseURL" .Site.BaseURL "title" .Site.Title "hasToggleButton" false "navBrandURL" "/posts") }} {{ end }} {{ define "content" }} @@ -44,31 +44,7 @@ <!---Next and Previous Navigator --> <hr /> - <div class="row next-prev-navigator"> - {{ $currentPage := . }} - {{ range .Site.RegularPages.ByDate }} - {{ if eq .RelPermalink $currentPage.RelPermalink }} - {{ if .Next }} - <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 }} - {{ if .Prev }} - <div class="{{ if .Next }}col-md-6{{ else }}col-md-12{{ end }} 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 }} - </div> + {{ partial "next-prev-navigator.html" . }} <hr /> <!-- Add Disqus forum --> {{ if .Site.DisqusShortname }} diff --git a/layouts/index.html b/layouts/index.html index a9dd4ea..507e1a8 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -19,30 +19,31 @@ {{ template "_internal/google_analytics_async.html" . }} {{ end }} </head> - <body data-spy="scroll" data-target="#top-navbar" data-offset="50"> + <body data-spy="scroll" data-target="#top-navbar" data-offset="100"> + <!--- NAVBAR -------------------------> {{- partial "navbar.html" . -}} <!--- ADD HOME SECTION ----------------> {{- partial "home.html" . -}} - <!--- ADD ABOUT SECTION ---------------> - {{- partial "about.html" . -}} - - <!--- ADD SKILLS SECTION --------------> - {{- partial "skills.html" . -}} - - <!--- ADD EXPERIENCE SECTION -----------> - {{- partial "experiences.html" . -}} - - <!--- ADD PROJECT SECTION --------------> - {{- partial "projects.html" . -}} - - <!--- ADD RECENT-POSTS SECTION ---------> - {{- partial "recent-posts.html" . -}} - - <!--- ADD ACHIEVEMENT SECTION ----------> - {{- partial "achievements.html" . -}} + <!--- ADD OPTIONAL SECTIONS -----------> + {{ if .Site.Data.sections }} + {{ $background:= "bg-white"}} + {{ range sort .Site.Data.sections "section.weight" }} + {{ if .section.enable }} + <div class="container-fluid section-holder d-flex {{ $background }}"> + {{- partial (printf "%s.html" (replace (lower .section.name) " " "-")) . -}} + </div> + <!--- alter background color for next section ---> + {{ if eq $background "bg-white" }} + {{ $background = "bg-dimmed" }} + {{ else }} + {{ $background = "bg-white" }} + {{end}} + {{ end }} + {{ end }} + {{ end }} <!--- ADD FOOTER -----------------------> {{- partial "footer.html" . -}} diff --git a/layouts/partials/about.html b/layouts/partials/about.html index ab178dc..2af5476 100644 --- a/layouts/partials/about.html +++ b/layouts/partials/about.html @@ -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> +<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 }} - </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 - > + </li> {{ 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> + </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> diff --git a/layouts/partials/achievements.html b/layouts/partials/achievements.html index 7cc6ebf..49b3ce9 100644 --- a/layouts/partials/achievements.html +++ b/layouts/partials/achievements.html @@ -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> diff --git a/layouts/partials/experiences.html b/layouts/partials/experiences.html index 91ad594..1c24938 100644 --- a/layouts/partials/experiences.html +++ b/layouts/partials/experiences.html @@ -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> diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 326aad2..555e211 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -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> diff --git a/layouts/partials/home.html b/layouts/partials/home.html index a201309..d67eccd 100644 --- a/layouts/partials/home.html +++ b/layouts/partials/home.html @@ -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> diff --git a/layouts/partials/navbar-2.html b/layouts/partials/navbar-2.html index c0ff089..03fb869 100644 --- a/layouts/partials/navbar-2.html +++ b/layouts/partials/navbar-2.html @@ -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> diff --git a/layouts/partials/navbar.html b/layouts/partials/navbar.html index a299fcf..253c54d 100644 --- a/layouts/partials/navbar.html +++ b/layouts/partials/navbar.html @@ -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> diff --git a/layouts/partials/next-prev-navigator.html b/layouts/partials/next-prev-navigator.html new file mode 100644 index 0000000..eca6632 --- /dev/null +++ b/layouts/partials/next-prev-navigator.html @@ -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> diff --git a/layouts/partials/projects.html b/layouts/partials/projects.html index 3d2d371..3d2bcd4 100644 --- a/layouts/partials/projects.html +++ b/layouts/partials/projects.html @@ -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> diff --git a/layouts/partials/recent-posts.html b/layouts/partials/recent-posts.html index 10508f4..a69cc05 100644 --- a/layouts/partials/recent-posts.html +++ b/layouts/partials/recent-posts.html @@ -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> diff --git a/layouts/partials/skills.html b/layouts/partials/skills.html index 8088b4d..58b1f44 100644 --- a/layouts/partials/skills.html +++ b/layouts/partials/skills.html @@ -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> |