diff --git a/launcher/src/components/PlayerProfileModal.svelte b/launcher/src/components/PlayerProfileModal.svelte index e28803d..71eb624 100644 --- a/launcher/src/components/PlayerProfileModal.svelte +++ b/launcher/src/components/PlayerProfileModal.svelte @@ -30,6 +30,7 @@ let editBanner = $state(''); let editAccent = $state(''); let relationBusy = $state(false); + let confirmRemove = $state(false); const swatches = ['#8b6cff', '#22d3ee', '#34d399', '#fbbf24', '#fb7185', '#f472b6', '#60a5fa']; let savingProfile = $state(false); @@ -215,7 +216,13 @@
{#if profile.relationship === 'accepted'} - + {#if confirmRemove} + Remove {profile.username} from your friends? + + + {:else} + + {/if} {:else if profile.relationship === 'pending_incoming'} {profile.username} wants to be friends @@ -275,19 +282,19 @@
@@ -538,7 +545,7 @@ } .profile-modal { width: 100%; - max-width: 36rem; + max-width: 38rem; max-height: calc(100vh - 4rem); overflow-y: auto; background: var(--surface); @@ -661,21 +668,24 @@ font-size: 0.72rem; } .profile-tabs { - display: flex; + display: grid; + grid-template-columns: repeat(5, minmax(0, 1fr)); border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 90%, black); - padding: 0 1rem; - gap: 0.3rem; + padding: 0 0.5rem; + gap: 0.15rem; } .profile-tabs button { display: flex; align-items: center; - gap: 0.35rem; + justify-content: center; + min-width: 0; + gap: 0.3rem; background: transparent; border: none; border-bottom: 2px solid transparent; - padding: 0.65rem 0.9rem; - font-size: 0.82rem; + padding: 0.65rem 0.25rem; + font-size: 0.8rem; font-weight: 560; color: var(--muted); border-radius: 0; @@ -685,8 +695,10 @@ color: var(--text); border-bottom-color: var(--pa, var(--accent)); } - .profile-tabs { overflow-x: auto; } .profile-tabs button { white-space: nowrap; } + .profile-tabs button span { overflow: hidden; text-overflow: ellipsis; } + .profile-tabs button :global(svg) { flex-shrink: 0; } + @media (max-width: 34rem) { .profile-tabs button :global(svg) { display: none; } } .presence { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: color-mix(in srgb, var(--muted) 60%, transparent); } .presence.on { background: #34d399; box-shadow: 0 0 0 3px color-mix(in srgb, #34d399 25%, transparent); } .chips-row { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-top: 0.25rem; } diff --git a/launcher/src/pages/Commands.svelte b/launcher/src/pages/Commands.svelte index d663569..5878c1b 100644 --- a/launcher/src/pages/Commands.svelte +++ b/launcher/src/pages/Commands.svelte @@ -117,7 +117,7 @@