added about in home page

layouts/index.html

@@ -13,6 +13,7 @@
 
 {{ define "main" }}
 {{- partial "sections/hero.html" . -}}
+{{- partial "sections/about.html" . -}}
 {{- partial "sections/projects.html" . -}}
 {{- partial "sections/achievements.html" . -}}
 {{- partial "sections/contact.html" . -}}

layouts/partials/head.html

@@ -36,6 +36,7 @@
         --text-color: {{ .Site.Params.color.textColor | default "#343a40" }};
         --text-secondary-color: {{ .Site.Params.color.secondaryTextColor | default "#6c757d" }};
         --background-color: {{ .Site.Params.color.backgroundColor | default "#eaedf0" }};
+        --secondary-background-color: {{ .Site.Params.color.secondaryBackgroundColor | default "#64ffda1a" }};
         --primary-color: {{ .Site.Params.color.primaryColor | default "#007bff" }};
         --secondary-color: {{ .Site.Params.color.secondaryColor | default "#f8f9fa" }};
 
@@ -43,6 +44,7 @@
         --text-color-dark: {{ .Site.Params.color.darkmode.textColor | default "#e4e6eb" }};
         --text-secondary-color-dark: {{ .Site.Params.color.darkmode.secondaryTextColor | default "#b0b3b8" }};
         --background-color-dark: {{ .Site.Params.color.darkmode.backgroundColor | default "#18191a" }};
+        --secondary-background-color-dark: {{ .Site.Params.color.darkmode.secondaryBackgroundColor | default "#212529" }};
         --primary-color-dark: {{ .Site.Params.color.darkmode.primaryColor | default "#ffffff" }};
         --secondary-color-dark: {{ .Site.Params.color.darkmode.secondaryColor | default "#212529" }};
     }

layouts/partials/sections/about.html

@@ -0,0 +1,28 @@
+{{ if .Site.Params.about.enable | default false }}
+<section id="about" class="py-5">
+    <div class="container bg-transparent">
+        <h3 class="text-center bg-transparent">{{ .Site.Params.about.title }}</h3>
+        <div class="bg-transparent row justify-content-center px-3 py-5">
+            <div class="col-md-6 h-100 content">
+                {{ .Site.Params.about.content | markdownify }}
+
+                {{ if .Site.Params.about.skills.enable }}
+                {{ .Site.Params.about.skills.title }}
+                <ul>
+                    {{ range .Site.Params.about.skills.items }}
+                    <li>{{ . | markdownify }}</li>
+                    {{ end }}
+                </ul>
+                {{ end }}
+            </div>
+            {{ if .Site.Params.about.image }}
+            <div class="col-md-4 mt-sm-5 mt-md-0">
+                <div class="image d-flex">
+                    <img src="{{ .Site.Params.about.image }}" class="img-thumbnail mx-auto rounded-circle" alt="">
+                </div>
+            </div>
+            {{ end }}
+        </div>
+    </div>
+</section>
+{{ end }}

layouts/partials/sections/header.html

@@ -48,7 +48,11 @@
             <!-- navbar content -->
             <div class="collapse navbar-collapse text-wrap primary-font" id="navbarContent">
                 <ul class="navbar-nav {{ .Site.Params.navbar.align | default " ms-auto"}} text-center">
-                    {{ if not (.Site.Params.navbar.menus.disableAbout | default false) }}
+                    {{
+                    if and
+                    (.Site.Params.about.enable | default false)
+                    (not (.Site.Params.navbar.menus.disableAbout | default false))
+                    }}
                     <li class="nav-item navbar-text">
                         <a class="nav-link" href="{{ .Site.BaseURL | relURL }}#about" aria-label="about">About</a>
                     </li>