tksadik92/wrenn-releases
1
0
Fork 0
forked from wrenn/wrenn
Code Pull Requests Activity

Normalize dashboard page headers: add divider line and align button layout

Browse Source 
Add consistent mt-6 border-b divider to Capsules, Metrics, and Templates
headers. Align Channels header to match Keys page pattern (items-center,
description inside the title group).
This commit is contained in:
Rafeed M. Bhuiyan
2026-04-13 04:59:40 +06:00
parent bbdb44afee
commit d828a6be08
4 changed files with 20 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/routes/dashboard/capsules/+layout.svelte
View File

@ -44,7 +44,7 @@
</div>
{:else}
<!-- Default list header -->
<div class="px-7 pt-8 pb-6">
<div class="px-7 pt-8">
<div class="flex items-center justify-between">
<div>
<h1 class="font-serif text-page tracking-[-0.02em] text-[var(--color-text-bright)]">
@ -70,6 +70,8 @@
</div>
</div>
</div>
<div class="mt-6 border-b border-[var(--color-border)]"></div>
</div>
{/if}

26
frontend/src/routes/dashboard/channels/+page.svelte
View File

@ -352,14 +352,19 @@
<main class="flex-1 overflow-y-auto bg-[var(--color-bg-0)]">
<!-- Header -->
<div class="px-7 pt-8">
<div class="flex items-start justify-between">
<div class="flex items-baseline gap-4">
<h1 class="font-serif text-page tracking-[-0.02em] text-[var(--color-text-bright)]">
Channels
</h1>
{#if !loading && channels.length > 0}
<span class="font-serif text-[1.75rem] tracking-[-0.03em] text-[var(--color-text-muted)]">{channels.length}</span>
{/if}
<div class="flex items-center justify-between">
<div>
<div class="flex items-baseline gap-4">
<h1 class="font-serif text-page tracking-[-0.02em] text-[var(--color-text-bright)]">
Channels
</h1>
{#if !loading && channels.length > 0}
<span class="font-serif text-[1.75rem] tracking-[-0.03em] text-[var(--color-text-muted)]">{channels.length}</span>
{/if}
</div>
<p class="mt-2 text-ui text-[var(--color-text-secondary)]">
Route capsule events to Discord, Slack, Telegram, and other destinations.
</p>
</div>
<button
@ -372,11 +377,8 @@
New Channel
</button>
</div>
<p class="mt-2 text-ui text-[var(--color-text-secondary)]">
Route capsule events to Discord, Slack, Telegram, and other destinations.
</p>
<div class="mt-5 border-b border-[var(--color-border)]"></div>
<div class="mt-6 border-b border-[var(--color-border)]"></div>
</div>
<!-- Content -->

2
frontend/src/routes/dashboard/metrics/+page.svelte
View File

@ -29,6 +29,8 @@
<p class="mt-2 text-ui text-[var(--color-text-secondary)]">
Resource usage and performance across all capsules.
</p>
<div class="mt-6 border-b border-[var(--color-border)]"></div>
</div>
<StatsPanel

2
frontend/src/routes/dashboard/templates/+page.svelte
View File

@ -175,7 +175,7 @@
</div>
<!-- Page-level tabs -->
<div class="mt-5 flex gap-0 border-b border-[var(--color-border)]">
<div class="mt-6 flex gap-0 border-b border-[var(--color-border)]">
<!-- Snapshots tab (active) -->
<button
onclick={() => (pageTab = 'snapshots')}