add social links

Author: AnvarAtayev

assets/_custom.scss

@@ -462,3 +462,22 @@ figure.image-with-source {
   justify-content: space-between;
   margin-bottom: $padding-16;
 }
+
+.social-links {
+  display: flex;
+  align-items: center;
+  gap: $padding-4;
+}
+
+a.social-link {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: $padding-4;
+  color: var(--body-font-color);
+  opacity: 0.65;
+
+  &:hover {
+    opacity: 1;
+  }
+}

config/_default/params.toml

@@ -76,3 +76,8 @@ BookServiceWorker = true
 # /!\ This is an experimental feature, might be removed or changed at any time
 # (Optional, experimental, default false) Enables a drop-down menu for translations only if a translation is present.
 BookTranslatedOnly = false
+
+# Social links displayed in the header
+[social]
+  github = 'https://github.com/AnvarAtayev'
+  linkedin = 'https://www.linkedin.com/in/anvarbek-atayev/'

layouts/partials/docs/brand.html

@@ -7,9 +7,21 @@ <h2 class="book-brand">
       {{- end -}}
       <span>{{ .Site.Title }}</span>
     </a>
-    <button class="theme-toggle theme-toggle--inline" type="button" aria-label="Toggle theme" data-theme-toggle>
+    <div class="social-links">
+      {{- with .Site.Params.social.github }}
+      <a href="{{ . }}" target="_blank" rel="noopener noreferrer" aria-label="GitHub" class="social-link">
+        <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"/></svg>
+      </a>
+      {{- end }}
+      {{- with .Site.Params.social.linkedin }}
+      <a href="{{ . }}" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn" class="social-link">
+        <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/><rect x="2" y="9" width="4" height="12"/><circle cx="4" cy="4" r="2"/></svg>
+      </a>
+      {{- end }}
+      <button class="theme-toggle theme-toggle--inline" type="button" aria-label="Toggle theme" data-theme-toggle>
       <svg class="icon-moon" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></svg>
       <svg class="icon-sun" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"/><line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/><line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/></svg>
     </button>
+    </div>
   </div>
 </h2>