Monorepo for Tangled
docs: use google search query as a search bar
Signed-off-by: oppiliappan <me@oppi.li>
oppiliappan
(Jan 8, 2026, 8:30 AM UTC)
f26c1925
6dc86ffb
+14
-6
+7
docs/search.html
+7
docs/search.html
···
1
+
<form action="https://google.com/search" role="search" aria-label="Sitewide" class="w-full">
2
+
<input type="hidden" name="q" value="+[inurl:https://docs.tangled.org]">
3
+
<label>
4
+
<span style="display:none;">Search</span>
5
+
<input type="text" name="q" placeholder="Search docs ..." class="w-full font-normal">
6
+
</label>
7
+
</form>
+7
-6
docs/template.html
+7
-6
docs/template.html
···
37
37
<link rel="preload" href="/static/fonts/InterVariable.woff2" as="font" type="font/woff2" crossorigin />
38
38
39
39
</head>
40
-
<body class="bg-white dark:bg-gray-900 min-h-screen flex flex-col min-h-screen">
40
+
<body class="bg-white dark:bg-gray-900 flex flex-col min-h-svh">
41
41
$for(include-before)$
42
42
$include-before$
43
43
$endfor$
···
60
60
id="mobile-toc-popover"
61
61
popover
62
62
class="mobile-toc-popover
63
-
bg-white dark:bg-gray-800
64
-
border-r border-gray-200 dark:border-gray-700
65
-
h-full overflow-y-auto
63
+
bg-gray-50 dark:bg-gray-800 border-r border-gray-200 dark:border-gray-700
64
+
h-full overflow-y-auto shadow-sm
66
65
px-6 py-4 fixed inset-x-0 top-0 w-fit max-w-4/5 m-0"
67
66
>
68
67
<div class="flex flex-col min-h-full">
69
-
<div class="flex-1">
68
+
<div class="flex-1 space-y-4">
70
69
<button
71
70
type="button"
72
71
popovertarget="mobile-toc-popover"
···
75
74
${ x.svg() }
76
75
$if(toc-title)$$toc-title$$else$Table of Contents$endif$
77
76
</button>
77
+
${ search.html() }
78
78
${ table-of-contents:toc.html() }
79
79
</div>
80
80
${ single-page:mode.html() }
···
85
85
<nav
86
86
id="$idprefix$TOC"
87
87
role="doc-toc"
88
-
class="hidden md:flex md:flex-col fixed left-0 top-0 w-80 h-screen
88
+
class="hidden md:flex md:flex-col gap-4 fixed left-0 top-0 w-80 h-screen
89
89
bg-gray-50 dark:bg-gray-800 border-r border-gray-200 dark:border-gray-700
90
90
p-4 z-50 overflow-y-auto">
91
+
${ search.html() }
91
92
<div class="flex-1">
92
93
$if(toc-title)$
93
94
<h2 id="$idprefix$toc-title" class="text-lg font-semibold mb-4 text-gray-900">$toc-title$</h2>