FunctionalHacker/hugo-toha
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make home page sections dynamic and configurable (#14)

Browse source 
* 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:
Md. Emruz Hossain 2020-06-30 01:54:28 +06:00 • committed by GitHub
parent 8f99f05a98
commit e2d376215a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
32 changed files with 455 additions and 363 deletions
Download patch file Download diff file Expand all files Collapse all files

28
exampleSite/config.yaml
View file

@ -20,5 +20,31 @@ enableEmoji: true
# Custom parameters # Custom parameters
params: params:
# Github Repo URL. This is used to add "Improve This Page" button # background image of the landing page
background: "images/background.jpg"
# GitHub repo URL of your site
gitRepo: https://github.com/hossainemruz/toha-example-site gitRepo: https://github.com/hossainemruz/toha-example-site
# specify whether you want to write blog post or not
enableBlogPost: true
# specify the list of custom menus that you want to show in the top navbar.
# they will be separated by a divider from the main menus.
customMenus:
- name: Notes
url: https://hossainnotes.netlify.app/docs/example/
# some information about you
author:
name: "Jane Doe"
image: "images/avatar.png"
# give your some contact information. they will be used in the footer
contactInfo:
email: "janedoe@example.com"
phone: "+0123456789"
# a summary of what you do
summary:
- I am a Developer
- I work with Go
- I love to work with some fun projects

14
exampleSite/data/achievements.yaml
View file

@ -1,14 +0,0 @@
# Your achievements achievements
achievements:
- title: Best Presenter
image: images/achievements/presenter.jpg
summary: Best presenter in 2020 XYZ conference.
- title: Champion
image: images/achievements/sport.jpg
summary: Champion in cycling inter-city cycling championship 2020.
- title: Graduation
image: images/achievements/graduation-cap.jpg
summary: Received Bachelor of Science (B.Sc.) in Computer Science and Engineer from XYZ University.
- title: Award Winner
image: images/achievements/woman-winner.jpg
summary: Lorem ipsum dolor sit amet consectetur adipisicing elit. Possimus architecto minus facere vero?

43
exampleSite/data/experiences.yaml
View file

@ -1,43 +0,0 @@
# Your experiences
experiences:
- designation: Software Engineer
company:
name: Example Co.
url: "https://www.example.com"
location: Dhaka Branch
# company overview
overview: Example Co. is a widely recognized company for cloud native development. It build tools for Kubernetes.
start: Nov 2017
# don't provide end date if you are currently working there. It will be replaced by "Present"
# end: Dec 2020
# give some points about what was your responsibilities at the company.
responsibilities:
- Design, develop and manage disaster recovery tool [Xtool](https://www.example.com) that backup Kubernetes volumes, databases and cluster's resource definition.
- My another responsibilities.
- My more responsibilities.
- designation: Software Engineer
company:
name: PreExample Co.
url: "https://www.preexample.com"
location: Nowhere
overview: PreExample Co. is gateway company to enter into Example co. So, nothing special here.
start: March 2016
end: May 2017
responsibilities:
- Write lots of example codes.
- Read lots of examples.
- See lots of example videos.
- designation: Intern
company:
name: Intern Counting Company (ICC).
url: "https://www.intern.com"
location: Intern Land
overview: Intern counting Company (ICC) is responsible for counting worldwide intern Engineer.
start: Jun 2015
end: Jan 2016
responsibilities:
- Count lost of interns.
- Count more interns.
- Count myself as intern.

54
exampleSite/data/projects.yaml
View file

@ -1,54 +0,0 @@
# filter buttons
buttons:
- name: All
filter: "all"
- name: Professional
filter: "professional"
- name: Academic
filter: "academic"
- name: Hobby
filter: "hobby"
# your projects
projects:
- name: Kubernetes
logo: images/projects/kubernetes.png
role: Contributor
timeline: "March 2018 - Present"
repo: https://github.com/kubernetes/kubernetes # if your project is public repo on github, then provide this link. it will show star count.
#url: "" # if your project is not a public repo but it has a website, or any external details url then provide it here. don't provide "repo" and "url" simultaneously.
summary: Production-Grade Container Scheduling and Management .
tags: ["professional", "kubernetes", "cloud"]
- name: Tensorflow
logo: images/projects/tensorflow.png
role: Developer
timeline: "Jun 2018 - Present"
repo: https://github.com/tensorflow/tensorflow
#url: ""
summary: An Open Source Machine Learning Framework for Everyone.
tags: ["professional", "machine-learning","academic"]
- name: A sample academic paper
role: Team Lead
timeline: "Jan 2017 - Nov 2017"
url: "https://www.example.com"
summary: Lorem ipsum dolor sit amet consectetur adipisicing elit. Sapiente eius reprehenderit animi suscipit autem eligendi esse amet aliquid error eum. Accusantium distinctio soluta aliquid quas placeat modi suscipit eligendi nisi.
tags: ["academic","iot"]
- name: Nocode
logo: images/projects/no-code.png
role: Nothing
timeline: "Oct 2019 - Dec 2019"
repo: https://github.com/kelseyhightower/nocode
#url: ""
summary: The best way to write secure and reliable applications. Write nothing; deploy nowhere.
tags: ["hobby", "fun"]
- name: Toha
logo: images/projects/toha.png
role: Owner
timeline: "Jun 2019 - Present"
repo: https://github.com/hossainemruz/toha
summary: A Hugo theme for personal portfolio.
tags: ["hobby","hugo","theme","professional"]

9
exampleSite/data/about.yaml → exampleSite/data/sections/about.yaml
View file

@ -1,3 +1,10 @@
# section information
section:
name: About
enable: true
weight: 1
showOnNavbar: true
# your designation # your designation
designation: Software Engineer designation: Software Engineer
# your company information # your company information
@ -53,4 +60,4 @@ softSkills:
color: pink color: pink
- name: Hard Working - name: Hard Working
percentage: 85 percentage: 85
color: green color: green

21
exampleSite/data/sections/achievements.yaml Normal file
View file

@ -0,0 +1,21 @@
# section information
section:
name: Achievements
enable: true
weight: 6
showOnNavbar: true
# Your achievements achievements
achievements:
- title: Best Presenter
image: images/achievements/presenter.jpg
summary: Best presenter in the 2020 XYZ conference.
- title: Champion
image: images/achievements/sport.jpg
summary: Champion in cycling inter-city cycling championship 2020.
- title: Graduation
image: images/achievements/graduation-cap.jpg
summary: Received Bachelor of Science (B.Sc.) in Computer Science and Engineer from XYZ University.
- title: Award Winner
image: images/achievements/woman-winner.jpg
summary: Lorem ipsum dolor sit amet consectetur adipisicing elit. Possimus architecto minus facere vero?

51
exampleSite/data/sections/experiences.yaml Normal file
View file

@ -0,0 +1,51 @@
# section information
section:
name: Experiences
enable: true
weight: 3
showOnNavbar: true
# Your experiences
experiences:
- designation: Software Engineer
company:
name: Example Co.
url: "https://www.example.com"
location: Dhaka Branch
# company overview
overview: Example Co. is a widely recognized company for cloud-native development. It builds tools for Kubernetes.
start: Nov 2017
# don't provide end date if you are currently working there. It will be replaced by "Present"
# end: Dec 2020
# give some points about what was your responsibilities at the company.
responsibilities:
- Design, develop and manage disaster recovery tool [Xtool](https://www.example.com) that backup Kubernetes volumes, databases, and cluster's resource definition.
- My another responsibility.
- My more responsibilities.
- designation: Software Engineer
company:
name: PreExample Co.
url: "https://www.preexample.com"
location: Nowhere
overview: PreExample Co. is a gateway company to enter into Example co. So, nothing special here.
start: March 2016
end: May 2017
responsibilities:
- Write lots of example codes.
- Read lots of examples.
- See lots of example videos.
- designation: Intern
company:
name: Intern Counting Company (ICC).
url: "https://www.intern.com"
location: Intern Land
overview: Intern counting Company (ICC) is responsible for counting worldwide intern Engineers.
start: Jun 2015
end: Jan 2016
responsibilities:
- Count lost of interns.
- Count more interns.
- Count me as an intern.

61
exampleSite/data/sections/projects.yaml Normal file
View file

@ -0,0 +1,61 @@
# section information
section:
name: Projects
enable: true
weight: 4
showOnNavbar: true
# filter buttons
buttons:
- name: All
filter: "all"
- name: Professional
filter: "professional"
- name: Academic
filter: "academic"
- name: Hobby
filter: "hobby"
# your projects
projects:
- name: Kubernetes
logo: images/projects/kubernetes.png
role: Contributor
timeline: "March 2018 - Present"
repo: https://github.com/kubernetes/kubernetes # If your project is a public repo on GitHub, then provide this link. it will show star count.
#url: "" # If your project is not a public repo but it has a website or any external details url then provide it here. don't provide "repo" and "url" simultaneously.
summary: Production-Grade Container Scheduling and Management.
tags: ["professional", "kubernetes", "cloud"]
- name: Tensorflow
logo: images/projects/tensorflow.png
role: Developer
timeline: "Jun 2018 - Present"
repo: https://github.com/tensorflow/tensorflow
#url: ""
summary: An Open Source Machine Learning Framework for Everyone.
tags: ["professional", "machine-learning","academic"]
- name: A sample academic paper
role: Team Lead
timeline: "Jan 2017 - Nov 2017"
url: "https://www.example.com"
summary: Lorem ipsum dolor sit amet consectetur adipisicing elit. Sapiente eius reprehenderit animi suscipit autem eligendi esse amet aliquid error eum. Accusantium distinctio soluta aliquid quas placeat modi suscipit eligendi nisi.
tags: ["academic","iot"]
- name: Nocode
logo: images/projects/no-code.png
role: Nothing
timeline: "Oct 2019 - Dec 2019"
repo: https://github.com/kelseyhightower/nocode
#url: ""
summary: The best way to write secure and reliable applications. Write nothing; deploy nowhere.
tags: ["hobby", "fun"]
- name: Toha
logo: images/projects/toha.png
role: Owner
timeline: "Jun 2019 - Present"
repo: https://github.com/hossainemruz/toha
summary: A Hugo theme for personal portfolio.
tags: ["hobby","hugo","theme","professional"]

8
exampleSite/data/sections/recent-posts.yaml Normal file
View file

@ -0,0 +1,8 @@
# section information
section:
name: Recent Posts
enable: true
weight: 5
showOnNavbar: true
# no other configuration is required

15
exampleSite/data/skills.yaml → exampleSite/data/sections/skills.yaml
View file

@ -1,5 +1,12 @@
# section information
section:
name: Skills
enable: true
weight: 2
showOnNavbar: true
# Your Skills. # Your Skills.
# Give a summary of you each skill in summary section. # Give a summary of you each skill in the summary section.
skills: skills:
- name: Kubernetes - name: Kubernetes
icon: "images/skills/kubernetes.png" icon: "images/skills/kubernetes.png"
@ -7,7 +14,7 @@ skills:
- name: Go Development - name: Go Development
icon: "images/skills/go.png" icon: "images/skills/go.png"
summary: "Using as main language for professional development. Capable of writing scalable, testable, and maintainable program." summary: "Using as the main language for professional development. Capable of writing scalable, testable, and maintainable program."
- name: Cloud Computing - name: Cloud Computing
icon: "images/skills/cloud.png" icon: "images/skills/cloud.png"
@ -23,11 +30,11 @@ skills:
- name: Linux - name: Linux
icon: "images/skills/linux.png" icon: "images/skills/linux.png"
summary: "Using as main operating system. Capable of writing bash/shell scripts." summary: "Using as the main operating system. Capable of writing bash/shell scripts."
- name: Git - name: Git
icon: "images/skills/git.png" icon: "images/skills/git.png"
summary: "Experienced with git based development. Mostly, use Github. Also have experience in working with GitLab." summary: "Experienced with git-based development. Mostly, use Github. Also, have experience in working with GitLab."
- name: C++ - name: C++
icon: "images/skills/c++.png" icon: "images/skills/c++.png"

40
exampleSite/data/site.yaml
View file

@ -1,40 +0,0 @@
# background image of the landing page
background: "images/background.jpg"
# some information about you
author:
name: "Jane Doe"
image: "images/avatar.png"
# give your some contact information. they will be used in the footer
contactInfo:
email: "janedoe@example.com"
phone: "+0123456789"
# a summary of what you do
summary:
- I am a Developer
- I work with Go
- I love to work with some fun projects
# Menus of the home page
menus:
- name: Home
url: "#home"
weight: 1
- name: About
url: "#about"
weight: 2
- name: Skills
url: "#skills"
weight: 3
- name: Experiences
url: "#experiences"
weight: 4
- name: Projects
url: "#projects"
weight: 5
- name: Recent Posts
url: "#recent-posts"
weight: 6
- name: Achievements
url: "#achievements"
weight: 7

2
layouts/_default/list.html
View file

@ -3,7 +3,7 @@
{{ end }} {{ end }}
{{ define "navbar" }} {{ 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 }} {{ end }}
{{ define "content" }} {{ define "content" }}

28
layouts/_default/single.html
View file

@ -7,7 +7,7 @@
{{ end }} {{ end }}
{{ define "navbar" }} {{ 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 }} {{ end }}
{{ define "content" }} {{ define "content" }}
@ -44,31 +44,7 @@
<!---Next and Previous Navigator --> <!---Next and Previous Navigator -->
<hr /> <hr />
<div class="row next-prev-navigator"> {{ partial "next-prev-navigator.html" . }}
{{ $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>
<hr /> <hr />
<!-- Add Disqus forum --> <!-- Add Disqus forum -->
{{ if .Site.DisqusShortname }} {{ if .Site.DisqusShortname }}

37
layouts/index.html
View file

@ -19,30 +19,31 @@
{{ template "_internal/google_analytics_async.html" . }} {{ template "_internal/google_analytics_async.html" . }}
{{ end }} {{ end }}
</head> </head>
<body data-spy="scroll" data-target="#top-navbar" data-offset="50"> <body data-spy="scroll" data-target="#top-navbar" data-offset="100">
<!--- NAVBAR -------------------------> <!--- NAVBAR ------------------------->
{{- partial "navbar.html" . -}} {{- partial "navbar.html" . -}}
<!--- ADD HOME SECTION ----------------> <!--- ADD HOME SECTION ---------------->
{{- partial "home.html" . -}} {{- partial "home.html" . -}}
<!--- ADD ABOUT SECTION ---------------> <!--- ADD OPTIONAL SECTIONS ----------->
{{- partial "about.html" . -}} {{ if .Site.Data.sections }}
{{ $background:= "bg-white"}}
<!--- ADD SKILLS SECTION --------------> {{ range sort .Site.Data.sections "section.weight" }}
{{- partial "skills.html" . -}} {{ if .section.enable }}
<div class="container-fluid section-holder d-flex {{ $background }}">
<!--- ADD EXPERIENCE SECTION -----------> {{- partial (printf "%s.html" (replace (lower .section.name) " " "-")) . -}}
{{- partial "experiences.html" . -}} </div>
<!--- alter background color for next section --->
<!--- ADD PROJECT SECTION --------------> {{ if eq $background "bg-white" }}
{{- partial "projects.html" . -}} {{ $background = "bg-dimmed" }}
{{ else }}
<!--- ADD RECENT-POSTS SECTION ---------> {{ $background = "bg-white" }}
{{- partial "recent-posts.html" . -}} {{end}}
{{ end }}
<!--- ADD ACHIEVEMENT SECTION ----------> {{ end }}
{{- partial "achievements.html" . -}} {{ end }}
<!--- ADD FOOTER -----------------------> <!--- ADD FOOTER ----------------------->
{{- partial "footer.html" . -}} {{- partial "footer.html" . -}}

86
layouts/partials/about.html
View file

@ -1,49 +1,45 @@
<div class="container-fluid about bg-white anchor p-md-5 d-flex" id="about"> <div class="container anchor p-md-5" id="about">
<div class="container"> <div class="row pt-sm-2 pt-md-4 align-self-center">
<div class="row pt-sm-2 pt-md-4 align-self-center"> <!-- summery -->
{{ if .Site.Data.about }} <div class="col-md-6">
<!-- summery --> <h3 class="p-1">{{ site.Params.author.name }}</h3>
<div class="col-md-6"> {{ if .designation }}
<h3 class="p-1">{{ .Site.Data.site.author.name }}</h3> <h5 class="p-1">
{{ if .Site.Data.about.designation }} {{ .designation }}
<h5 class="p-1"> {{ if .company }}
{{ .Site.Data.about.designation }} at <a href="{{ .company.url }}">{{ .company.name }}</a>
{{ if .Site.Data.about.company }} {{ end }}
at <a href="{{ .Site.Data.about.company.url }}">{{ .Site.Data.about.company.name }}</a> </h5>
{{ 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>
{{ end }} {{ 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> </div>
</div> </div>

25
layouts/partials/achievements.html
View file

@ -1,16 +1,13 @@
<div class="container-fluid achievements bg-dimmed anchor pb-5" id="achievements"> <div class="container-fluid anchor pb-5" id="achievements">
{{ if .Site.Data.achievements }} <h1 class="text-center">{{ .section.name }}</h1>
<h1 class="text-center">Achievements</h1> <div class="container">
<div class="row" id="gallery">
<div class="container">
<div class="row" id="gallery">
</div>
</div> </div>
<!-- achievements-holder holds achievement-entry --> </div>
<div class="d-none" id="achievements-holder"> <!-- achievements-holder holds achievement-entry -->
{{ range .Site.Data.achievements.achievements }} <div class="d-none" id="achievements-holder">
{{ partial "misc/achievement.html" . }} {{ range .achievements }}
{{ end }} {{ partial "misc/achievement.html" . }}
</div> {{ end }}
{{ end }} </div>
</div> </div>

42
layouts/partials/experiences.html
View file

@ -1,25 +1,23 @@
<div class="container-fluid experiences bg-white anchor" id="experiences"> <div class="container-fluid anchor" id="experiences">
{{ if .Site.Data.experiences }} <h1 class="text-center">{{ .section.name }}</h1>
<h1 class="text-center">Experiences</h1>
<div class="container timeline text-justify"> <div class="container timeline text-justify">
{{ $totalExperiences:= len .Site.Data.experiences.experiences }} {{ $totalExperiences:= len .experiences }}
{{ range $index,$experience:= .Site.Data.experiences.experiences }} {{ range $index,$experience:= .experiences }}
{{ if eq (mod $index 2) 0 }} {{ if eq (mod $index 2) 0 }}
<div class="row align-items-center d-flex"> <div class="row align-items-center d-flex">
{{ partial "experiences/vertical-line.html" $index }} {{ partial "experiences/vertical-line.html" $index }}
{{ partial "experiences/experience-info.html" $experience }} {{ partial "experiences/experience-info.html" $experience }}
</div> </div>
{{else}} {{else}}
<div class="row align-items-center justify-content-end d-flex"> <div class="row align-items-center justify-content-end d-flex">
{{ partial "experiences/experience-info.html" $experience }} {{ partial "experiences/experience-info.html" $experience }}
{{ partial "experiences/vertical-line.html" $index }} {{ partial "experiences/vertical-line.html" $index }}
</div> </div>
{{ end }}
{{ if lt $index (sub $totalExperiences 1) }}
{{ partial "experiences/horizontal-line.html" $index }}
{{ end }}
{{ end }} {{ end }}
</div> {{ if lt $index (sub $totalExperiences 1) }}
{{ end }} {{ partial "experiences/horizontal-line.html" $index }}
{{ end }}
{{ end }}
</div>
</div> </div>

15
layouts/partials/footer.html
View file

@ -3,20 +3,23 @@
<div class="row text-left"> <div class="row text-left">
<div class="col-md-4 col-sm-12"> <div class="col-md-4 col-sm-12">
<h5>Navigation</h5> <h5>Navigation</h5>
{{ if .Site.Data.site }} {{ if .Site.Data.sections }}
<ul> <ul>
{{ range .Site.Data.site.menus }} {{- range sort .Site.Data.sections "section.weight" }}
{{ if .section.enable }}
<li class="nav-item"> <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> </li>
{{ end }} {{ end }}
</ul> {{- end }}
</ul>
{{ end }} {{ end }}
</div> </div>
<div class="col-md-4 col-sm-12"> <div class="col-md-4 col-sm-12">
<h5>Contact Me</h5> <h5>Contact Me</h5>
<ul> <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> <li><span>{{ title $key }}: </span> <span>{{ $value }}</span></li>
{{ end }} {{ end }}
</ul> </ul>

8
layouts/partials/home.html
View file

@ -1,20 +1,20 @@
<div class="container-fluid home" id="home"> <div class="container-fluid home" id="home">
<div <div
class="background container-fluid" 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>
<div class="container content text-center"> <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" 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> </h1>
<div class="typing-carousel"> <div class="typing-carousel">
<span id="ityped" class="ityped"></span> <span id="ityped" class="ityped"></span>
<span class="ityped-cursor"></span> <span class="ityped-cursor"></span>
</div> </div>
<ul id="typing-carousel-data"> <ul id="typing-carousel-data">
{{ range .Site.Data.site.author.summary }} {{ range .Site.Params.author.summary }}
<li>{{ . }}</li> <li>{{ . }}</li>
{{ end }} {{ end }}
</ul> </ul>

3
layouts/partials/navbar-2.html
View file

@ -1,6 +1,6 @@
<nav class="navbar navbar-expand-lg top-navbar final-navbar shadow"> <nav class="navbar navbar-expand-lg top-navbar final-navbar shadow">
<div class="container"> <div class="container">
<a class="navbar-brand" href="{{ .baseURL }}"> <a class="navbar-brand" href="{{ .navBrandURL }}">
<img src="/assets/images/logo.png"> <img src="/assets/images/logo.png">
{{- .title -}} {{- .title -}}
</a> </a>
@ -11,7 +11,6 @@
<div class="collapse navbar-collapse" id="top-nav-items"> <div class="collapse navbar-collapse" id="top-nav-items">
<ul class="navbar-nav ml-auto"> <ul class="navbar-nav ml-auto">
</ul> </ul>
</ul>
</div> </div>
</div> </div>
</nav> </nav>

34
layouts/partials/navbar.html
View file

@ -16,15 +16,37 @@
<div class="collapse navbar-collapse" id="top-nav-items"> <div class="collapse navbar-collapse" id="top-nav-items">
<ul class="navbar-nav ml-auto"> <ul class="navbar-nav ml-auto">
{{ range .Site.Data.site.menus }}
<li class="nav-item"> <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> </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 }} {{ 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> </ul>
</div> </div>
</div> </div>

35
layouts/partials/next-prev-navigator.html Normal file
View 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>

34
layouts/partials/projects.html
View file

@ -1,21 +1,19 @@
<div class="container-fluid projects bg-dimmed anchor pb-5" id="projects"> <div class="container-fluid anchor pb-5" id="projects">
{{ if .Site.Data.projects }} <h1 class="text-center">{{ .section.name }}</h1>
<h1 class="text-center">Projects</h1> <div class="container ml-auto text-center">
<div class="container ml-auto text-center"> <div class="btn-group flex-wrap" role="group" id="project-filter-buttons">
<div class="btn-group flex-wrap" role="group" id="project-filter-buttons"> {{ range .buttons }}
{{ range .Site.Data.projects.buttons }} <button type="button" class="btn btn-dark" data-filter="{{ .filter }}">
<button type="button" class="btn btn-dark" data-filter="{{ .filter }}"> {{ .name }}
{{ .name }} </button>
</button> {{ end }}
{{ end }}
</div>
</div> </div>
<div class="container filtr-projects"> </div>
<div class="row" id="project-card-holder"> <div class="container filtr-projects">
{{ range .Site.Data.projects.projects }} <div class="row" id="project-card-holder">
{{ partial "cards/project" . }} {{ range .projects }}
{{ end }} {{ partial "cards/project" . }}
</div> {{ end }}
</div> </div>
{{ end }} </div>
</div> </div>

6
layouts/partials/recent-posts.html
View file

@ -1,8 +1,8 @@
<div class="container-fluid recent-posts bg-white anchor pb-5" id="recent-posts"> <div class="container-fluid anchor pb-5" id="recent-posts">
<h1 class="text-center">Recent Posts</h1> <h1 class="text-center">{{ .section.name }}</h1>
<div class="container"> <div class="container">
<div class="row" id="recent-post-cards"> <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" . }} {{ partial "cards/recent-post.html" . }}
{{ end }} {{ end }}
</div> </div>

18
layouts/partials/skills.html
View file

@ -1,13 +1,11 @@
<div class="container-fluid skills bg-dimmed anchor pb-5" id="skills"> <div class="container-fluid anchor pb-5" id="skills">
{{ if .Site.Data.skills }} <h1 class="text-center">{{ .section.name }}</h1>
<h1 class="text-center">Skills</h1>
<div class="container d-flex-block"> <div class="container d-flex-block">
<div class="row" id="primary-skills"> <div class="row" id="primary-skills">
{{ range .Site.Data.skills.skills }} {{ range .skills }}
{{ partial "cards/skill.html" . }} {{ partial "cards/skill.html" . }}
{{ end }} {{ end }}
</div>
</div> </div>
{{ end }} </div>
</div> </div>

34
static/assets/css/achievements.css
View file

@ -1,4 +1,4 @@
.achievements .container { #achievements .container {
padding-top: 0.5rem; padding-top: 0.5rem;
} }
@ -123,3 +123,35 @@
#gallery .achievement-details { #gallery .achievement-details {
height: 75vh !important; height: 75vh !important;
} }
/* ============= Device specific fixes ======= */
/* Extra small devices (portrait phones, less than 576px) */
/* No media query for `xs` since this is the default in Bootstrap */
/* Extra large devices (large desktops, 1200px and up) */
@media (max-width: 1400px) {
}
@media (max-width: 1200px) {
}
/* Large devices (desktops, 992px and up) */
@media (max-width: 992px) {
}
/* Medium devices (tablets, 768px and up) */
@media only screen and (max-width: 768px) {
}
/* Small devices (landscape phones, 576px and up) */
@media only screen and (max-width: 576px) {
#gallery .achievement-entry:hover {
transform: scale(1.05);
}
}

8
static/assets/css/experiences.css
View file

@ -1,16 +1,16 @@
.experiences { #experiences {
padding-bottom: 1rem; padding-bottom: 1rem;
} }
.experiences .timeline { #experiences .timeline {
margin-top: 1.5rem !important; margin-top: 1.5rem !important;
} }
.experiences ul { #experiences ul {
padding-left: 1rem; padding-left: 1rem;
} }
.experiences ul > li { #experiences ul > li {
margin-left: 0; margin-left: 0;
color: #3c4858; color: #3c4858;
} }

10
static/assets/css/projects.css
View file

@ -1,10 +1,10 @@
.projects .card .card-header { #projects .card .card-header {
background-color: #f9fafc; background-color: #f9fafc;
padding: 0.7rem; padding: 0.7rem;
padding-bottom: 0rem; padding-bottom: 0rem;
} }
.projects .card .card-img-xs { #projects .card .card-img-xs {
margin-right: 0.5rem; margin-right: 0.5rem;
} }
@ -15,11 +15,11 @@
float: right; float: right;
} }
.projects .card .card-body { #projects .card .card-body {
padding: 0.7rem; padding: 0.7rem;
} }
.projects .card .card-header .sub-title { #projects .card .card-header .sub-title {
color: #8392a5; color: #8392a5;
margin-top: 0.4rem; margin-top: 0.4rem;
} }
@ -55,7 +55,7 @@
/* Small devices (landscape phones, 576px and up) */ /* Small devices (landscape phones, 576px and up) */
@media only screen and (max-width: 576px) { @media only screen and (max-width: 576px) {
.projects .btn { #projects .btn {
margin-top: 0.3125rem; margin-top: 0.3125rem;
} }
} }

