zaire/campfire
1
0
Fork 0
forked from blisstown/campfire
Code Pull requests Activity

Button component improvements

Browse source 
buttons with a `href` now render as <a> elements, otherwise <button>
This commit is contained in:
ari melody 2025-07-14 01:06:16 +01:00
parent d0163ee094
commit 77665702b7
Signed by: ari
GPG key ID: CF99829C92678188
4 changed files with 64 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

35
src/lib/ui/Navigation.svelte
View file

@ -32,35 +32,6 @@
const dispatch = createEventDispatcher();
function handle_btn(name) {
if (!$account) return;
let route;
switch (name) {
case "timeline":
route = "/";
getTimeline(true);
break;
case "notifications":
route = "/notifications";
notifications.set([]);
getNotifications();
break;
case "explore":
case "lists":
case "favourites":
case "bookmarks":
case "hashtags":
default:
return;
}
if (!route) return;
window.scrollTo({
top: 0,
behavior: "smooth"
});
goto(route);
}
function gotoProfile() {
if (!$account) return;
playSound();
@ -102,7 +73,7 @@
{#if $account}
<div id="nav-items">
<Button label="Timeline"
on:click={() => handle_btn("timeline")}
href="/")}
active={$page.url.pathname === "/"}>
<svelte:fragment slot="icon">
<TimelineIcon/>
@ -110,7 +81,7 @@
{lang.string('navigation.timeline')}
</Button>
<Button label="Notifications"
on:click={() => handle_btn("notifications")}
href="notifications"}
active={$page.url.pathname === "/notifications"}>
<svelte:fragment slot="icon">
<NotificationsIcon/>
@ -183,7 +154,7 @@
<div id="account-button">
<img src={$account.avatar_url} class="account-avatar" height="64px" alt="" aria-hidden="true" on:click={() => gotoProfile()}>
<div class="account-name" aria-hidden="true">
<a href="/{$server.host}/{$account.username}" class="nickname" title={$account.nickname}>{@html $account.rich_name}</a>
<a href="/{$server.host}/@{$account.username}" class="nickname" title={$account.nickname}>{@html $account.rich_name}</a>
<span class="username" title={`@${$account.username}@${$account.host}`}>
{$account.fqn}
</span>