Coffee journaling on ATProto (alpha) alpha.arabica.social
coffee
17
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat: minor page layout/styling tweaks

+23 -5
+6 -1
internal/web/components/shared.templ
··· 117 117 118 118 templ WelcomeAuthenticated(userDID string) { 119 119 <div class="mb-6"> 120 - <p class="text-sm text-brown-700">Logged in as: <span class="font-mono text-brown-900 font-semibold">{ userDID }</span></p> 120 + // TODO: maybe add a parenthetical here with "what is this?" linking to the atproto page 121 + <p class="text-sm text-brown-700"> 122 + Logged in as: <span class="font-mono text-brown-900 font-semibold">{ userDID }</span> 123 + <a href="/atproto" class="text-brown-700 hover:text-brown-900 transition-colors">(What is this?)</a> 124 + </p> 121 125 </div> 122 126 <div class="grid grid-cols-1 md:grid-cols-2 gap-4"> 123 127 <a ··· 174 178 } 175 179 176 180 templ AboutInfoCard() { 181 + // TODO: only show this at the bottom of the page when authenticated already? 177 182 <div class="bg-gradient-to-br from-amber-50 to-brown-100 rounded-xl p-6 border-2 border-brown-300 shadow-lg mb-6"> 178 183 <h3 class="text-lg font-bold text-brown-900 mb-3">✨ About Arabica</h3> 179 184 <ul class="text-brown-800 space-y-2 leading-relaxed mb-3">
+5 -2
internal/web/pages/about.templ
··· 89 89 Get Started 90 90 </a> 91 91 } else { 92 - <a href="/brews/new" class="inline-block bg-gradient-to-r from-brown-700 to-brown-800 text-white px-8 py-3 rounded-lg hover:from-brown-800 hover:to-brown-900 transition-all font-semibold shadow-lg hover:shadow-xl"> 93 - Log Your Next Brew 92 + // <a href="/brews/new" class="inline-block bg-gradient-to-r from-brown-700 to-brown-800 text-white px-8 py-3 rounded-lg hover:from-brown-800 hover:to-brown-900 transition-all font-semibold shadow-lg hover:shadow-xl"> 93 + // Log Your Next Brew 94 + // </a> 95 + <a href="/" class="inline-block bg-gradient-to-r from-brown-700 to-brown-800 text-white px-8 py-3 rounded-lg hover:from-brown-800 hover:to-brown-900 transition-all font-semibold shadow-lg hover:shadow-xl"> 96 + Back to Home 94 97 </a> 95 98 } 96 99 </div>
+1 -1
internal/web/pages/atproto.templ
··· 135 135 </section> 136 136 </div> 137 137 <div class="mt-12 text-center"> 138 - <a href="/" class="btn-primary px-8 py-3"> 138 + <a href="/" class="inline-block bg-gradient-to-r from-brown-700 to-brown-800 text-white px-8 py-3 rounded-lg hover:from-brown-800 hover:to-brown-900 transition-all font-semibold shadow-lg hover:shadow-xl"> 139 139 Back to Home 140 140 </a> 141 141 </div>
+11 -1
internal/web/pages/home.templ
··· 17 17 IsAuthenticated: props.IsAuthenticated, 18 18 UserDID: props.UserDID, 19 19 }) 20 - @components.AboutInfoCard() 20 + // Move about section after feed for authenticated users 21 + // TODO: maybe leave it as a small section that can be 22 + // opened via a drowdown? 23 + if !props.IsAuthenticated { 24 + @components.AboutInfoCard() 25 + } 21 26 @CommunityFeedSection() 27 + if props.IsAuthenticated { 28 + @components.AboutInfoCard() 29 + } 22 30 </div> 23 31 } 24 32 33 + // TODO: add pagination and "load more" button to feed 34 + // - this is probably mostly a backend change 25 35 templ CommunityFeedSection() { 26 36 <div class="bg-gradient-to-br from-brown-100 to-brown-200 rounded-xl shadow-xl p-6 mb-8 border border-brown-300"> 27 37 <h3 class="text-xl font-bold text-brown-900 mb-4">☕ Community Feed</h3>