8
static/assets/css/recent-posts.css
View file

@ -1,19 +1,19 @@
.recent-posts .container{ #recent-posts .container{
padding-top: 1rem; padding-top: 1rem;
} }
.recent-posts .card .card-footer span { #recent-posts .card .card-footer span {
font-size: 10pt; font-size: 10pt;
color: #6c757d !important; color: #6c757d !important;
padding-top: 5px; padding-top: 5px;
} }
.recent-posts .card .card-footer { #recent-posts .card .card-footer {
background: #fff; background: #fff;
margin-top: auto; margin-top: auto;
} }
.recent-posts .post-card-link{ #recent-posts .post-card-link{
text-decoration: none; text-decoration: none;
} }

8
static/assets/css/skills.css
View file

@ -1,4 +1,4 @@
.skills .card .card-head { #skills .card .card-head {
background-color: #f9fafc; background-color: #f9fafc;
height: fit-content; height: fit-content;
padding: 0.7rem; padding: 0.7rem;
@ -6,16 +6,16 @@
border-bottom: 0.0625rem solid rgba(0, 0, 0, 0.125); border-bottom: 0.0625rem solid rgba(0, 0, 0, 0.125);
} }
.skills .card .card-img-xs { #skills .card .card-img-xs {
margin-right: 0.5rem; margin-right: 0.5rem;
} }
.skills .card { #skills .card {
margin-top: 0.5rem; margin-top: 0.5rem;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
.skills .card .card-body { #skills .card .card-body {
padding-top: 0.2rem; padding-top: 0.2rem;
padding-left: 0.7rem; padding-left: 0.7rem;
} }

