lewis.moe
Monorepo for Tangled
appview/pages: add search submit button for mobile
Mobile need a dedicated search button to submit the form.
Also applied correct focus-ring for input tag
Signed-off-by: Seongmin Lee <git@boltless.me>
authored by
Seongmin Lee
and committed by
Tangled
3bdd8cd2
affc138f
+19
-8
appview/pages/templates/repo/issues/issues.html
+19
-8
appview/pages/templates/repo/issues/issues.html
···
30
<div class="grid gap-2 grid-cols-[auto_1fr_auto] grid-row-2">
31
<form class="flex relative col-span-3 sm:col-span-1 sm:col-start-2" method="GET">
32
<input type="hidden" name="state" value="{{ if .FilteringByOpen }}open{{ else }}closed{{ end }}">
33
-
<div class="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 pointer-events-none">
34
-
{{ i "search" "w-4 h-4" }}
35
</div>
36
-
<input class="flex-1 p-1 pl-10 pr-10 peer" type="text" name="q" value="{{ .FilterQuery }}" placeholder=" ">
37
-
<a
38
-
href="?state={{ if .FilteringByOpen }}open{{ else }}closed{{ end }}"
39
-
class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hidden peer-[:not(:placeholder-shown)]:block"
40
>
41
-
{{ i "x" "w-4 h-4" }}
42
-
</a>
43
</form>
44
<div class="sm:row-start-1">
45
{{ template "fragments/tabSelector" (dict "Name" "state" "Values" $values "Active" $active) }}
···
30
<div class="grid gap-2 grid-cols-[auto_1fr_auto] grid-row-2">
31
<form class="flex relative col-span-3 sm:col-span-1 sm:col-start-2" method="GET">
32
<input type="hidden" name="state" value="{{ if .FilteringByOpen }}open{{ else }}closed{{ end }}">
33
+
<div class="flex-1 flex relative">
34
+
<input
35
+
class="flex-1 py-1 pl-2 pr-10 mr-[-1px] rounded-r-none focus:border-0 focus:outline-none focus:ring focus:ring-blue-400 ring-inset peer"
36
+
type="text"
37
+
name="q"
38
+
value="{{ .FilterQuery }}"
39
+
placeholder=" "
40
+
>
41
+
<a
42
+
href="?state={{ if .FilteringByOpen }}open{{ else }}closed{{ end }}"
43
+
class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hidden peer-[:not(:placeholder-shown)]:block"
44
+
>
45
+
{{ i "x" "w-4 h-4" }}
46
+
</a>
47
</div>
48
+
<button
49
+
type="submit"
50
+
class="p-2 text-gray-400 border rounded-r border-gray-400 dark:border-gray-600"
51
>
52
+
{{ i "search" "w-4 h-4" }}
53
+
</button>
54
</form>
55
<div class="sm:row-start-1">
56
{{ template "fragments/tabSelector" (dict "Name" "state" "Values" $values "Active" $active) }}
+19
-8
appview/pages/templates/repo/pulls/pulls.html
+19
-8
appview/pages/templates/repo/pulls/pulls.html
···
36
<div class="grid gap-2 grid-cols-[auto_1fr_auto] grid-row-2">
37
<form class="flex relative col-span-3 sm:col-span-1 sm:col-start-2" method="GET">
38
<input type="hidden" name="state" value="{{ .FilteringBy.String }}">
39
-
<div class="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 pointer-events-none">
40
-
{{ i "search" "w-4 h-4" }}
41
</div>
42
-
<input class="flex-1 p-1 pl-10 pr-10 peer" type="text" name="q" value="{{ .FilterQuery }}" placeholder=" ">
43
-
<a
44
-
href="?state={{ .FilteringBy.String }}"
45
-
class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hidden peer-[:not(:placeholder-shown)]:block"
46
>
47
-
{{ i "x" "w-4 h-4" }}
48
-
</a>
49
</form>
50
<div class="sm:row-start-1">
51
{{ template "fragments/tabSelector" (dict "Name" "state" "Values" $values "Active" $active) }}
···
36
<div class="grid gap-2 grid-cols-[auto_1fr_auto] grid-row-2">
37
<form class="flex relative col-span-3 sm:col-span-1 sm:col-start-2" method="GET">
38
<input type="hidden" name="state" value="{{ .FilteringBy.String }}">
39
+
<div class="flex-1 flex relative">
40
+
<input
41
+
class="flex-1 py-1 pl-2 pr-10 mr-[-1px] rounded-r-none focus:border-0 focus:outline-none focus:ring focus:ring-blue-400 ring-inset peer"
42
+
type="text"
43
+
name="q"
44
+
value="{{ .FilterQuery }}"
45
+
placeholder=" "
46
+
>
47
+
<a
48
+
href="?state={{ .FilteringBy.String }}"
49
+
class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hidden peer-[:not(:placeholder-shown)]:block"
50
+
>
51
+
{{ i "x" "w-4 h-4" }}
52
+
</a>
53
</div>
54
+
<button
55
+
type="submit"
56
+
class="p-2 text-gray-400 border rounded-r border-gray-400 dark:border-gray-600"
57
>
58
+
{{ i "search" "w-4 h-4" }}
59
+
</button>
60
</form>
61
<div class="sm:row-start-1">
62
{{ template "fragments/tabSelector" (dict "Name" "state" "Values" $values "Active" $active) }}