From 43de8334e27d356ec40126bb2cb735e19176ddc2 Mon Sep 17 00:00:00 2001
From: alemi <me@alemi.dev>
Date: Fri, 27 Dec 2024 02:04:30 +0100
Subject: [PATCH] feat(web): better follow/following/follows tags

still lot to do but better than previous misaligned bs!
---
 web/src/actors/header.rs | 28 +++++++++++++++++++++++-----
 1 file changed, 23 insertions(+), 5 deletions(-)

diff --git a/web/src/actors/header.rs b/web/src/actors/header.rs
index 02ee845..4708d24 100644
--- a/web/src/actors/header.rs
+++ b/web/src/actors/header.rs
@@ -81,19 +81,37 @@ pub fn ActorHeader() -> impl IntoView {
 							<div class="ma-s pt-3 rev" style="flex-grow: 1; white-space: nowrap;">
 							</div>
 						</div>
-						<div class="rev mr-1" class:hidden=move || !auth.present() || auth.user_id() == uid>
+						<div class="mr-1 ml-1" class:hidden=move || !auth.present() || auth.user_id() == uid>
 							{if following_me {
-								Some(view! { <code class="mr-1 color">follows you</code> })
+								Some(view! {
+									<a class="clean dim" href="#remove" on:click=move |_| tracing::error!("not yet implemented")>
+										<span class="border-button ml-s" title="remove follower (not yet implemented)">
+											<code class="color mr-s">"!"</code>
+											<small class="mr-s">follows you</small>
+										</span>
+									</a>
+								})
 							} else {
 								None
 							}}
 							{if followed_by_me {
 								view! {
-									<code class="color">"following"</code>
-									<input type="submit" value="x" on:click=move |_| unfollow(_uid.clone()) />
+									<a class="clean dim" href="#unfollow" on:click=move |_| unfollow(_uid.clone())>
+										<span class="border-button ml-s" title="undo follow">
+											<code class="color mr-s">x</code>
+											<small class="mr-s">following</small>
+										</span>
+									</a>
 								}.into_view()
 							} else {
-								view! { <input type="submit" value="follow" on:click=move |_| send_follow_request(_uid.clone()) /> }.into_view()
+								view! {
+									<a class="clean dim" href="#follow" on:click=move |_| send_follow_request(_uid.clone())>
+										<span class="border-button ml-s" title="send follow request">
+											<code class="color mr-s">+</code>
+											<small class="mr-s">follow</small>
+										</span>
+									</a>
+								}.into_view()
 							}}
 						</div>
 					</div>