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

Configure Feed

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

fix: mobile ui improvements

Patrick Dewey e2ecfbce 53349310

+7 -7
+1 -1
internal/web/components/footer.templ
··· 10 10 <nav class="flex flex-wrap justify-center gap-6 text-sm"> 11 11 <a href="/about" class="text-brown-700 hover:text-brown-900 transition-colors">About</a> 12 12 <a href="/terms" class="text-brown-700 hover:text-brown-900 transition-colors">Terms of Service</a> 13 - <a href="https://github.com/ptdewey/arabica" target="_blank" rel="noopener noreferrer" class="text-brown-700 hover:text-brown-900 transition-colors">Source Code</a> 13 + <a href="https://github.com/arabica-social/arabica" target="_blank" rel="noopener noreferrer" class="text-brown-700 hover:text-brown-900 transition-colors">Source Code</a> 14 14 <a href="/atproto" class="text-brown-700 hover:text-brown-900 transition-colors">AT Protocol</a> 15 15 </nav> 16 16 </div>
+1 -1
internal/web/components/layout.templ
··· 138 138 UserDID: data.UserDID, 139 139 IsModerator: data.IsModerator, 140 140 }) 141 - <main class="flex-grow container mx-auto px-4 py-8" data-transition> 141 + <main class="flex-grow container mx-auto py-8" data-transition> 142 142 @content 143 143 </main> 144 144 @Footer()
+1 -1
internal/web/pages/home.templ
··· 33 33 // TODO: add pagination and "load more" button to feed 34 34 // - this is probably mostly a backend change 35 35 templ CommunityFeedSection() { 36 - <div class="card p-6 mb-8"> 36 + <div class="card p-2 sm:p-6 mb-8"> 37 37 <h3 class="text-xl font-bold text-brown-900 mb-4">☕ Community Feed</h3> 38 38 <div hx-get="/api/feed" hx-trigger="load" hx-swap="innerHTML"> 39 39 @FeedLoadingSkeleton()
+4 -4
static/css/app.css
··· 24 24 @layer components { 25 25 /* Page Containers */ 26 26 .page-container { 27 - @apply mx-auto px-4; 27 + @apply mx-auto px-2 sm:px-4; 28 28 } 29 29 30 30 .page-container-sm { ··· 174 174 175 175 /* Feed Components */ 176 176 .feed-card { 177 - @apply bg-gradient-to-br from-brown-50 to-brown-100 rounded-lg shadow-md border border-brown-200 p-4 hover:shadow-lg transition-shadow; 177 + @apply bg-gradient-to-br from-brown-50 to-brown-100 rounded-lg shadow-md border border-brown-200 p-3 sm:p-4 hover:shadow-lg transition-shadow; 178 178 } 179 179 180 180 .feed-content-box { 181 - @apply bg-white/60 backdrop-blur rounded-lg p-4 border border-brown-200; 181 + @apply bg-white/60 backdrop-blur rounded-lg p-3 sm:p-4 border border-brown-200; 182 182 } 183 183 184 184 .feed-content-box-sm { 185 - @apply bg-white/60 backdrop-blur rounded-lg p-3 border border-brown-200; 185 + @apply bg-white/60 backdrop-blur rounded-lg p-2 sm:p-3 border border-brown-200; 186 186 } 187 187 188 188 /* Avatar - base styles */