Tweak UI

src/client/components/abuse-report-window.vue

@@ -9,18 +9,14 @@
 		</I18n>
 	</template>
 	<div class="dpvffvvy">
-		<div class="_section">
-			<div class="_content">
-				<MkTextarea v-model:value="comment">
-					<span>{{ $ts.details }}</span>
-					<template #desc>{{ $ts.fillAbuseReportDescription }}</template>
-				</MkTextarea>
-			</div>
+		<div class="_root">
+			<MkTextarea v-model:value="comment">
+				<span>{{ $ts.details }}</span>
+				<template #desc>{{ $ts.fillAbuseReportDescription }}</template>
+			</MkTextarea>
 		</div>
-		<div class="_section">
-			<div class="_content">
-				<MkButton @click="send" primary full :disabled="comment.length === 0">{{ $ts.send }}</MkButton>
-			</div>
+		<div class="_root">
+			<MkButton @click="send" primary full :disabled="comment.length === 0">{{ $ts.send }}</MkButton>
 		</div>
 	</div>
 </XWindow>

src/client/components/drive.vue

@@ -11,7 +11,7 @@
 			<span class="folder current" v-if="folder != null">{{ folder.name }}</span>
 		</div>
 	</nav>
-	<div class="main _section" :class="{ uploading: uploadings.length > 0, fetching }"
+	<div class="main" :class="{ uploading: uploadings.length > 0, fetching }"
 		ref="main"
 		@dragover.prevent.stop="onDragover"
 		@dragenter="onDragenter"

src/client/components/notification-setting-window.vue

@@ -9,13 +9,13 @@
 	@closed="$emit('closed')"
 >
 	<template #header>{{ $ts.notificationSetting }}</template>
-	<div v-if="showGlobalToggle" class="_section">
+	<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="_section">
+	<div v-if="!useGlobalSetting" class="_root">
 		<MkInfo>{{ $ts.notificationSettingDesc }}</MkInfo>
 		<MkButton inline @click="disableAll">{{ $ts.disableAll }}</MkButton>
 		<MkButton inline @click="enableAll">{{ $ts.enableAll }}</MkButton>

src/client/style.scss

@@ -336,11 +336,21 @@ hr {
 
 	._hr {
 		margin: var(--margin) calc(var(--root-margin, 32px) * -1);
+		border-top: solid 0.5px var(--divider);
 	}
 
 	@media (max-width: 500px) {
 		--root-margin: 10px;
 	}
+
+	& + ._root {
+		&:before {
+			content: "";
+			display: block;
+			margin: var(--root-margin) calc(var(--root-margin, 32px) * -1);
+			border-top: solid 0.5px var(--divider);
+		}
+	}
 }
 
 ._flat_ {

src/client/ui/_common_/header.vue

@@ -99,7 +99,14 @@ export default defineComponent({
 		},
 
 		menu(ev) {
-			const menu = this.info.menu ? this.info.menu() : [];
+			let menu = this.info.menu ? this.info.menu() : [];
+			if (!this.showActions && this.info.actions) {
+				menu = [...this.info.actions.map(x => ({
+					text: x.text,
+					icon: x.icon,
+					action: x.handler
+				})), menu.length > 0 ? null : undefined, ...menu];
+			}
 			if (this.info.share) {
 				if (menu.length > 0) menu.push(null);
 				menu.push({