fix(frontend): polish dashboard layout

Keep dashboard header actions pinned to the action column, widen the xAI runtime field, and align active-account usage metrics without changing the shared usage window component.

Co-authored-by: Codex <noreply@openai.com>
This commit is contained in:
Zyy
2026-07-27 14:55:36 +08:00
co-authored by Codex
parent c856e4306f
commit 87496b5656
3 changed files with 4 additions and 5 deletions
@@ -6,7 +6,7 @@ defineProps<{
</script>
<template>
<header class="flex min-h-17 shrink-0 flex-wrap items-start justify-between gap-4">
<header class="grid min-h-17 shrink-0 grid-cols-[minmax(0,1fr)_auto] items-start gap-x-4 gap-y-3">
<div class="min-w-0">
<h1 class="m-0 text-[34px] leading-[1.15] font-extrabold text-(--cp-text-primary)">
{{ title }}
@@ -22,7 +22,7 @@ defineProps<{
</div>
<div
v-if="$slots.actions"
class="mt-0.5 flex shrink-0 items-center gap-2 max-sm:w-full max-sm:justify-end"
class="mt-0.5 flex shrink-0 items-center justify-end gap-2"
>
<slot name="actions" />
</div>
@@ -249,7 +249,7 @@ const statusBars = computed(() => {
</AccountIdentityCell>
<span
class="grid min-w-0 grid-cols-[minmax(0,0.82fr)_minmax(0,0.64fr)_minmax(104px,1fr)] items-end gap-3 xl:contents"
class="grid min-w-0 grid-cols-[minmax(0,0.82fr)_minmax(0,0.64fr)_minmax(104px,1fr)] items-start gap-3 xl:contents"
>
<span class="grid min-w-0 gap-1">
<span class="text-[11px] leading-none font-bold text-(--cp-text-muted)">
@@ -273,7 +273,6 @@ const statusBars = computed(() => {
:window="account.usageWindow"
:show-local-value="false"
variant="compact"
class="xl:h-7.25"
/>
</span>
</article>
@@ -241,7 +241,7 @@ function providerLabel(provider: string) {
<dl
class="m-0 grid min-w-0 gap-5 sm:gap-7"
:class="profile.provider === 'xai'
? 'sm:grid-cols-[0.72fr_0.9fr_1.18fr]'
? 'sm:grid-cols-[0.62fr_1.28fr_0.94fr]'
: 'sm:grid-cols-[0.72fr_1.28fr]'"
>
<div v-if="profile.provider === 'xai'" class="min-w-0">