14
static/assets/css/style.css
View file

@ -245,12 +245,16 @@ img.right{
/* Small devices (landscape phones, 576px and up) */ /* Small devices (landscape phones, 576px and up) */
@media only screen and (max-width: 576px) { @media only screen and (max-width: 576px) {
.container-fluid.about, .section-holder {
.container-fluid.skills,
.container-fluid.projects,
.container-fluid.recent-posts,
.container-fluid.achievements {
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
} }
#skills,
#projects,
#recent-posts,
#achievements{
padding-left: 0;
padding-right: 0;
}
} }

19
static/assets/js/home.js
View file

@ -145,15 +145,18 @@ var projectCards;
function adjustRecentPostsHeight() { function adjustRecentPostsHeight() {
if (!isMobile) { // no need to adjust height for mobile devices if (!isMobile) { // no need to adjust height for mobile devices
let el = document.getElementById("recent-post-cards").children; let recentPostCards = document.getElementById("recent-post-cards")
let maxHeight = 0; if (recentPostCards != null) {
for (let i = 0; i < el.length; i++) { let el = recentPostCards.children;
if (el[i].children[1].clientHeight > maxHeight) { let maxHeight = 0;
maxHeight = el[i].children[1].clientHeight; for (let i = 0; i < el.length; i++) {
if (el[i].children[1].clientHeight > maxHeight) {
maxHeight = el[i].children[1].clientHeight;
}
}
for (let i = 0; i < el.length; i++) {
el[i].children[1].setAttribute("style", "min-height: " + maxHeight + "px;")
} }
}
for (let i = 0; i < el.length; i++) {
el[i].children[1].setAttribute("style", "min-height: " + maxHeight + "px;")
} }
} }
} }