fix: prevent title line break

Author: Ehesp

website-v3/src/layouts/Header.astro

@@ -16,44 +16,42 @@ const { owner, repository, config } = context.get();
   <div class="absolute inset-0 z-0 dark:bg-zinc-900/90 dark:text-white"></div>
   <div class="max-w-8xl mx-auto relative z-10">
     <div class="h-16 px-4 lg:px-8 mx-4 lg:mx-0 flex items-center">
-      <div class="flex-1 flex items-center">
-        <Link
-          href="/"
-          className="transition-opacity hover:opacity-75 inline-flex items-center gap-3"
-        >
-          {
-            !!config.logo && (
-              <img
-                alt="Logo"
-                class:list={['inline-block h-[30px]', { 'dark:hidden': !!config.logoDark }]}
-                src={getImagePath(config.logo)}
-              />
-            )
-          }
-          {
-            !!config.logoDark && (
-              <img
-                alt="Logo"
-                class="hidden h-[30px] dark:inline-block"
-                src={getImagePath(config.logoDark)}
-              />
-            )
-          }
-          {
-            !!config.automaticallyDisplayName && (
-              <span class="text-xl font-bold">{config.name || `${owner}/${repository}`}</span>
-            )
-          }
-        </Link>
-      </div>
+      <Link
+        href="/"
+        className="transition-opacity flex-grow hover:opacity-75 flex items-center gap-3 truncate"
+      >
+        {
+          !!config.logo && (
+            <img
+              alt="Logo"
+              class:list={['inline-block h-[30px]', { 'dark:hidden': !!config.logoDark }]}
+              src={getImagePath(config.logo)}
+            />
+          )
+        }
+        {
+          !!config.logoDark && (
+            <img
+              alt="Logo"
+              class="hidden h-[30px] dark:inline-block"
+              src={getImagePath(config.logoDark)}
+            />
+          )
+        }
+        {
+          !!config.automaticallyDisplayName && (
+            <span class="text-xl font-bold">{config.name || `${owner}/${repository}`}</span>
+          )
+        }
+      </Link>
       <div
         class:list={{
           'hidden lg:block lg:w-64 xl:w-80': !!config.docsearch,
         }}
       >
         {!!config.docsearch && <SearchBar />}
       </div>
-      <div class="flex-1 flex gap-6 items-center justify-end">
+      <div class="flex-shrink-0 flex gap-6 items-center justify-end">
         {
           !!config.docsearch && (
             <button class="h-6 w-6 lg:hidden" data-docsearch-override>