Tweak UI

8 files changed, 30 insertions, 22 deletions

diff --git a/src/client/components/abuse-report-window.vue b/src/client/components/abuse-report-window.vue
index e92bd69eff..df5b594c0b 100644
--- a/src/client/components/abuse-report-window.vue
+++ b/src/client/components/abuse-report-window.vue
@@ -8,14 +8,14 @@
 			</template>
 		</I18n>
 	</template>
-	<div class="dpvffvvy">
-		<div class="_root">
+	<div class="dpvffvvy _monolithic_">
+		<div class="_section">
 			<MkTextarea v-model:value="comment">
 				<span>{{ $ts.details }}</span>
 				<template #desc>{{ $ts.fillAbuseReportDescription }}</template>
 			</MkTextarea>
 		</div>
-		<div class="_root">
+		<div class="_section">
 			<MkButton @click="send" primary full :disabled="comment.length === 0">{{ $ts.send }}</MkButton>
 		</div>
 	</div>
diff --git a/src/client/components/notes.vue b/src/client/components/notes.vue
index 33fb57c8cf..aedf11bc40 100644
--- a/src/client/components/notes.vue
+++ b/src/client/components/notes.vue
@@ -15,7 +15,7 @@
 	</div>
 
 	<XList ref="notes" :items="notes" v-slot="{ item: note }" :direction="reversed ? 'up' : 'down'" :reversed="reversed">
-		<XNote :note="note" class="_block _gap" @update:note="updated(note, $event)" :key="note._featuredId_ || note._prId_ || note.id"/>
+		<XNote :note="note" class="_block" @update:note="updated(note, $event)" :key="note._featuredId_ || note._prId_ || note.id"/>
 	</XList>
 
 	<div v-show="more && !reversed" style="margin-top: var(--margin);">
diff --git a/src/client/components/notification-setting-window.vue b/src/client/components/notification-setting-window.vue
index 3d17497971..5f16c042bf 100644
--- a/src/client/components/notification-setting-window.vue
+++ b/src/client/components/notification-setting-window.vue
@@ -9,17 +9,19 @@
 	@closed="$emit('closed')"
 >
 	<template #header>{{ $ts.notificationSetting }}</template>
-	<div v-if="showGlobalToggle" class="_root">
-		<MkSwitch v-model:value="useGlobalSetting">
-			{{ $ts.useGlobalSetting }}
-			<template #desc>{{ $ts.useGlobalSettingDesc }}</template>
-		</MkSwitch>
-	</div>
-	<div v-if="!useGlobalSetting" class="_root">
-		<MkInfo>{{ $ts.notificationSettingDesc }}</MkInfo>
-		<MkButton inline @click="disableAll">{{ $ts.disableAll }}</MkButton>
-		<MkButton inline @click="enableAll">{{ $ts.enableAll }}</MkButton>
-		<MkSwitch v-for="type in notificationTypes" :key="type" v-model:value="typesMap[type]">{{ $t(`_notification._types.${type}`) }}</MkSwitch>
+	<div class="_monolithic_">
+		<div v-if="showGlobalToggle" class="_section">
+			<MkSwitch v-model:value="useGlobalSetting">
+				{{ $ts.useGlobalSetting }}
+				<template #desc>{{ $ts.useGlobalSettingDesc }}</template>
+			</MkSwitch>
+		</div>
+		<div v-if="!useGlobalSetting" class="_section">
+			<MkInfo>{{ $ts.notificationSettingDesc }}</MkInfo>
+			<MkButton inline @click="disableAll">{{ $ts.disableAll }}</MkButton>
+			<MkButton inline @click="enableAll">{{ $ts.enableAll }}</MkButton>
+			<MkSwitch v-for="type in notificationTypes" :key="type" v-model:value="typesMap[type]">{{ $t(`_notification._types.${type}`) }}</MkSwitch>
+		</div>
 	</div>
 </XModalWindow>
 </template>
