rickub
nandi/gleanpublic⑂ Fork 0
⑂ 65861f6
Branches
claude/modal-container-min-76527a main View all branches → View all tags →
Commits
⬇ Clone ▾
git clone https://git.rickub.com/nandi/glean.git
git clone ssh://git@rickub.com/nandi/glean.git

Host key fingerprint (ed25519): SHA256:iycHnxEyq0Q7uyVpB7JlznP0G7JrTPXLYRcAU5CSLhc — verify it before your first connect.

Refactor mobile navigation and layout stylingUnverified

Julien Robert committed 2026-05-05T12:02:49+02:00 Browse files
65861f6 parent: 1612dcc
modified internal/tmpl/articles.html +1 -1
@@ -43,7 +43,7 @@
4343 <p class="text-sm text-spot-secondary mb-6">All your subscribed articles, newest first.</p>
4444 {{end}}
4545
46- <div class="flex items-center gap-3 mb-6">
46+ <div class="flex items-center gap-3 mb-6 flex-wrap">
4747 <form method="GET" action="/articles" class="flex-1" id="search-form">
4848 <div class="relative">
4949 <input type="text" name="q" value="{{.SearchQuery}}" placeholder="Search articles..."
@@ -43,7 +43,7 @@
43 <p class="text-sm text-spot-secondary mb-6">All your subscribed articles, newest first.</p>43 <p class="text-sm text-spot-secondary mb-6">All your subscribed articles, newest first.</p>
44 {{end}}44 {{end}}
45 45
46- <div class="flex items-center gap-3 mb-6">46+ <div class="flex items-center gap-3 mb-6 flex-wrap">
47 <form method="GET" action="/articles" class="flex-1" id="search-form">47 <form method="GET" action="/articles" class="flex-1" id="search-form">
48 <div class="relative">48 <div class="relative">
49 <input type="text" name="q" value="{{.SearchQuery}}" placeholder="Search articles..."49 <input type="text" name="q" value="{{.SearchQuery}}" placeholder="Search articles..."
modified internal/tmpl/base.html +26 -34
@@ -120,44 +120,36 @@
120120 </div>
121121 </aside>
122122
123- <nav id="mobile-nav" class="lg:hidden fixed bottom-0 left-0 right-0 bg-spot-surface/80 backdrop-blur-xl border-t border-spot-divider z-30 px-2 py-2">
124- <div class="flex items-center justify-around">
125- <a href="/dashboard" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/dashboard"}} text-[10px] px-2 py-1">
126- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-4 0a1 1 0 01-1-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 01-1 1"/></svg>
127- Home
128- </a>
129- <a href="/articles" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/articles"}} text-[10px] px-2 py-1">
130- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2"/></svg>
131- Articles
132- </a>
133- <a href="/trending" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/trending"}} text-[10px] px-2 py-1">
134- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"/></svg>
135- Trending
136- </a>
137- <a href="/feeds" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/feeds"}} text-[10px] px-2 py-1">
138- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 5c7.18 0 13 5.82 13 13M6 11a7 7 0 017 7m-7-1a1 1 0 11-2 0 1 1 0 012 0z"/></svg>
139- Feeds
140- </a>
141- <a href="/library" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/library"}} text-[10px] px-2 py-1">
142- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 8h10M7 12h4m1 8l-4-4H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-3l-4 4z"/></svg>
143- Library
144- </a>
145- </div>
146- </nav>
147123 {{end}}
148124
149- <main id="main-content" class="{{if or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats"))}}lg:ml-60 pb-20 lg:pb-0{{end}} flex-1 min-h-screen flex flex-col">
125+ <main id="main-content" class="{{if or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats"))}}lg:ml-60{{end}} flex-1 min-h-screen flex flex-col">
150126 {{if or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats"))}}
151- <div class="lg:hidden bg-spot-surface border-b border-spot-divider px-4 py-3 flex items-center justify-between sticky top-0 z-20">
127+ <div class="lg:hidden bg-spot-surface border-b border-spot-divider px-2 py-2 flex items-center justify-between sticky top-0 z-20">
152128 {{template "logo-link"}}
153- {{if .User}}
154- <a href="/profile/{{.User.DID}}" class="flex items-center gap-2">
155- {{if .User.AvatarURL}}<img src="{{.User.AvatarURL}}" class="w-7 h-7 rounded-full">{{end}}
156- <span class="text-xs text-spot-secondary">@{{.User.Handle}}</span>
157- </a>
158- {{else}}
159- <a href="/auth/login" class="bg-spot-green text-white rounded-pill px-4 py-1.5 text-xs font-bold uppercase tracking-button hover:brightness-110 transition">Sign in</a>
160- {{end}}
129+ <div class="flex items-center gap-0.5">
130+ <a href="/dashboard" class="p-1.5 rounded-md {{if eq .ActivePath "/dashboard"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Dashboard">
131+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-4 0a1 1 0 01-1-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 01-1 1"/></svg>
132+ </a>
133+ <a href="/articles" class="p-1.5 rounded-md {{if eq .ActivePath "/articles"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Articles">
134+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2"/></svg>
135+ </a>
136+ <a href="/trending" class="p-1.5 rounded-md {{if eq .ActivePath "/trending"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Trending">
137+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"/></svg>
138+ </a>
139+ <a href="/feeds" class="p-1.5 rounded-md {{if eq .ActivePath "/feeds"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Feeds">
140+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 5c7.18 0 13 5.82 13 13M6 11a7 7 0 017 7m-7-1a1 1 0 11-2 0 1 1 0 012 0z"/></svg>
141+ </a>
142+ <a href="/library" class="p-1.5 rounded-md {{if eq .ActivePath "/library"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Library">
143+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 8h10M7 12h4m1 8l-4-4H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-3l-4 4z"/></svg>
144+ </a>
145+ {{if .User}}
146+ <a href="/profile/{{.User.DID}}" class="shrink-0 ml-1" title="@{{.User.Handle}}">
147+ {{if .User.AvatarURL}}<img src="{{.User.AvatarURL}}" class="w-7 h-7 rounded-full ring-1 ring-spot-divider">{{end}}
148+ </a>
149+ {{else}}
150+ <a href="/auth/login" class="bg-spot-green text-white rounded-pill px-3 py-1 text-xs font-bold uppercase tracking-button hover:brightness-110 transition shrink-0 ml-1">Sign in</a>
151+ {{end}}
152+ </div>
161153 </div>
162154 {{end}}
163155 <div class="{{if not (or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats")))}}w-full{{else}}max-w-6xl mx-auto px-4 lg:px-8 py-6{{end}} flex-1">
@@ -120,44 +120,36 @@
120 </div>120 </div>
121 </aside>121 </aside>
122 122
123- <nav id="mobile-nav" class="lg:hidden fixed bottom-0 left-0 right-0 bg-spot-surface/80 backdrop-blur-xl border-t border-spot-divider z-30 px-2 py-2">
124- <div class="flex items-center justify-around">
125- <a href="/dashboard" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/dashboard"}} text-[10px] px-2 py-1">
126- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-4 0a1 1 0 01-1-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 01-1 1"/></svg>
127- Home
128- </a>
129- <a href="/articles" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/articles"}} text-[10px] px-2 py-1">
130- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2"/></svg>
131- Articles
132- </a>
133- <a href="/trending" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/trending"}} text-[10px] px-2 py-1">
134- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"/></svg>
135- Trending
136- </a>
137- <a href="/feeds" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/feeds"}} text-[10px] px-2 py-1">
138- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 5c7.18 0 13 5.82 13 13M6 11a7 7 0 017 7m-7-1a1 1 0 11-2 0 1 1 0 012 0z"/></svg>
139- Feeds
140- </a>
141- <a href="/library" class="flex flex-col items-center gap-0.5 {{activeClass .ActivePath "/library"}} text-[10px] px-2 py-1">
142- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 8h10M7 12h4m1 8l-4-4H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-3l-4 4z"/></svg>
143- Library
144- </a>
145- </div>
146- </nav>
147 {{end}}123 {{end}}
148 124
149- <main id="main-content" class="{{if or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats"))}}lg:ml-60 pb-20 lg:pb-0{{end}} flex-1 min-h-screen flex flex-col">125+ <main id="main-content" class="{{if or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats"))}}lg:ml-60{{end}} flex-1 min-h-screen flex flex-col">
150 {{if or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats"))}}126 {{if or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats"))}}
151- <div class="lg:hidden bg-spot-surface border-b border-spot-divider px-4 py-3 flex items-center justify-between sticky top-0 z-20">127+ <div class="lg:hidden bg-spot-surface border-b border-spot-divider px-2 py-2 flex items-center justify-between sticky top-0 z-20">
152 {{template "logo-link"}}128 {{template "logo-link"}}
153- {{if .User}}129+ <div class="flex items-center gap-0.5">
154- <a href="/profile/{{.User.DID}}" class="flex items-center gap-2">130+ <a href="/dashboard" class="p-1.5 rounded-md {{if eq .ActivePath "/dashboard"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Dashboard">
155- {{if .User.AvatarURL}}<img src="{{.User.AvatarURL}}" class="w-7 h-7 rounded-full">{{end}}131+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-4 0a1 1 0 01-1-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 01-1 1"/></svg>
156- <span class="text-xs text-spot-secondary">@{{.User.Handle}}</span>132+ </a>
157- </a>133+ <a href="/articles" class="p-1.5 rounded-md {{if eq .ActivePath "/articles"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Articles">
158- {{else}}134+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2"/></svg>
159- <a href="/auth/login" class="bg-spot-green text-white rounded-pill px-4 py-1.5 text-xs font-bold uppercase tracking-button hover:brightness-110 transition">Sign in</a>135+ </a>
160- {{end}}136+ <a href="/trending" class="p-1.5 rounded-md {{if eq .ActivePath "/trending"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Trending">
137+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"/></svg>
138+ </a>
139+ <a href="/feeds" class="p-1.5 rounded-md {{if eq .ActivePath "/feeds"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Feeds">
140+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 5c7.18 0 13 5.82 13 13M6 11a7 7 0 017 7m-7-1a1 1 0 11-2 0 1 1 0 012 0z"/></svg>
141+ </a>
142+ <a href="/library" class="p-1.5 rounded-md {{if eq .ActivePath "/library"}}text-spot-green{{else}}text-spot-secondary hover:text-spot-text{{end}} transition" title="Library">
143+ <svg class="w-[1.2rem] h-[1.2rem]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 8h10M7 12h4m1 8l-4-4H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-3l-4 4z"/></svg>
144+ </a>
145+ {{if .User}}
146+ <a href="/profile/{{.User.DID}}" class="shrink-0 ml-1" title="@{{.User.Handle}}">
147+ {{if .User.AvatarURL}}<img src="{{.User.AvatarURL}}" class="w-7 h-7 rounded-full ring-1 ring-spot-divider">{{end}}
148+ </a>
149+ {{else}}
150+ <a href="/auth/login" class="bg-spot-green text-white rounded-pill px-3 py-1 text-xs font-bold uppercase tracking-button hover:brightness-110 transition shrink-0 ml-1">Sign in</a>
151+ {{end}}
152+ </div>
161 </div>153 </div>
162 {{end}}154 {{end}}
163 <div class="{{if not (or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats")))}}w-full{{else}}max-w-6xl mx-auto px-4 lg:px-8 py-6{{end}} flex-1">155 <div class="{{if not (or .User (or (eq .ActivePath "/trending") (eq .ActivePath "/stats")))}}w-full{{else}}max-w-6xl mx-auto px-4 lg:px-8 py-6{{end}} flex-1">
modified static/input.css +1 -7
@@ -96,13 +96,7 @@ body {
9696 color: var(--spot-text);
9797 }
9898
99-#mobile-nav a.bg-spot-hover {
100- background: transparent !important;
101- color: #00754A !important;
102-}
103-#mobile-nav a {
104- transition: color 0.15s ease;
105-}
99+
106100
107101 ::-webkit-scrollbar { width: 8px; }
108102 ::-webkit-scrollbar-track { background: var(--spot-bg); }
@@ -96,13 +96,7 @@ body {
96 color: var(--spot-text);96 color: var(--spot-text);
97 }97 }
98 98
99-#mobile-nav a.bg-spot-hover {99+
100- background: transparent !important;
101- color: #00754A !important;
102-}
103-#mobile-nav a {
104- transition: color 0.15s ease;
105-}
106 100
107 ::-webkit-scrollbar { width: 8px; }101 ::-webkit-scrollbar { width: 8px; }
108 ::-webkit-scrollbar-track { background: var(--spot-bg); }102 ::-webkit-scrollbar-track { background: var(--spot-bg); }