Merge pull request #20961 from docker/published-update

publish updates from main

content/guides/use-case/kafka.md

@@ -2,6 +2,7 @@
 description: Developing event-driven applications with Kafka and Docker
 keywords: kafka, container-supported development
 title: Developing event-driven applications with Kafka and Docker
+linktitle: Event-driven apps with Kafka
 toc_max: 2
 ---
 

content/guides/use-case/localstack.md

@@ -2,6 +2,7 @@
 description: How to develop and test AWS Cloud applications using LocalStack and Docker
 keywords: LocalStack, container-supported development
 title: Develop and test AWS Cloud applications using LocalStack and Docker
+linktitle: AWS development with LocalStack
 ---
 
 In modern application development, testing cloud applications locally before deploying them to a live environment helps you ship faster and with more confidence. This approach involves simulating services locally, identifying and fixing issues early, and iterating quickly without incurring costs or facing the complexities of a full cloud environment. Tools like [LocalStack](https://www.localstack.cloud/) have become invaluable in this process, enabling you to emulate AWS services and containerize applications for consistent, isolated testing environments. 

content/manuals/engine/cli/proxy.md

@@ -84,7 +84,7 @@ sections for configuring proxy settings for the CLI and daemon.
 
 ### Run containers with a proxy configuration
 
-When you start a container, its proxy-related environment variable are set
+When you start a container, its proxy-related environment variables are set
 to reflect your proxy configuration in `~/.docker/config.json`.
 
 For example, assuming a proxy configuration like the example

hugo_stats.json

@@ -172,7 +172,6 @@
       "border",
       "border-0",
       "border-amber-light",
-      "border-b",
       "border-b-2",
       "border-b-4",
       "border-b-gray-light-400",
@@ -273,6 +272,7 @@
       "flex-wrap",
       "focus:ring-blue-light",
       "font-medium",
+      "font-semibold",
       "footnote-backref",
       "footnote-ref",
       "footnotes",
@@ -314,6 +314,7 @@
       "hover:bg-gray-light-100",
       "hover:bg-gray-light-200",
       "hover:bg-gray-light-300",
+      "hover:bg-white/20",
       "hover:border-gray-light-200",
       "hover:border-white/20",
       "hover:dark:bg-gray-dark-300",
@@ -343,6 +344,10 @@
       "leading-snug",
       "left-0",
       "lg:block",
+      "lg:flex",
+      "lg:flex-row",
+      "lg:gap-4",
+      "lg:gap-8",
       "lg:grid-cols-2",
       "lg:grid-cols-3",
       "lg:hidden",
@@ -371,7 +376,6 @@
       "md:col-start-3",
       "md:flex",
       "md:flex-row",
-      "md:gap-8",
       "md:grid-cols-2",
       "md:grid-cols-3",
       "md:h-[334px]",
@@ -381,17 +385,18 @@
       "md:px-20",
       "md:scale-100",
       "md:sticky",
+      "md:text-base",
       "md:text-sm",
       "md:top-16",
       "md:w-[300px]",
       "md:z-auto",
       "min-h-screen",
       "min-w-0",
       "min-w-52",
+      "min-w-fit",
       "ml-3",
       "ml-auto",
       "mt-1",
-      "mt-2",
       "mt-20",
       "mx-auto",
       "my-0",
@@ -528,6 +533,7 @@
       "w-fit",
       "w-full",
       "w-screen",
+      "whitespace-nowrap",
       "xl:grid-cols-3",
       "xl:grid-cols-4",
       "xl:w-[1200px]",

layouts/_default/search.html

@@ -7,16 +7,19 @@
     <h1 class="py-4">{{ .Title }}</h1>
     {{ .Content }}
     <div class="not-prose">
-      <div class="flex gap-4">
+      <div class="flex flex-col lg:flex-row justify-between gap-8">
         <input type="search" id="search-page-input"
-          class="ring-[1.5px] ring-gray-light-200 dark:ring-gray-dark-400 w-full max-w-xl rounded px-4 py-2 outline-none bg-white dark:bg-background-dark focus:ring-blue-light dark:focus:ring-blue-dark"
+          class="min-w-0 ring-[1.5px] ring-gray-light-200 dark:ring-gray-dark-400 w-full max-w-xl rounded px-4 py-2 outline-none bg-white dark:bg-background-dark focus:ring-blue-light dark:focus:ring-blue-dark"
           placeholder="Search…" tabindex="0" />
-        <button
-          class="py-1 px-4 rounded open-kapa-widget flex w-fit gap-2 items-center hover:bg-gray-light-200 dark:hover:bg-gray-dark-200">
-          <span>Ask&nbsp;AI</span>
-          <img height="24px" width="24px" src="{{ (resources.Get "images/ai-stars.svg").Permalink }}"
-            alt="AI sparkles!" />
-        </button>
+        <div class="flex min-w-fit flex-col flex-grow items-center">
+          <p>Not finding what you're looking for?</p>
+          <button
+            class="px-2 py-1 font-semibold rounded open-kapa-widget flex w-fit gap-2 items-center hover:bg-gray-light-200 dark:hover:bg-gray-dark-200">
+            <span>Try Ask AI</span>
+            <img height="24px" width="24px" src="{{ (resources.Get "images/ai-stars.svg").Permalink }}"
+              alt="AI sparkles!" />
+          </button>
+        </div>
       </div>
       <hr class="border-divider-light dark:border-divider-dark">
       <div id="search-page-results">

layouts/partials/header.html

@@ -1,6 +1,6 @@
 <header class="w-full sticky top-0 z-20 h-16 px-6 text-white bg-gradient-to-r from-blue-light-600 to-blue-light dark:from-blue-dark-200 to-50% dark:to-blue-dark-100">
-  <div class="max-w-[1920px] mx-auto flex gap-8 h-full items-center justify-between">
-    <div class="flex h-full items-center md:gap-8 gap-2">
+  <div class="max-w-[1920px] mx-auto flex lg:gap-8 gap-2 h-full items-center justify-between">
+    <div class="flex h-full items-center lg:gap-8 gap-2">
       {{- if not .IsHome }}
       <button x-data @click="$store.showSidebar = true"
         class="icon-svg block px-4 md:hidden h-full" aria-label="Menu">
@@ -16,22 +16,27 @@
         </a>
       </div>
       <nav class="mt-1 hidden md:block">
-        <ul class="flex gap-4">
+        <ul class="flex text-sm md:text-base lg:gap-4">
           {{ range site.Menus.main }}
           <li
             {{- if or (eq page .Page) (page.IsDescendant .Page) }}
               class="border-b-4"
             {{- else }}
               class="border-b-4 border-transparent hover:border-white/20"
             {{- end }}>
-            <a class="block px-2 py-1" href="{{ .URL }}">{{ .Name }}</a>
+            <a class="block px-2 py-1 whitespace-nowrap" href="{{ .URL }}">{{ .Name }}</a>
           </li>
           {{ end }}
         </ul>
       </nav>
     </div>
-    <div class="flex min-w-0 items-center gap-6 flex-grow justify-end">
+    <div class="flex min-w-0 items-center gap-4 flex-grow justify-end">
       {{ partialCached "search-bar.html" "-" }}
+      <button @click="open = false"
+        class="dark:text-white py-1 px-2 rounded open-kapa-widget flex gap-1 items-center hover:bg-white/20 transition">
+        <span>Ask&nbsp;AI</span>
+        <img src="{{ (resources.Get "images/ai-stars.svg").Permalink }}" alt="AI Stars" />
+      </button>
       <button aria-label="Theme switch" id="theme-switch" class="svg-icon"
         x-data="{ theme: localStorage.getItem('theme-preference') }" x-init="$watch('theme', value => {
         localStorage.setItem('theme-preference', value);

layouts/partials/search-bar.html

@@ -5,7 +5,7 @@
 <!-- search button -->
 <div x-ref="searchBarRef" x-data="{ open: false }" @click.outside="open = false;"
   @keyup.escape.window="open = false" id="search-bar"
-  class="hidden sm:flex relative bg-white/10 rounded items-center p-2 sm:w-full xl:w-[400px]">
+  class="hidden min-w-0 sm:flex relative bg-white/10 rounded items-center p-2 sm:w-full xl:w-[400px]">
   {{ (resources.Get "images/search-ai.svg").Content | safeHTML }}
   <input x-ref="searchBarInput" type="search" id="search-bar-input" @focus="open = true;"
     @keyup.enter.prevent="window.location.href = '/search/?q=' + $event.target.value;"
@@ -18,9 +18,9 @@
             }
             break;
           }
