From aaf4a804be913694934ff103a4bcf4b64a690850 Mon Sep 17 00:00:00 2001
From: Pierniki <jjdroid6969@gmail.com>
Date: Thu, 21 Sep 2023 14:48:28 +0200
Subject: [PATCH] feat: add home link to navbar, minor styling changes

---
 src/app/[lang]/[slug]/page.tsx           |  4 ++--
 src/app/[lang]/article/[slug]/page.tsx   |  2 +-
 src/app/[lang]/page.tsx                  |  2 +-
 src/components/LangSelect/LangSelect.tsx |  2 +-
 src/components/Navigation/Navigation.tsx | 21 ++++++++++++++-------
 src/components/Search/SearchDialog.tsx   |  2 +-
 6 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/app/[lang]/[slug]/page.tsx b/src/app/[lang]/[slug]/page.tsx
index 40863d01..2d2139ee 100644
--- a/src/app/[lang]/[slug]/page.tsx
+++ b/src/app/[lang]/[slug]/page.tsx
@@ -27,8 +27,8 @@ export default async function Web({ params: { slug, lang } }: CustomPageProps) {
 
   if (!page) notFound()
   return (
-    <section className="w-full px-4 pb-16">
-      <h1>{page.title}</h1>
+    <section className="w-full px-4 pb-16 pt-8">
+      <h1 className="mb-8 text-2xl font-semibold">{page.title}</h1>
       <RichText raw={page.content?.raw} />
     </section>
   )
diff --git a/src/app/[lang]/article/[slug]/page.tsx b/src/app/[lang]/article/[slug]/page.tsx
index 06d4a0d5..fd10d7ea 100644
--- a/src/app/[lang]/article/[slug]/page.tsx
+++ b/src/app/[lang]/article/[slug]/page.tsx
@@ -48,7 +48,7 @@ export default async function Web({ params: { slug, lang } }: ArticlePageProps)
 
   if (!article) return null
   return (
-    <article className="w-full px-4 pb-16">
+    <article className="w-full px-4 pb-16 pt-8">
       {article.coverImage && (
         <Image
           src={article.coverImage.url}
diff --git a/src/app/[lang]/page.tsx b/src/app/[lang]/page.tsx
index 98af14e9..8f997476 100644
--- a/src/app/[lang]/page.tsx
+++ b/src/app/[lang]/page.tsx
@@ -9,7 +9,7 @@ export default async function Web({ params }: { params: { lang: Locale } }) {
       <div className="flex w-full justify-end px-4 pt-4">
         <StockDisplay />
       </div>
-      <div className="flex w-full flex-col gap-16">
+      <div className="flex w-full flex-col gap-16 pt-4">
         <TrendingArticles lang={params.lang} />
         <RecentArticles lang={params.lang} />
       </div>
diff --git a/src/components/LangSelect/LangSelect.tsx b/src/components/LangSelect/LangSelect.tsx
index eaf52143..b78dcad5 100644
--- a/src/components/LangSelect/LangSelect.tsx
+++ b/src/components/LangSelect/LangSelect.tsx
@@ -18,7 +18,7 @@ function LangSelect() {
 
   return (
     <Select value={lang} onValueChange={(locale) => router.push(`/${locale}`)}>
-      <SelectTrigger className="w-[100px]" aria-label="language select">
+      <SelectTrigger className="w-[100px] min-w-[100px]" aria-label="language select">
         <SelectValue>{lang}</SelectValue>
       </SelectTrigger>
       <SelectContent className="bg-white">
diff --git a/src/components/Navigation/Navigation.tsx b/src/components/Navigation/Navigation.tsx
index 2f297fc6..330329c4 100644
--- a/src/components/Navigation/Navigation.tsx
+++ b/src/components/Navigation/Navigation.tsx
@@ -12,12 +12,19 @@ export async function Navigation({ lang }: NavigationProps) {
   const navElements = navigations[0]?.pages
 
   return (
-    <ul className="flex items-center justify-center gap-5 px-4">
-      {navElements?.map((navElement) => (
-        <li key={navElement?.slug}>
-          <Link href={`/${lang}/${navElement?.slug}`}>{navElement?.title}</Link>
-        </li>
-      ))}
-    </ul>
+    <div className="flex w-full items-center justify-between gap-5 pr-4">
+      <Link href={`/${lang}/`} prefetch={false}>
+        {"Home"}
+      </Link>
+      <ul className="flex gap-5">
+        {navElements?.map((navElement) => (
+          <li key={navElement?.slug}>
+            <Link href={`/${lang}/${navElement?.slug}`} prefetch={false}>
+              {navElement?.title}
+            </Link>
+          </li>
+        ))}
+      </ul>
+    </div>
   )
 }
diff --git a/src/components/Search/SearchDialog.tsx b/src/components/Search/SearchDialog.tsx
index 07d13cd6..9e2bdbc5 100644
--- a/src/components/Search/SearchDialog.tsx
+++ b/src/components/Search/SearchDialog.tsx
@@ -37,7 +37,7 @@ function SearchDialogContent() {
           aria-label="Open search dialog"
           name="Search"
         >
-          <div className="flex items-center gap-4 px-1">
+          <div className="flex min-w-[200px] items-center gap-4 px-1">
             <Search className="h-4 w-4" />
             Search for an article
           </div>