0
0
Fork 0

デザイン調整

This commit is contained in:
Xeltica 2022-01-27 17:47:01 +09:00
parent ae17ec5777
commit 11f185bf72
3 changed files with 27 additions and 36 deletions

View file

@ -30,39 +30,33 @@ export const AccountsPage: React.VFC = () => {
<Skeleton /> <Skeleton />
</div> </div>
) : ( ) : (
<div className="fade vstack"> <article className="fade">
<article> <h1 className="text-125 text-bold">{data.username}<span className="text-dimmed">@{data.host}</span></h1>
<p> <div>
<b>{t('_accounts.currentAccount')}:</b> @{data.username}@{data.host} <strong>{t('_accounts.switchAccount')}</strong>
</p> </div>
</article> <div className="menu large fluid mb-2">
<article className="card"> {
<div className="body"> accounts.length === accountTokens.length ? (
<h1>{t('_accounts.switchAccount')}</h1> accounts.map(account => (
<div className="menu large fluid mb-2"> <button className="item fluid" style={{display: 'flex', flexDirection: 'row', alignItems: 'center'}} onClick={() => switchAccount(account.misshaiToken)}>
{ <i className="icon bi bi-chevron-right" />
accounts.length === accountTokens.length ? (
accounts.map(account => (
<button className="item fluid" style={{display: 'flex', flexDirection: 'row', alignItems: 'center'}} onClick={() => switchAccount(account.misshaiToken)}>
<i className="icon bi bi-chevron-right" />
@{account.username}@{account.host} @{account.username}@{account.host}
<button className="btn flat text-danger" style={{marginLeft: 'auto'}} onClick={e => { <button className="btn flat text-danger" style={{marginLeft: 'auto'}} onClick={e => {
const filteredAccounts = accounts.filter(ac => ac.id !== account.id); const filteredAccounts = accounts.filter(ac => ac.id !== account.id);
dispatch(setAccounts(filteredAccounts)); dispatch(setAccounts(filteredAccounts));
e.stopPropagation(); e.stopPropagation();
}}> }}>
<i className="bi bi-trash"/> <i className="bi bi-trash"/>
</button> </button>
</button> </button>
)) ))
) : ( ) : (
<div className="item">...</div> <div className="item">...</div>
) )
} }
</div> </div>
<LoginForm /> <LoginForm />
</div> </article>
</article>
</div>
); );
}; };

View file

@ -4,7 +4,6 @@ import { Link } from 'react-router-dom';
import { IAnnouncement } from '../../common/types/announcement'; import { IAnnouncement } from '../../common/types/announcement';
import { $get } from '../misc/api'; import { $get } from '../misc/api';
import { Card } from './Card';
export const AnnouncementList: React.VFC = () => { export const AnnouncementList: React.VFC = () => {
const [announcements, setAnnouncements] = useState<IAnnouncement[]>([]); const [announcements, setAnnouncements] = useState<IAnnouncement[]>([]);

View file

@ -95,6 +95,4 @@ small {
} }
.login-form { .login-form {
background: var(--panel);
border-radius: var(--radius);
} }