-        }" class="flex-grow px-2 bg-transparent text-white placeholder:text-white outline-none" placeholder="Search"
+        }" class="flex-grow px-2 bg-transparent min-w-0 text-white placeholder:text-white outline-none" placeholder="Search"
     tabindex="0" />
-  <div x-cloak :class="open && 'hidden'" class="border px-1 text-sm border-white rounded flex items-center">
+  <div x-cloak :class="open && 'hidden'" class="hidden lg:flex border px-1 text-sm border-white rounded items-center">
     <div class="-mt-0.5">
       <span x-show="navigator.platform == 'MacIntel'" class="icon-svg icon-sm">{{ partialCached "icon" "keyboard_command_key" "keyboard_command_key" }}</span>
       <span x-show="navigator.platform != 'MacIntel'" class="icon-svg icon-sm">{{ partialCached "icon" "keyboard_control_key" "keyboard_control_key" }}</span>
@@ -34,17 +34,9 @@
   </div>
   <div x-show="open" x-cloak
     class="absolute px-6 py-4 right-0 w-screen max-w-xl top-full bg-background-light dark:bg-background-dark rounded shadow-lg z-50">
-    <button @click="open = false"
-      class="text-black dark:text-white py-1 px-2 rounded w-full open-kapa-widget flex justify-between items-center hover:bg-gray-light-200 dark:hover:bg-gray-dark-200">
-      <div class="flex gap-1 items-center">
-        <img src="{{ (resources.Get "images/ai-stars.svg").Permalink }}" alt="AI Stars" />
-        <span>Ask AI</span>
-      </div>
-      <span>→</span>
-    </button>
-    <hr class="mt-2 border-b border-divider-light dark:border-divider-dark">
     <div id="search-bar-results">
-      <div class="p-2 text-gray-light dark:text-gray-dark">Start typing to search…</div>
+      {{- $emptyState := `<div class="p-2 text-gray-light dark:text-gray-dark">Start typing to search… or try <button @click="open=false" class="open-kapa-widget link">Ask AI</button></div>` }}
+      {{- $emptyState | safe.HTML }}
       <!-- results -->
     </div>
   </div>
@@ -60,7 +52,7 @@
       async function search(e) {
         const query = e.target.value;
         if (query === "") {
-          searchBarResults.innerHTML = `<div class="p-2 text-gray-light dark:text-gray-dark">Start typing to search…</div>`;
+          searchBarResults.innerHTML = `{{ $emptyState | safe.HTML }}`;
           return;
         }
         const search = await pagefind.debouncedSearch(query);