style: enhance visual hierarchy of Profile page components
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import { Form, Input, Button, Card, message, Avatar, Descriptions, Space, Modal, Row, Col } from 'antd';
|
||||
import { UserOutlined, LockOutlined, SafetyOutlined } from '@ant-design/icons';
|
||||
import { UserOutlined, LockOutlined, SafetyOutlined, KeyOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
|
||||
import { authApi } from '@/services/api';
|
||||
import type { User } from '@/types';
|
||||
|
||||
@@ -151,13 +151,45 @@ function ProfilePage() {
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
|
||||
<Space>
|
||||
<SafetyOutlined />
|
||||
<span>双因素验证</span>
|
||||
<span>双因素验证(TOTP)</span>
|
||||
</Space>
|
||||
<Button type="default">
|
||||
启用
|
||||
</Button>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Card
|
||||
size="small"
|
||||
bordered={false}
|
||||
style={{ marginTop: '16px', backgroundColor: '#fafafa' }}
|
||||
>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
|
||||
<Space>
|
||||
<KeyOutlined />
|
||||
<span>通行密钥(Passkey)</span>
|
||||
</Space>
|
||||
<Button type="default">
|
||||
启用
|
||||
</Button>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Card
|
||||
size="small"
|
||||
bordered={false}
|
||||
style={{ marginTop: '16px', backgroundColor: '#fafafa' }}
|
||||
>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
|
||||
<Space>
|
||||
<ExclamationCircleOutlined />
|
||||
<span>注销账户</span>
|
||||
</Space>
|
||||
<Button danger>
|
||||
注销账户
|
||||
</Button>
|
||||
</div>
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
</Card>
|
||||
|
||||
Reference in New Issue
Block a user