Make Khoj Posts the Blog Landing Page. Align Header Icons, Styling

khoj-ai · Oct 4, 2024 · aef1303 · aef1303
1 parent eff4143
commit aef1303
Show file tree

Hide file tree

Showing 5 changed files with 68 additions and 359 deletions.
diff --git a/src/components/Header.astro b/src/components/Header.astro
@@ -1,28 +1,28 @@
 ---
-import HeaderLink from './HeaderLink.astro';
 import ThemeIcon from './ThemeIcon.astro';
 ---
 
 <header>
 	<nav>
-		<h2 class="header-parent"><a href="https://khoj.dev"><img class="header-icon" src="/icons/logo_type.svg"></img></a></h2>
-		<div class="internal-links">
-			<HeaderLink href="/">Home</HeaderLink>
-			<HeaderLink href="/posts">Blog</HeaderLink>
+		<h2 class="header-parent">
+			<a href="https://khoj.dev"><img class="header-icon" src="/icons/logo_type.svg"></img></a>
+		</h2>
+		<div class="internal-links pb-2">
+			<span>Blog</span>
 		</div>
 		<div class="social-links">
 			<a href="https://twitter.com/khoj_ai" target="_blank">
 				<span class="sr-only">Follow Khoj on Twitter</span>
 				<img
 					class="share-button"
 					src="/icons/twitter.svg"
-					width={32}
-					height={32}
+					width={24}
+					height={24}
 				/>
 			</a>
 			<a href="https://github.com/khoj-ai/khoj" target="_blank">
-				<span class="sr-only">Go to Khoj's GitHub repo</span>
-				<svg viewBox="0 0 16 16" aria-hidden="true" width="32" height="32"
+				<span class="sr-only">Follow Khoj Development on GitHub</span>
+				<svg viewBox="0 0 16 16" aria-hidden="true" width="24" height="24"
 					><path
 						fill="currentColor"
 						d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"
@@ -40,8 +40,7 @@ import ThemeIcon from './ThemeIcon.astro';
 	}
 
 	img.header-icon {
-		width: 52px;
-		height: 52px;
+		height: 28px;
 	}
 
 	header {

diff --git a/src/components/ThemeIcon.astro b/src/components/ThemeIcon.astro
@@ -3,7 +3,7 @@
 ---
 
 <button id="themeToggle">
-    <svg width="30px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+    <svg width="24px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
         <path
             class="sun"
             fill-rule="evenodd"
@@ -22,6 +22,7 @@
         border: 0;
         background: none;
         cursor: pointer;
+        padding: 0.75em 0.5em 1em;
     }
     .sun {
         fill: black;