Add acomplishment section

Signed-off-by: hossainemruz <hossainemruz@gmail.com>

22 files changed, 266 insertions, 12 deletions

diff --git a/README.md b/README.md
index d72c049..699efdc 100644
--- a/README.md
+++ b/README.md
@@ -219,10 +219,10 @@ Here, are the current plan and progress of various components of this theme. The
   - [ ] Links
   - [ ] Gallery
 
-- [ ] **Accomplishment / Courses**
+- [x] **Accomplishment / Courses**
 
-  - [ ] Overview
-  - [ ] Certificate
+  - [x] Overview
+  - [x] Certificate
 
 - [x] **Achievements Gallery**
   - [x] Image
diff --git a/exampleSite/data/en/sections/accomplishments.yaml b/exampleSite/data/en/sections/accomplishments.yaml
new file mode 100644
index 0000000..dbbb81e
--- /dev/null
+++ b/exampleSite/data/en/sections/accomplishments.yaml
@@ -0,0 +1,22 @@
+# section information
+section:
+  name: Accomplishments
+  id: accomplishments
+  enable: true
+  weight: 6
+  showOnNavbar: false
+  # Can optionally hide the title in sections
+  # hideTitle: true
+
+
+# your projects
+certificates:
+- name: Linux Foundation System Administrator
+  logo: /images/sections/projects/kubernetes.png
+  organization: Linux Foundation
+  timeline: "March 2018 - Present"
+ 
+  #url: ""  # link of the certificate.
+  overview: taught me how to manage linux systems can use markdown for images.
+ 
+
diff --git a/exampleSite/data/en/sections/recent-posts.yaml b/exampleSite/data/en/sections/recent-posts.yaml
index fef0533..25f9ba0 100644
--- a/exampleSite/data/en/sections/recent-posts.yaml
+++ b/exampleSite/data/en/sections/recent-posts.yaml
@@ -3,7 +3,7 @@ section:
   name: Recent Posts
   id: recent-posts
   enable: true
-  weight: 6
+  weight: 8
   showOnNavbar: true
   # Can optionally hide the title in sections
   # hideTitle: true
diff --git a/i18n/bn.toml b/i18n/bn.toml
index 9e9ffc2..f80b4ab 100644
--- a/i18n/bn.toml
+++ b/i18n/bn.toml
@@ -97,3 +97,9 @@ other = "বর্তমান"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "আরো"
+
+[view_certificate]
+other = "সার্টিফিকেট দেখুন"
diff --git a/i18n/cn.toml b/i18n/cn.toml
index b83598f..1b6b4a6 100644
--- a/i18n/cn.toml
+++ b/i18n/cn.toml
@@ -100,3 +100,9 @@ other = "显示较少"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "更多的"
+
+[view_certificate]
+other = "查看证书"
diff --git a/i18n/de.toml b/i18n/de.toml
index 3dcf4b4..1f66ddd 100644
--- a/i18n/de.toml
+++ b/i18n/de.toml
@@ -100,3 +100,9 @@ other = "Laat minder zien"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "Meer"
+
+[view_certificate]
+other = "Bekijk certificaat"
diff --git a/i18n/en.toml b/i18n/en.toml
index 8a70ff2..21d1335 100644
--- a/i18n/en.toml
+++ b/i18n/en.toml
@@ -99,4 +99,10 @@ other = "Star"
 other = "Details"
 
 [err_404]
