From bb55feb0a30eb40b52ef0c3403bcb86acba80364 Mon Sep 17 00:00:00 2001
From: Eltrac <hi@guhub.cn>
Date: Sun, 22 Dec 2024 16:46:39 +0800
Subject: feat: add rss icon to nav bar instead of menu item

---
 assets/css/index.css         | 23 ++++++++++++++++-------
 hugo.toml                    |  5 -----
 layouts/partials/header.html | 24 ++++++++++++++----------
 static/rss.svg               |  5 +++++
 4 files changed, 35 insertions(+), 22 deletions(-)
 create mode 100644 static/rss.svg

diff --git a/assets/css/index.css b/assets/css/index.css
index ebee4b61..2c652fef 100644
--- a/assets/css/index.css
+++ b/assets/css/index.css
@@ -148,8 +148,17 @@ ul {
   color: var(--secondary-text-color);
 }
 
-.header-items {
-  margin: 1rem auto;
+/* Navigation */
+
+#navigation-bar {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: .75rem
+}
+
+.navigation {
+  margin: 1rem 0;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -158,27 +167,27 @@ ul {
   overflow: hidden;
 }
 
-.header-item a {
+.navigation-item a {
   display: inline-block;
   color: var(--background-color);
   padding: 0.25rem 0.5rem;
   background-color: var(--text-color);
 }
 
-.header-item:first-child a {
+.navigation-item:first-child a {
   padding-left: 0.75rem
 }
 
-.header-item:last-child a {
+.navigation-item:last-child a {
   padding-right: 0.75rem
 }
 
-.header-item.active a {
+.navigation-item.active a {
   color: var(--text-color);
   background-color: var(--block-background-color);
 }
 
-.header-item a:hover {
+.navigation-item a:hover {
   text-decoration: none;
 }
 
diff --git a/hugo.toml b/hugo.toml
index 5f397cf5..90f9595a 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -45,11 +45,6 @@ name = "链接"
 link = "/links/"
 target = "_self"
 
-[[params.nav]]
-name = "RSS"
-link = "/posts/index.xml"
-target = "_blank"
-
 [services]
   [services.rss]
     limit = 10
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index b1f6e50e..9ce01af7 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -1,17 +1,21 @@
-<!-- Header Title -->
 <header>
+  <!-- Header Title -->
   <div class="header-title">
     <a href="{{ .Site.LanguagePrefix }}/"
       >{{ or .Site.Params.headTitle .Site.Author.name }}</a
     >
   </div>
-</header>
-
-<!-- Navigation -->
-<nav class="header-items">
-  {{ range .Site.Params.nav }}
-  <div class="header-item {{ if eq .link $.Page.RelPermalink }}active{{ end }}">
-    <a href="{{ .link }}" target="{{ .target }}">{{ .name }}</a>
+  <!-- Navigation -->
+  <div id="navigation-bar">
+      <nav class="navigation">
+        {{ range .Site.Params.nav }}
+        <div class="navigation-item {{ if eq .link $.Page.RelPermalink }}active{{ end }}">
+          <a href="{{ .link }}" target="{{ .target }}">{{ .name }}</a>
+        </div>
+        {{ end }}
+      </nav>
+      <a href="/posts/index.xml" target="_blank" title="RSS">
+          <img src="/rss.svg" style="width:1rem;height:1rem" />
+      </a>
   </div>
-  {{ end }}
-</nav>
+</header>
diff --git a/static/rss.svg b/static/rss.svg
new file mode 100644
index 00000000..98fd991d
--- /dev/null
+++ b/static/rss.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 16 16" id="rss">
+  <circle cx="3" cy="13" r="2"></circle>
+  <path d="M1 5.667v2.667A6.674 6.674 0 0 1 7.667 15h2.666c0-5.146-4.187-9.333-9.333-9.333z"></path>
+  <path d="M1 1v2.667C7.25 3.667 12.334 8.75 12.334 15H15C15 7.28 8.72 1 1 1z"></path>
+</svg>
-- 
cgit v1.2.3