docker
/
docs
mirror of https://github.com/docker/docs.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

search: fix responsiveness issue on md screens 

Signed-off-by: David Karlsson <35727626+dvdksn@users.noreply.github.com>
This commit is contained in:
David Karlsson 2024-09-17 10:15:59 +02:00
parent 2f50130831
commit 52f9c17066
2 changed files with 20 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
hugo_stats.json
View File

@ -350,7 +350,6 @@
"lg:pb-2", "lg:pb-2",
"lg:scale-100", "lg:scale-100",
"lg:text-base", "lg:text-base",
"lg:w-[1200px]",
"link", "link",
"lntable", "lntable",
"lntd", "lntd",
@ -432,7 +431,6 @@
"placeholder:text-white", "placeholder:text-white",
"pr-2", "pr-2",
"prose", "prose",
"pt-0",
"pt-4", "pt-4",
"px-1", "px-1",
"px-2", "px-2",
@ -529,7 +527,6 @@
"w-[32px]", "w-[32px]",
"w-fit", "w-fit",
"w-full", "w-full",
"w-lvw",
"w-screen", "w-screen",
"xl:grid-cols-3", "xl:grid-cols-3",
"xl:grid-cols-4", "xl:grid-cols-4",

42
layouts/_default/search.html
View File

@ -3,29 +3,27 @@
{{ end }} {{ end }}
{{ define "main" }} {{ define "main" }}
<div class="w-lvw overflow-clip p-6 pt-0 lg:w-[1200px]"> <article class="prose max-w-none dark:prose-invert">
<article class="prose max-w-none dark:prose-invert"> <h1 class="py-4">{{ .Title }}</h1>
<h1 class="py-4">{{ .Title }}</h1> {{ .Content }}
{{ .Content }} <div class="not-prose">
<div class="not-prose"> <div class="flex gap-4">
<div class="flex gap-4"> <input type="search" id="search-page-input"
<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="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" />
placeholder="Search…" tabindex="0" /> <button
<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">
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>
<span>Ask&nbsp;AI</span> <img height="24px" width="24px" src="{{ (resources.Get "images/ai-stars.svg").Permalink }}"
<img height="24px" width="24px" src="{{ (resources.Get "images/ai-stars.svg").Permalink }}" alt="AI sparkles!" />
alt="AI sparkles!" /> </button>
</button>
</div>
<hr class="border-divider-light dark:border-divider-dark">
<div id="search-page-results">
<!-- results -->
</div>
</div> </div>
</article> <hr class="border-divider-light dark:border-divider-dark">
</div> <div id="search-page-results">
<!-- results -->
</div>
</div>
</article>
<script type="module"> <script type="module">
// Global variable to hold the pagefind module // Global variable to hold the pagefind module
let pagefind; let pagefind;