From f48dc250a910f7a11cfeee45cd89fb274e779661 Mon Sep 17 00:00:00 2001
From: Pasha Sviderski <me@psviderski.name>
Date: Tue, 3 Feb 2026 13:18:06 +0100
Subject: [PATCH] chore: fix landing navbar github/discord buttons wrap on
 mobile

---
 website/landing/index.html | 12 ++++++------
 website/landing/style.css  | 25 ++++++++-----------------
 2 files changed, 14 insertions(+), 23 deletions(-)

diff --git a/website/landing/index.html b/website/landing/index.html
index 6154ef0f..2e4343bd 100644
--- a/website/landing/index.html
+++ b/website/landing/index.html
@@ -64,22 +64,22 @@
                     <!-- Left side navigation -->
                     <ul class="flex items-center">
                         <li>
-                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-3 lg:px-5 py-2 transition"
+                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-2 sm:px-5 py-2 transition"
                                href="/docs">Docs</a>
                         </li>
                         <li>
-                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-3 lg:px-5 py-2 transition"
+                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-2 sm:px-5 py-2 transition"
                                href="/blog">Blog</a>
                         </li>
                         <li>
-                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-3 lg:px-5 py-2 transition"
+                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-2 sm:px-5 py-2 transition"
                                href="https://psviderski.substack.com/" target="_blank">Newsletter</a>
                         </li>
                     </ul>
                     <!-- Right side navigation -->
-                    <ul class="flex grow justify-end flex-wrap items-center">
+                    <ul class="flex grow justify-end items-center shrink-0">
                         <li>
-                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-2 sm:px-3 lg:px-5 py-2 flex items-center transition"
+                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-2 sm:px-5 py-2 flex items-center transition"
                                href="https://discord.gg/eR35KQJhPu">
                                 <svg class="w-4 h-4 sm:mr-1 fill-current" xmlns="http://www.w3.org/2000/svg"
                                      viewBox="0 0 24 24">
@@ -89,7 +89,7 @@
                             </a>
                         </li>
                         <li>
-                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-2 sm:px-3 lg:px-5 py-2 flex items-center transition"
+                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-1 sm:px-5 py-2 flex items-center transition"
                                href="https://github.com/psviderski/uncloud">
                                 <svg class="w-4 h-4 sm:mr-1 fill-current" xmlns="http://www.w3.org/2000/svg"
                                      viewBox="0 0 24 24">
diff --git a/website/landing/style.css b/website/landing/style.css
index aff50c6d..12ad7b8b 100644
--- a/website/landing/style.css
+++ b/website/landing/style.css
@@ -1365,10 +1365,6 @@ input[type="search"]::-webkit-search-results-decoration {
   flex-direction: column;
 }
 
-.flex-wrap{
-  flex-wrap: wrap;
-}
-
 .items-start{
   align-items: flex-start;
 }
@@ -1625,16 +1621,16 @@ input[type="search"]::-webkit-search-results-decoration {
   padding-right: 0.125rem;
 }
 
+.px-1{
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
+
 .px-2{
   padding-left: 0.5rem;
   padding-right: 0.5rem;
 }
 
-.px-3{
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-}
-
 .px-4{
   padding-left: 1rem;
   padding-right: 1rem;
@@ -2198,9 +2194,9 @@ input[type="search"]::-webkit-search-results-decoration {
     padding: 1.5rem;
   }
 
-  .sm\:px-3{
-    padding-left: 0.75rem;
-    padding-right: 0.75rem;
+  .sm\:px-5{
+    padding-left: 1.25rem;
+    padding-right: 1.25rem;
   }
 
   .sm\:px-6{
@@ -2333,11 +2329,6 @@ input[type="search"]::-webkit-search-results-decoration {
     margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
     margin-bottom: calc(0px * var(--tw-space-y-reverse));
   }
-
-  .lg\:px-5{
-    padding-left: 1.25rem;
-    padding-right: 1.25rem;
-  }
 }
 
 @media (min-width: 1536px){