Add acomplishment section

Signed-off-by: hossainemruz <[email protected]>

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

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.
+
+

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

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 = "সার্টিফিকেট দেখুন"

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 = "查看证书"

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"

i18n/en.toml

@@ -99,4 +99,10 @@ other = "Star"
 other = "Details"
 
 [err_404]
-other = "The page you are looking for is not there yet."
+other = "The page you are looking for is not there yet."
+
+[more]
+other = "More"
+
+[view_certificate]
+other = "View Certificate"

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"

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"

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 = "प्रमाणपत्र देखें"

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"

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"

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 = "ビューの証明書"

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 = "인증서보기"

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 = "Просмотреть сертификат"

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ỉ"

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" . }}

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>

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 }}

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 }}

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>

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) {
+}