feat: add navigation bar

templates/homepage.html

@@ -8,6 +8,11 @@
         <section class="container">
             <h1>{{ setting.title }}</h1>
             <p>{{ setting.description }}</p>
+            <nav>
+                <a href="/">HOMEPAGE</a>
+                <a href="https://portfolios.kilerd.me">PORTFOLIOS</a>
+                <a href="/about">ABOUT</a>
+            </nav>
         </section>
     </header>
 
@@ -15,7 +20,9 @@
         {% for article in articles %}
         <section class="article">
             <p class="mate">{{ article.timestamp | date(format="%B %d, %Y") }}</p>
-        <a class="title" href="{% if article.article.url %}{{ article.article.url }}{% else %}archives/{{ article.article.id }}{% endif %}">{{ article.article.title }}</a>
+            <a class="title"
+               href="{% if article.article.url %}{{ article.article.url }}{% else %}archives/{{ article.article.id }}{% endif %}">{{
+                article.article.title }}</a>
             <section class="yue desc">
                 {{ article.description|safe }}
             </section>

templates/resources/style.css

@@ -40,10 +40,29 @@ header p {
     color: #A3ABB3;
     margin: 0;
     font-size: 1.2rem;
-    padding-bottom: 2rem;
 
 }
 
+header nav {
+    padding: 1rem 0;
+}
+
+header nav a:first-child {
+    margin-left: 0;
+}
+
+header nav a {
+    font-size: 1.05rem;
+    color: #dc1313;
+    margin: 0 5px;
+    /* font-size: .9rem; */
+    text-decoration: none;
+}
+
+header nav a:hover {
+    border-bottom: 1px solid #dc1313;
+}
+
 
 section.article {
     padding: 3rem 0 2rem;