-other = "The page you are looking for is not there yet."
\ No newline at end of file
+other = "The page you are looking for is not there yet."
+
+[more]
+other = "More"
+
+[view_certificate]
+other = "View Certificate"
diff --git a/i18n/es.toml b/i18n/es.toml
index 378f045..0b15ed9 100644
--- a/i18n/es.toml
+++ b/i18n/es.toml
@@ -100,3 +100,9 @@ other = "Muestra menos"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "Más"
+
+[view_certificate]
+other = "Ver Certificado"
diff --git a/i18n/fr.toml b/i18n/fr.toml
index b895da4..5d79a59 100644
--- a/i18n/fr.toml
+++ b/i18n/fr.toml
@@ -100,3 +100,9 @@ other = "Montrer moins"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "Suite"
+
+[view_certificate]
+other = "Afficher le certificat"
diff --git a/i18n/hi.toml b/i18n/hi.toml
index 3cf581d..150799d 100644
--- a/i18n/hi.toml
+++ b/i18n/hi.toml
@@ -100,3 +100,9 @@ other = "कम दिखाएं"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "अधिक"
+
+[view_certificate]
+other = "प्रमाणपत्र देखें"
diff --git a/i18n/id.toml b/i18n/id.toml
index a528a60..b9c20f7 100644
--- a/i18n/id.toml
+++ b/i18n/id.toml
@@ -100,3 +100,9 @@ other = "Tampilkan Lebih Sedikit"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "Lebih"
+
+[view_certificate]
+other = "Lihat Sertifikat"
diff --git a/i18n/it.toml b/i18n/it.toml
index cc8f843..3fce4de 100644
--- a/i18n/it.toml
+++ b/i18n/it.toml
@@ -100,3 +100,9 @@ other = "Mostra meno"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "Di più"
+
+[view_certificate]
+other = "Féach ar an Teastas"
diff --git a/i18n/jp.toml b/i18n/jp.toml
index 7d6e329..21b8af1 100644
--- a/i18n/jp.toml
+++ b/i18n/jp.toml
@@ -97,3 +97,9 @@ other = "表示を減らす"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "もっと"
+
+[view_certificate]
+other = "ビューの証明書"
diff --git a/i18n/ko.toml b/i18n/ko.toml
index 26dab1f..d1df3e9 100644
--- a/i18n/ko.toml
+++ b/i18n/ko.toml
@@ -100,3 +100,9 @@ other = "간단히보기"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "더"
+
+[view_certificate]
+other = "인증서보기"
diff --git a/i18n/ru.toml b/i18n/ru.toml
index b4a8f9d..7483ee9 100644
--- a/i18n/ru.toml
+++ b/i18n/ru.toml
@@ -100,3 +100,9 @@ other = "Показывай меньше"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "Более"
+
+[view_certificate]
+other = "Просмотреть сертификат"
diff --git a/i18n/vn.toml b/i18n/vn.toml
index 029ebd6..f91a712 100644
--- a/i18n/vn.toml
+++ b/i18n/vn.toml
@@ -100,3 +100,9 @@ other = "Hiện ít hơn"
 
 # [err_404]
 # other = "The page you are looking for is not there yet."
+
+[more]
+other = "Hơn"
+
+[view_certificate]
+other = "Xem chứng chỉ"
diff --git a/layouts/index.html b/layouts/index.html
index 9bf0246..f22e648 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -23,7 +23,8 @@
     <link rel="stylesheet" href="{{ "/css/sections/projects.css" | relURL }}"/>
     <link rel="stylesheet" href="{{ "/css/sections/recent-posts.css" | relURL }}"/>
     <link rel="stylesheet" href="{{ "/css/sections/achievements.css" | relURL }}"/>
-
+    <link rel="stylesheet" href="{{ "/css/sections/accomplishments.css" | relURL }}"/>
+    
     <!-- Add Google Analytics if enabled in configuration -->
     {{ if site.GoogleAnalytics }}
         {{ template "_internal/google_analytics_async.html" . }}
diff --git a/layouts/partials/cards/accomplishments.html b/layouts/partials/cards/accomplishments.html
new file mode 100644
index 0000000..8b61692
--- /dev/null
+++ b/layouts/partials/cards/accomplishments.html
@@ -0,0 +1,17 @@
+<div class="col-md-12 col-lg-6 p-2">
+  <div class="card mt-3">
+    <div class="card-header">
+      <h5 class="card-title mb-0">{{ .name }}</h5>
+      <div class="sub-title">
+        <span><a href="{{ .organization.url }}">{{ .organization.name }}</a></span>
+        <span class="ml-2">{{ .timeline }}</span>
+      </div>
+    </div>
+    <div class="card-body">
+      <p>{{ .courseOverview | markdownify }}</p>
+    </div>
+    <div class="card-footer">
+      <a class="btn btn-outline-info ml-1 pl-2 mb-2" href="{{ .certificateURL | default "#"}}" target="_blank" role="button">{{ i18n "view_certificate"}}</a>
+    </div>
+  </div>
+</div>
diff --git a/layouts/partials/helpers/get-section-id.html b/layouts/partials/helpers/get-section-id.html
new file mode 100644
index 0000000..2dc13ab
--- /dev/null
+++ b/layouts/partials/helpers/get-section-id.html
@@ -0,0 +1,5 @@
+{{ $sectionID := replace (lower .section.name) " " "-"  }}
+{{ if .section.id }}
+    {{ $sectionID = .section.id }}
+{{ end }}
+{{ return $sectionID }}
\ No newline at end of file
diff --git a/layouts/partials/navigators/navbar.html b/layouts/partials/navigators/navbar.html
index 994cfd3..7384acb 100644
--- a/layouts/partials/navigators/navbar.html
+++ b/layouts/partials/navigators/navbar.html
@@ -55,17 +55,33 @@
           <a class="nav-link" href="#home">{{ i18n "home" }}</a>
         </li>
         {{ if $sections }}