diff --git a/src/client/components/remote-caution.vue b/src/client/components/remote-caution.vue
index 98c7aaaa6e..c9c5ceea4c 100644
--- a/src/client/components/remote-caution.vue
+++ b/src/client/components/remote-caution.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="jmgmzlwq _panel"><Fa :icon="faExclamationTriangle" style="margin-right: 8px;"/>{{ $ts.remoteUserCaution }}<a :href="href" rel="nofollow noopener" target="_blank">{{ $ts.showOnRemote }}</a></div>
+<div class="jmgmzlwq _block"><Fa :icon="faExclamationTriangle" style="margin-right: 8px;"/>{{ $ts.remoteUserCaution }}<a :href="href" rel="nofollow noopener" target="_blank">{{ $ts.showOnRemote }}</a></div>
 </template>
 
 <script lang="ts">
diff --git a/src/client/components/signin.vue b/src/client/components/signin.vue
index 4497c00a50..1cd79bac1d 100755
--- a/src/client/components/signin.vue
+++ b/src/client/components/signin.vue
@@ -1,6 +1,6 @@
 <template>
-<form class="eppvobhk" :class="{ signing, totpLogin }" @submit.prevent="onSubmit">
-	<div class="auth _root">
+<form class="eppvobhk _monolithic_" :class="{ signing, totpLogin }" @submit.prevent="onSubmit">
+	<div class="auth _section">
 		<div class="avatar" :style="{ backgroundImage: user ? `url('${ user.avatarUrl }')` : null }" v-show="withAvatar"></div>
 		<div class="normal-signin" v-if="!totpLogin">
 			<MkInput v-model:value="username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required @update:value="onUsernameChange">
@@ -38,7 +38,7 @@
 			</div>
 		</div>
 	</div>
-	<div class="social _root">
+	<div class="social _section">
 		<a class="_borderButton _gap" v-if="meta && meta.enableTwitterIntegration" :href="`${apiUrl}/signin/twitter`"><Fa :icon="faTwitter" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'Twitter' }) }}</a>
 		<a class="_borderButton _gap" v-if="meta && meta.enableGithubIntegration" :href="`${apiUrl}/signin/github`"><Fa :icon="faGithub" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'GitHub' }) }}</a>
 		<a class="_borderButton _gap" v-if="meta && meta.enableDiscordIntegration" :href="`${apiUrl}/signin/discord`"><Fa :icon="faDiscord" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'Discord' }) }}</a>
diff --git a/src/client/components/signup-dialog.vue b/src/client/components/signup-dialog.vue
index 5015b77c75..df1a525055 100644
--- a/src/client/components/signup-dialog.vue
+++ b/src/client/components/signup-dialog.vue
@@ -7,8 +7,10 @@
 >
 	<template #header>{{ $ts.signup }}</template>
 
-	<div class="_root">
-		<XSignup :auto-set="autoSet" @signup="onSignup"/>
+	<div class="_monolithic_">
+		<div class="_section">
+			<XSignup :auto-set="autoSet" @signup="onSignup"/>
+		</div>
 	</div>
 </XModalWindow>
 </template>
diff --git a/src/client/components/ui/container.vue b/src/client/components/ui/container.vue
index 19bb23f595..427421af7d 100644
--- a/src/client/components/ui/container.vue
+++ b/src/client/components/ui/container.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="ukygtjoj _block _gap" :class="{ naked, hideHeader: !showHeader, scrollable, closed: !showBody }" v-size="{ max: [380] }">
+<div class="ukygtjoj _block" :class="{ naked, hideHeader: !showHeader, scrollable, closed: !showBody }" v-size="{ max: [380] }">
 	<header v-if="showHeader" ref="header">
 		<div class="title"><slot name="header"></slot></div>
 		<div class="sub">
diff --git a/src/client/components/ui/info.vue b/src/client/components/ui/info.vue
index 12b3dbcfd1..ad1b9ebb58 100644
--- a/src/client/components/ui/info.vue
+++ b/src/client/components/ui/info.vue
@@ -53,4 +53,8 @@ export default defineComponent({
 		margin-right: 4px;
 	}
 }
+
+._flat_ .fpezltsf {
+	border-radius: 0;
+}
 </style>