Skip to content

Commit e02f5b3

Browse files
committed
Simplify bottom nav
1 parent 65403a5 commit e02f5b3

File tree

4 files changed

+29
-116
lines changed

4 files changed

+29
-116
lines changed

templates/components/bottom_nav.templ

Lines changed: 5 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -14,21 +14,9 @@ templ BottomNav(page *controller.Page) {
1414
style="padding-bottom: env(safe-area-inset-bottom);"
1515
>
1616
<div
17-
class={
18-
"grid h-full max-w-lg mx-auto font-medium grid-cols-4",
19-
// templ.KV("grid-cols-3", page.ExperienceType == domain.ExperienceTypeCommittedRelationship),
20-
// templ.KV("grid-cols-4", page.ExperienceType == domain.ExperienceTypeDating),
21-
}
22-
hx-target="#main-content"
23-
hx-select="#main-content"
24-
hx-indicator="next #page-loading"
25-
hx-swap="outerHTML show:window:top"
26-
hx-push-url="true"
17+
class={ "grid h-full max-w-lg mx-auto font-medium grid-cols-4", }
2718
x-cloak
2819
x-data="{ selected: null }"
29-
if page.SelectedBottomNavbarItem.Value == "meet" {
30-
x-data="{ selected: 'meet' }"
31-
}
3220
if page.SelectedBottomNavbarItem.Value == "home" {
3321
x-data="{ selected: 'home' }"
3422
}
@@ -41,51 +29,17 @@ templ BottomNav(page *controller.Page) {
4129
if page.SelectedBottomNavbarItem.Value == "profile" {
4230
x-data="{ selected: 'profile' }"
4331
}
32+
hx-target="#bottomNavbarContent"
33+
hx-select="#bottomNavbarContent"
34+
hx-swap="outerHTML show:window:top"
4435
>
45-
// if page.ExperienceType == domain.ExperienceTypeDating {
46-
// // Meet button
47-
// <button
48-
// hx-get={ page.ToURL("meet.get_match") }
49-
// type="button"
50-
// class="inline-flex flex-col items-center justify-center px-5 hover:bg-gray-100 dark:hover:bg-gray-800 group rounded-xl m-2"
51-
// @click="selected = 'meet';"
52-
// >
53-
// <svg
54-
// xmlns="http://www.w3.org/2000/svg"
55-
// viewBox="0 0 20 20"
56-
// fill="currentColor"
57-
// class="w-7 h-7 group-hover:text-blue-600 dark:group-hover:text-blue-500"
58-
// :class="{'text-blue-500 dark:text-blue-400': selected === 'meet', 'text-gray-500 dark:text-gray-400': selected !== 'meet'}"
59-
// >
60-
// <path fill-rule="evenodd" d="M13.5 4.938a7 7 0 1 1-9.006 1.737c.202-.257.59-.218.793.039.278.352.594.672.943.954.332.269.786-.049.773-.476a5.977 5.977 0 0 1 .572-2.759 6.026 6.026 0 0 1 2.486-2.665c.247-.14.55-.016.677.238A6.967 6.967 0 0 0 13.5 4.938ZM14 12a4 4 0 0 1-4 4c-1.913 0-3.52-1.398-3.91-3.182-.093-.429.44-.643.814-.413a4.043 4.043 0 0 0 1.601.564c.303.038.531-.24.51-.544a5.975 5.975 0 0 1 1.315-4.192.447.447 0 0 1 .431-.16A4.001 4.001 0 0 1 14 12Z" clip-rule="evenodd"></path>
61-
// </svg>
62-
// </button>
63-
// }
64-
// Home button
6536
<button
66-
id="bottom-navbar-homefeed-button"
37+
id="bottomNavbarHomefeedButton"
6738
hx-get={ page.ToURL("home_feed") }
68-
hx-target="#bottomNavbarContent"
69-
hx-select="#bottomNavbarContent"
70-
hx-on="htmx:afterRequest:handleCacheUpdate"
7139
type="button"
7240
class="inline-flex flex-col items-center justify-center px-5 hover:bg-gray-100 dark:hover:bg-gray-800 group rounded-xl m-2"
7341
@click="selected = 'home';"
7442
>
75-
// <div class="relative">
76-
// <img
77-
// src="/files/favicon.png"
78-
// class="w-7 h-7 group-hover:text-blue-600 dark:group-hover:text-blue-500"
79-
// :class="{'hidden': selected === 'home', 'block grayscale dark:grayscale-50': selected !== 'home'}"
80-
// alt="Logo"
81-
// />
82-
// <img
83-
// src="/files/favicon.png"
84-
// class="w-7 h-7 group-hover:text-blue-600 dark:group-hover:text-blue-500"
85-
// :class="{'block text-blue-500 dark:text-blue-400': selected === 'home', 'hidden': selected !== 'home'}"
86-
// alt="Logo"
87-
// />
88-
// </div>
8943
<svg
9044
xmlns="http://www.w3.org/2000/svg"
9145
width="24"
@@ -113,8 +67,6 @@ templ BottomNav(page *controller.Page) {
11367
<button
11468
id="bottom-navbar-notifications-button"
11569
hx-get={ page.ToURL("normalNotifications") }
116-
hx-target="#bottomNavbarContent"
117-
hx-select="#bottomNavbarContent"
11870
type="button"
11971
class="inline-flex flex-col items-center justify-center px-5 hover:bg-gray-100 dark:hover:bg-gray-800 group rounded-xl m-2"
12072
@click="selected = 'notifications';"
@@ -162,9 +114,6 @@ templ BottomNav(page *controller.Page) {
162114
<button
163115
id="bottom-navbar-settings-button"
164116
hx-get={ page.ToURL("preferences") }
165-
hx-target="#bottomNavbarContent"
166-
hx-select="#bottomNavbarContent"
167-
hx-on="htmx:afterRequest:handleCacheUpdate"
168117
type="button"
169118
class="inline-flex flex-col items-center justify-center px-5 hover:bg-gray-100 dark:hover:bg-gray-800 group rounded-xl m-2"
170119
@click="selected = 'settings';"
@@ -196,9 +145,6 @@ templ BottomNav(page *controller.Page) {
196145
<button
197146
id="bottom-navbar-profile-button"
198147
hx-get={ page.ToURL("profile") }
199-
hx-target="#bottomNavbarContent"
200-
hx-select="#bottomNavbarContent"
201-
hx-on="htmx:afterRequest:handleCacheUpdate"
202148
type="button"
203149
class="inline-flex flex-col items-center justify-center px-5 hover:bg-gray-100 dark:hover:bg-gray-800 group rounded-xl m-2"
204150
@click="selected = 'profile';"

0 commit comments

Comments
 (0)