From 1e750cc7e161558de5133603b32315a71dc820c8 Mon Sep 17 00:00:00 2001
From: Pasha Sviderski <me@psviderski.name>
Date: Mon, 4 Aug 2025 14:50:56 +1000
Subject: [PATCH] chore: add Blog links on landing page, fix header on small
 screens

---
 website/landing/index.html | 35 ++++++++++++++++++++---------------
 website/landing/style.css  | 18 ++++++++++++++----
 2 files changed, 34 insertions(+), 19 deletions(-)

diff --git a/website/landing/index.html b/website/landing/index.html
index 4b66da4f..ef441eb5 100644
--- a/website/landing/index.html
+++ b/website/landing/index.html
@@ -61,22 +61,23 @@
 
                 <!-- Navigation links -->
                 <nav class="flex grow">
-                    <ul class="flex grow justify-end flex-wrap items-center">
+                    <!-- 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 flex items-center transition"
-                               href="/docs">
-                                <svg class="w-4 h-4 mr-1 fill-current hidden sm:inline"
-                                     xmlns="http://www.w3.org/2000/svg"
-                                     viewBox="0 0 24 24">
-                                    <path d="M14,2H6A2,2 0 0,0 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2M18,20H6V4H13V9H18V20Z"/>
-                                </svg>
-                                <span class="ml-1">Docs</span>
-                            </a>
+                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-3 lg: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 flex items-center transition"
+                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 px-3 lg:px-5 py-2 transition"
+                               href="/blog">Blog</a>
+                        </li>
+                    </ul>
+                    <!-- Right side navigation -->
+                    <ul class="flex grow justify-end flex-wrap items-center">
+                        <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"
                                href="https://discord.gg/eR35KQJhPu">
-                                <svg class="w-4 h-4 mr-1 fill-current" xmlns="http://www.w3.org/2000/svg"
+                                <svg class="w-4 h-4 sm:mr-1 fill-current" xmlns="http://www.w3.org/2000/svg"
                                      viewBox="0 0 24 24">
                                     <path d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z"/>
                                 </svg>
@@ -84,9 +85,9 @@
                             </a>
                         </li>
                         <li>
-                            <a class="text-sm font-medium text-zinc-500 hover:text-zinc-900 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-3 lg:px-5 py-2 flex items-center transition"
                                href="https://github.com/psviderski/uncloud">
-                                <svg class="w-4 h-4 mr-1 fill-current" xmlns="http://www.w3.org/2000/svg"
+                                <svg class="w-4 h-4 sm:mr-1 fill-current" xmlns="http://www.w3.org/2000/svg"
                                      viewBox="0 0 24 24">
                                     <path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/>
                                 </svg>
@@ -128,7 +129,7 @@
                                 <div>
                                     <a class="btn text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow"
                                        href="https://github.com/psviderski/uncloud/?tab=readme-ov-file#-quick-start">
-                                        Deploy in 2 minutes
+                                        Quick start
                                     </a>
                                 </div>
                                 <div>
@@ -727,6 +728,10 @@
                             <a class="text-zinc-500 hover:text-zinc-900 transition"
                                href="/docs/getting-started/deploy-demo-app">Quick start</a>
                         </li>
+                        <li>
+                            <a class="text-zinc-500 hover:text-zinc-900 transition"
+                               href="/blog">Blog</a>
+                        </li>
                     </ul>
                 </div>
 
diff --git a/website/landing/style.css b/website/landing/style.css
index d77bc58e..182b8741 100644
--- a/website/landing/style.css
+++ b/website/landing/style.css
@@ -1188,10 +1188,6 @@ input[type="search"]::-webkit-search-results-decoration {
   margin-left: 0.5rem;
 }
 
-.mr-1{
-  margin-right: 0.25rem;
-}
-
 .mr-2{
   margin-right: 0.5rem;
 }
@@ -1668,6 +1664,11 @@ input[type="search"]::-webkit-search-results-decoration {
   padding-right: 0.125rem;
 }
 
+.px-2{
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+}
+
 .px-3{
   padding-left: 0.75rem;
   padding-right: 0.75rem;
@@ -2198,6 +2199,10 @@ input[type="search"]::-webkit-search-results-decoration {
     grid-column: span 6 / span 6;
   }
 
+  .sm\:mr-1{
+    margin-right: 0.25rem;
+  }
+
   .sm\:inline{
     display: inline;
   }
@@ -2246,6 +2251,11 @@ input[type="search"]::-webkit-search-results-decoration {
     padding: 1.5rem;
   }
 
+  .sm\:px-3{
+    padding-left: 0.75rem;
+    padding-right: 0.75rem;
+  }
+
   .sm\:px-6{
     padding-left: 1.5rem;
     padding-right: 1.5rem;