Change background color

This commit is contained in:
dtonon 2026-05-08 21:33:10 +01:00
parent 32104ea05d
commit a96af086ba
13 changed files with 153 additions and 139 deletions

View file

@ -20,29 +20,29 @@
<div>
<a
href="/"
class="flex items-center gap-2 py-1 hover:bg-gray-100 text-gray-700}"
class="flex items-center gap-2 py-1 hover:bg-neutral-100 text-neutral-700}"
>
Home
</a>
{#if mode === "simple"}
<div class="flex mt-6">
<p class="text-sm text-gray-500">{groupStore.data?.about ?? ""}</p>
<p class="text-sm text-neutral-500">{groupStore.data?.about ?? ""}</p>
</div>
{:else}
<nav class="flex-auto mt-6">
{#each groups as group}
<div class="mb-8">
<p
class="pb-1 text-xs font-semibold uppercase tracking-wider text-gray-400"
class="pb-1 text-xs font-semibold uppercase tracking-wider text-neutral-400"
>
{group}
</p>
{#each rooms.filter((r) => r.group === group) as room}
<a
href="/room/{room.slug}"
class="flex items-center gap-2 py-1 hover:bg-gray-100
{activeRoom === room.slug ? ' text-brand' : 'text-gray-700'}"
class="flex items-center gap-2 py-1 hover:bg-neutral-100
{activeRoom === room.slug ? ' text-brand' : 'text-neutral-700'}"
>
{room.name}
</a>
@ -55,61 +55,63 @@
<nav class="flex-auto mt-6">
<div class="">
<p
class="pb-1 text-xs font-semibold uppercase tracking-wider text-gray-400"
class="pb-1 text-xs font-semibold uppercase tracking-wider text-neutral-400"
>
More
</p>
<a href="/settings" class="block py-1 text-gray-500 hover:text-gray-900"
>Settings</a
<a
href="/settings"
class="block py-1 text-neutral-500 hover:text-neutral-900">Settings</a
>
<a href="/contacts" class="block py-1 text-gray-500 hover:text-gray-900"
>Contacts</a
<a
href="/contacts"
class="block py-1 text-neutral-500 hover:text-neutral-900">Contacts</a
>
</div>
</nav>
</div>
<div class="flex flex-col gap-2">
{#if draftState.iconized}
<button
type="button"
onclick={resumeDraft}
class="w-full rounded bg-brand px-3 py-1.5 text-sm font-medium text-white hover:bg-brand-hover"
>
Resume draft
</button>
{/if}
{#if auth.user}
<button
onclick={() => {
if (confirm("Log out?")) logout();
}}
class="mt-3 flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-sm text-gray-700 hover:bg-gray-200"
aria-label="Account options"
>
{#if auth.user.metadata.picture}
<img
src={auth.user.metadata.picture}
alt=""
class="h-7 w-7 rounded-full object-cover"
/>
{:else}
<span
class="flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-gray-300 text-xs font-semibold text-gray-600"
aria-hidden="true"
>
{auth.user.shortName.slice(0, 1).toUpperCase()}
</span>
{/if}
<span class="truncate font-medium">{auth.user.shortName}</span>
</button>
{:else}
<button
onclick={openLogin}
class="mt-3 w-full rounded bg-brand px-3 py-1.5 font-medium text-sm text-white hover:bg-brand-hover"
>
Login
</button>
{/if}
{#if draftState.iconized}
<button
type="button"
onclick={resumeDraft}
class="w-full rounded bg-brand px-3 py-1.5 text-sm font-medium text-white hover:bg-brand-hover"
>
Resume draft
</button>
{/if}
{#if auth.user}
<button
onclick={() => {
if (confirm("Log out?")) logout();
}}
class="mt-3 flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-sm text-neutral-700 hover:bg-neutral-200"
aria-label="Account options"
>
{#if auth.user.metadata.picture}
<img
src={auth.user.metadata.picture}
alt=""
class="h-7 w-7 rounded-full object-cover"
/>
{:else}
<span
class="flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-neutral-300 text-xs font-semibold text-neutral-600"
aria-hidden="true"
>
{auth.user.shortName.slice(0, 1).toUpperCase()}
</span>
{/if}
<span class="truncate font-medium">{auth.user.shortName}</span>
</button>
{:else}
<button
onclick={openLogin}
class="mt-3 w-full rounded bg-brand px-3 py-1.5 font-medium text-sm text-white hover:bg-brand-hover"
>
Login
</button>
{/if}
</div>
</aside>