Tweak mobile space menu

This commit is contained in:
Jon Staab
2025-10-28 16:46:49 -07:00
parent c82cf4a4c2
commit 62013a2ea2
7 changed files with 84 additions and 50 deletions
+2 -1
View File
@@ -31,7 +31,7 @@
} from "@app/core/state"
import {pushModal} from "@app/util/modal"
const openMenu = () => pushModal(SpaceAdd)
const openMenu = () => pushModal(SpaceAdd, {hideDiscover: true})
const termUrl = $derived(tryCatch(() => normalizeRelayUrl(term)) || "")
@@ -121,6 +121,7 @@
</label>
<Button class="btn btn-primary" onclick={openMenu}>
<Icon icon={AddCircle} />
<span class="hidden sm:inline">Add Space</span>
</Button>
</div>
{#if showScanner}
+1 -1
View File
@@ -9,7 +9,7 @@
import Key from "@assets/icons/key-minimalistic.svg?dataurl"
import LinkRound from "@assets/icons/link-round.svg?dataurl"
import Copy from "@assets/icons/copy.svg?dataurl"
import Settings from "@assets/icons/settings-minimalistic.svg?dataurl"
import Settings from "@assets/icons/settings.svg?dataurl"
import AltArrowDown from "@assets/icons/alt-arrow-down.svg?dataurl"
import AltArrowUp from "@assets/icons/alt-arrow-up.svg?dataurl"
import TrashBin2 from "@assets/icons/trash-bin-2.svg?dataurl"
+53
View File
@@ -0,0 +1,53 @@
<script lang="ts">
import SettingsMinimalistic from "@assets/icons/settings-minimalistic.svg?dataurl"
import AddCircle from "@assets/icons/add-circle.svg?dataurl"
import Icon from "@lib/components/Icon.svelte"
import Button from "@lib/components/Button.svelte"
import Page from "@lib/components/Page.svelte"
import PageBar from "@lib/components/PageBar.svelte"
import PageContent from "@lib/components/PageContent.svelte"
import MenuSpacesItem from "@app/components/MenuSpacesItem.svelte"
import SpaceAdd from "@app/components/SpaceAdd.svelte"
import {userSpaceUrls, PLATFORM_RELAYS} from "@app/core/state"
import {pushModal} from "@app/util/modal"
const addSpace = () => pushModal(SpaceAdd)
</script>
<Page class="cw-full">
<PageBar class="cw-full">
{#snippet icon()}
<div class="center">
<Icon icon={SettingsMinimalistic} />
</div>
{/snippet}
{#snippet title()}
<strong>Your Spaces</strong>
{/snippet}
{#snippet action()}
{#if $userSpaceUrls.length > 0 && PLATFORM_RELAYS.length === 0}
<Button class="btn btn-primary btn-sm" onclick={addSpace}>
<Icon icon={AddCircle} />
Add Space
</Button>
{/if}
{/snippet}
</PageBar>
<PageContent class="cw-full flex flex-col gap-2 p-2 pt-4">
{#each PLATFORM_RELAYS as url (url)}
<MenuSpacesItem {url} />
{:else}
{#each $userSpaceUrls as url (url)}
<MenuSpacesItem {url} />
{:else}
<div class="flex flex-col gap-8 items-center py-20">
<p>You haven't added any spaces yet!</p>
<Button class="btn btn-primary" onclick={addSpace}>
<Icon icon={AddCircle} />
Add a Space
</Button>
</div>
{/each}
{/each}
</PageContent>
</Page>