From 11f185bf7257f065bc79641db27c5a8d833dbb2a Mon Sep 17 00:00:00 2001
From: Xeltica <xeltica@gmail.com>
Date: Thu, 27 Jan 2022 17:47:01 +0900
Subject: [PATCH] =?UTF-8?q?=E3=83=87=E3=82=B6=E3=82=A4=E3=83=B3=E8=AA=BF?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/components/AccountsPage.tsx     | 60 +++++++++-----------
 src/frontend/components/AnnouncementList.tsx |  1 -
 src/frontend/style.scss                      |  2 -
 3 files changed, 27 insertions(+), 36 deletions(-)

diff --git a/src/frontend/components/AccountsPage.tsx b/src/frontend/components/AccountsPage.tsx
index 1cc8aff..0314833 100644
--- a/src/frontend/components/AccountsPage.tsx
+++ b/src/frontend/components/AccountsPage.tsx
@@ -30,39 +30,33 @@ export const AccountsPage: React.VFC = () => {
 			<Skeleton />
 		</div>
 	) :  (
-		<div className="fade vstack">
-			<article>
-				<p>
-					<b>{t('_accounts.currentAccount')}:</b> @{data.username}@{data.host}
-				</p>
-			</article>
-			<article className="card">
-				<div className="body">
-					<h1>{t('_accounts.switchAccount')}</h1>
-					<div className="menu large fluid mb-2">
-						{
-							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" />
+		<article className="fade">
+			<h1 className="text-125 text-bold">{data.username}<span className="text-dimmed">@{data.host}</span></h1>
+			<div>
+				<strong>{t('_accounts.switchAccount')}</strong>
+			</div>
+			<div className="menu large fluid mb-2">
+				{
+					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}
-										<button className="btn flat text-danger" style={{marginLeft: 'auto'}} onClick={e => {
-											const filteredAccounts = accounts.filter(ac => ac.id !== account.id);
-											dispatch(setAccounts(filteredAccounts));
-											e.stopPropagation();
-										}}>
-											<i className="bi bi-trash"/>
-										</button>
-									</button>
-								))
-							) : (
-								<div className="item">...</div>
-							)
-						}
-					</div>
-					<LoginForm />
-				</div>
-			</article>
-		</div>
+								<button className="btn flat text-danger" style={{marginLeft: 'auto'}} onClick={e => {
+									const filteredAccounts = accounts.filter(ac => ac.id !== account.id);
+									dispatch(setAccounts(filteredAccounts));
+									e.stopPropagation();
+								}}>
+									<i className="bi bi-trash"/>
+								</button>
+							</button>
+						))
+					) : (
+						<div className="item">...</div>
+					)
+				}
+			</div>
+			<LoginForm />
+		</article>
 	);
 };
diff --git a/src/frontend/components/AnnouncementList.tsx b/src/frontend/components/AnnouncementList.tsx
index ced2f24..6d8909f 100644
--- a/src/frontend/components/AnnouncementList.tsx
+++ b/src/frontend/components/AnnouncementList.tsx
@@ -4,7 +4,6 @@ import { Link } from 'react-router-dom';
 
 import { IAnnouncement } from '../../common/types/announcement';
 import { $get } from '../misc/api';
-import { Card } from './Card';
 
 export const AnnouncementList: React.VFC = () => {
 	const [announcements, setAnnouncements] = useState<IAnnouncement[]>([]);
diff --git a/src/frontend/style.scss b/src/frontend/style.scss
index 11c0ddb..46feafc 100644
--- a/src/frontend/style.scss
+++ b/src/frontend/style.scss
@@ -95,6 +95,4 @@ small {
 }
 
 .login-form {
-    background: var(--panel);
-    border-radius: var(--radius);
 }