diff options
Diffstat (limited to 'frontend/src/pages/AccountPage.svelte')
| -rw-r--r-- | frontend/src/pages/AccountPage.svelte | 24 |
1 files changed, 12 insertions, 12 deletions
diff --git a/frontend/src/pages/AccountPage.svelte b/frontend/src/pages/AccountPage.svelte index 9e90e78..c85dc53 100644 --- a/frontend/src/pages/AccountPage.svelte +++ b/frontend/src/pages/AccountPage.svelte @@ -104,11 +104,11 @@ </script> <Page title="账户与安全" subtitle="资料、密码与个人会话管理"> - <div class="stack"> - <Card.Root size="sm" > + <div class="flex flex-col gap-3"> + <Card.Root size="sm"> <Card.Header><Card.Title>个人信息</Card.Title></Card.Header> - <form onsubmit={saveProfile} class="row"> - <div style="flex:1 1 200px"> + <form onsubmit={saveProfile} class="flex flex-wrap items-center gap-3"> + <div class="flex-[1_1_200px]"> <Label for="acc-name">姓名</Label> <Input id="acc-name" bind:value={nameInput} autocomplete="name" /> </div> @@ -127,10 +127,10 @@ <Status busy={false} error={profileErr} empty={profileOk} /> </Card.Root> - <Card.Root size="sm" > + <Card.Root size="sm"> <Card.Header><Card.Title>修改密码</Card.Title></Card.Header> - <form onsubmit={changePassword} class="stack"> - <div class="grid3 wrap-3"> + <form onsubmit={changePassword} class="flex flex-col gap-3"> + <div class="grid grid-cols-1 sm:grid-cols-3 gap-3"> <div> <Label for="pw-cur">当前密码</Label> <Input id="pw-cur" type="password" bind:value={curPw} required autocomplete="current-password" /> @@ -144,7 +144,7 @@ <Input id="pw-new2" type="password" bind:value={newPw2} required autocomplete="new-password" minlength={8} /> </div> </div> - <div class="row"> + <div> <Button type="submit" disabled={pwBusy}> {pwBusy ? '更新中…' : '更新密码'} </Button> @@ -153,7 +153,7 @@ </form> </Card.Root> - <Card.Root size="sm" > + <Card.Root size="sm"> <Card.Header><Card.Title>登录会话</Card.Title></Card.Header> <Status busy={sessBusy} error={sessErr} busyText="载入会话…" empty={null} /> {#if !sessBusy && !sessErr && sessions.length === 0} @@ -174,9 +174,9 @@ <Table.Row> <Table.Cell>{fmtDateTime(s.created_at)}</Table.Cell> <Table.Cell>{fmtDateTime(s.last_seen_at)}</Table.Cell> - <Table.Cell class="hint">{s.user_agent?.slice(0, 60) ?? '—'}</Table.Cell> + <Table.Cell class="text-sm text-muted-foreground">{s.user_agent?.slice(0, 60) ?? '—'}</Table.Cell> <Table.Cell> - <div class="row"> + <div class="flex items-center gap-2 flex-wrap"> {#if s.current}<Badge variant="secondary">当前会话</Badge>{/if} <Button variant="outline" size="sm" class="text-destructive" disabled={s.current && sessions.length === 1} onclick={() => void revoke(s)}> {s.current ? '注销当前' : '撤销'} @@ -189,7 +189,7 @@ </Table.Root> {/if} <Status busy={false} error={null} empty={sessMsg} /> - <p class="hint">更改密码或被管理员停用时，其他会话将自动失效。</p> + <p class="text-sm text-muted-foreground">更改密码或被管理员停用时，其他会话将自动失效。</p> </Card.Root> </div> </Page>
\ No newline at end of file |