From c9795867c429d1c96c5921550298a44a463aaaad Mon Sep 17 00:00:00 2001
From: Floren Munteanu <fmunteanu@users.noreply.github.com>
Date: Mon, 21 Jul 2025 15:43:21 -0400
Subject: [PATCH] refactor: extract navbar title as individual partial
 component (#718)

* feat: navbar title

* fix: navbar title

---------

Co-authored-by: Floren Munteanu <19806136+fmunteanu@users.noreply.github.com>
---
 layouts/_partials/custom/navbar-title.html |  0
 layouts/_partials/navbar-title.html        | 16 ++++++++++++++++
 layouts/_partials/navbar.html              | 17 +----------------
 3 files changed, 17 insertions(+), 16 deletions(-)
 create mode 100644 layouts/_partials/custom/navbar-title.html
 create mode 100644 layouts/_partials/navbar-title.html

diff --git a/layouts/_partials/custom/navbar-title.html b/layouts/_partials/custom/navbar-title.html
new file mode 100644
index 0000000..e69de29
diff --git a/layouts/_partials/navbar-title.html b/layouts/_partials/navbar-title.html
new file mode 100644
index 0000000..2aea9de
--- /dev/null
+++ b/layouts/_partials/navbar-title.html
@@ -0,0 +1,16 @@
+{{- $logoPath := .Site.Params.navbar.logo.path | default "images/logo.svg" -}}
+{{- $logoLink := .Site.Params.navbar.logo.link | default .Site.Home.RelPermalink -}}
+{{- $logoWidth := .Site.Params.navbar.logo.width | default "20" -}}
+{{- $logoHeight := .Site.Params.navbar.logo.height | default "20" -}}
+{{- $logoDarkPath := .Site.Params.navbar.logo.dark | default $logoPath -}}
+
+<a class="hx:flex hx:items-center hx:hover:opacity-75 hx:ltr:mr-auto hx:rtl:ml-auto" href="{{ $logoLink }}">
+  {{- $displayTitle := (.Site.Params.navbar.displayTitle | default true) }}
+  {{- if (.Site.Params.navbar.displayLogo | default true) }}
+    <img class="hx:mr-2 hx:block hx:dark:hidden" src="{{ $logoPath | relURL }}" alt="{{ cond $displayTitle `Logo` .Site.Title }}" height="{{ $logoHeight }}" width="{{ $logoWidth }}" />
+    <img class="hx:mr-2 hx:hidden hx:dark:block" src="{{ $logoDarkPath | relURL }}" alt="{{ cond $displayTitle `Dark Logo` .Site.Title }}" height="{{ $logoHeight }}" width="{{ $logoWidth }}" />
+  {{- end }}
+  {{- if $displayTitle }}
+    <span class="hx:mr-2 hx:font-extrabold hx:inline hx:select-none" title="{{ .Site.Title }}">{{- .Site.Title -}}</span>
+  {{- end }}
+</a>
diff --git a/layouts/_partials/navbar.html b/layouts/_partials/navbar.html
index f19c49a..e735199 100644
--- a/layouts/_partials/navbar.html
+++ b/layouts/_partials/navbar.html
@@ -1,9 +1,3 @@
-{{- $logoPath := .Site.Params.navbar.logo.path | default "images/logo.svg" -}}
-{{- $logoLink := .Site.Params.navbar.logo.link | default .Site.Home.RelPermalink -}}
-{{- $logoWidth := .Site.Params.navbar.logo.width | default "20" -}}
-{{- $logoHeight := .Site.Params.navbar.logo.height | default "20" -}}
-{{- $logoDarkPath := .Site.Params.navbar.logo.dark | default $logoPath -}}
-
 {{- $navWidth := "hx:max-w-[90rem]" -}}
 {{- with .Site.Params.navbar.width -}}
   {{ if eq . "normal" -}}
@@ -20,16 +14,7 @@
   ></div>
 
   <nav class="hextra-max-navbar-width hx:mx-auto hx:flex hx:items-center hx:justify-end hx:gap-2 hx:h-16 hx:px-6">
-    <a class="hx:flex hx:items-center hx:hover:opacity-75 hx:ltr:mr-auto hx:rtl:ml-auto" href="{{ $logoLink }}">
-      {{- $displayTitle := (.Site.Params.navbar.displayTitle | default true) }}
-      {{- if (.Site.Params.navbar.displayLogo | default true) }}
-        <img class="hx:mr-2 hx:block hx:dark:hidden" src="{{ $logoPath | relURL }}" alt="{{ cond $displayTitle `Logo` .Site.Title }}" height="{{ $logoHeight }}" width="{{ $logoWidth }}" />
-        <img class="hx:mr-2 hx:hidden hx:dark:block" src="{{ $logoDarkPath | relURL }}" alt="{{ cond $displayTitle `Dark Logo` .Site.Title }}" height="{{ $logoHeight }}" width="{{ $logoWidth }}" />
-      {{- end }}
-      {{- if $displayTitle }}
-        <span class="hx:mr-2 hx:font-extrabold hx:inline hx:select-none" title="{{ .Site.Title }}">{{- .Site.Title -}}</span>
-      {{- end }}
-    </a>
+    {{ partial "navbar-title.html" . }}
 
     {{- $currentPage := . -}}
     {{- range .Site.Menus.main -}}