+          {{ $sectionCount := 0}}
           {{ range sort $sections "section.weight" }}
             {{ if and (.section.enable) (.section.showOnNavbar)}}
-              {{ $sectionID := replace (lower .section.name) " " "-"  }}
-              {{ if .section.id }}
-                {{ $sectionID = .section.id }}
+              {{ $sectionCount  = add $sectionCount 1}}
+              {{ if lt $sectionCount 5 }}
+                <li class="nav-item">
+                  <a class="nav-link" href="#{{ partial "helpers/get-section-id.html" . }}">{{ .section.name }}</a>
+                </li>
               {{ end }}
-              <li class="nav-item">
-                <a class="nav-link" href="#{{ $sectionID }}">{{ .section.name }}</a>
-              </li>
             {{ end }}
           {{- end }}
+          {{ if gt $sectionCount 5 }}
+          <li class="nav-item dropdown">
+            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{i18n "more" }}</a>
+            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
+                {{ $sectionCount := 0 }}
+                {{ range sort $sections "section.weight" }}
+                  {{ if and (.section.enable) (.section.showOnNavbar) }}
+                    {{ $sectionCount  = add $sectionCount 1}}
+                    {{ if gt $sectionCount 5 }}
+                      <a class="dropdown-item" href="#{{ partial "helpers/get-section-id.html" . }}">{{ .section.name }}</a>
+                    {{ end }}
+                  {{ end }}
+                {{- end }}
+              </div>
+            </li>
+          {{ end }}
         {{- end }}
         {{ $hasCustomMenus:= false }}
         {{ if $customMenus }}
diff --git a/layouts/partials/sections/accomplishments.html b/layouts/partials/sections/accomplishments.html
new file mode 100644
index 0000000..9024222
--- /dev/null
+++ b/layouts/partials/sections/accomplishments.html
@@ -0,0 +1,18 @@
+{{ $sectionID := replace (lower .section.name) " " "-"  }}
+{{ if .section.id }}
+  {{ $sectionID = .section.id }}
+{{ end }}
+
+<div class="container-fluid anchor pb-5 accomplishments-section" id="{{ $sectionID }}">
+  {{ if not (.section.hideTitle) }}
+    <h1 class="text-center">{{ .section.name }}</h1>
+  {{ end }}
+
+  <div class="container">
+    <div class="row" id="acomplishment-card-holder">
+      {{ range .accomplishments }}
+        {{ partial "cards/accomplishments" . }}
+      {{ end }}
+    </div>
+  </div>
+</div>
diff --git a/static/css/sections/accomplishments.css b/static/css/sections/accomplishments.css
new file mode 100644
index 0000000..56eb614
--- /dev/null
+++ b/static/css/sections/accomplishments.css
@@ -0,0 +1,97 @@
+.accomplishments-section .card {
+  background: #fff;
+  border-top: 2px solid #248aaa;
+}
+.accomplishments-section .card .card-header {
+  background: none;
+  border: none;
+}
+
+.accomplishments-section .card .card-header .sub-title {
+  color: #8392a5;
+  margin-top: 0.4rem;
+}
+
+.accomplishments-section .card .sub-title :nth-child(2) {
+  float: none !important;
+}
+
+.accomplishments-section .card .card-body {
+  padding: 0;
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
+.accomplishments-section .card .card-footer {
+  background: #fff;
+  border: none;
+  padding: 0;
+  padding-left: 0.7rem;
+  padding-bottom: 0.3rem;
+}
+
+/* ============= Device specific fixes ======= */
+
+/* Large screens such as TV */
+@media only screen and (min-width: 1824px) {
+}
+
+/* Extra large devices (large desktops, 1200px and up) */
+
+@media (max-width: 1400px) {
+}
+
+@media (max-width: 1200px) {
+}
+
+/* IPad Pro */
+@media (max-width: 1024px) {
+  .accomplishments-section {
+    padding-left: 0;
+    padding-right: 0;
+    width: 100%;
+  }
+  .accomplishments-section .container {
+    max-width: 100%;
+  }
+  .accomplishments-section {
+    padding: 0;
+  }
+  .accomplishments-section {
+    padding-left: 0.2rem;
+    padding-right: 0.2rem;
+  }
+}
+
+/*  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) {
+  .accomplishments-section {
+    flex: 100%;
+    max-width: 100%;
+    margin-top: 2rem;
+  }
+}
+
+/* iPhoneX, iPhone 6,7,8 */
+@media only screen and (max-width: 375px) {
+}
+
+/* Galaxy S5, Moto G4 */
+@media only screen and (max-width: 360px) {
+}
+
+/* iPhone 5 or before */
+@media only screen and (max-width: 320px) {
+}