wip

src/client/pages/instance/ads.vue

@@ -1,6 +1,7 @@
 <template>
-<div class="uqshojas">
-	<MkButton @click="add()" primary style="margin: 0 auto 16px auto;"><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton>
+<div>
+	<MkHeader :info="header"/>
+	<div class="uqshojas">
 		<section class="_card _gap ads" v-for="ad in ads">
 			<div class="_content ad">
 				<MkAd v-if="ad.url" :specify="ad"/>
@@ -38,6 +39,7 @@
 				</div>
 			</div>
 		</section>
+	</div>
 </div>
 </template>
 
@@ -67,6 +69,17 @@ export default defineComponent({
 				icon: 'fas fa-audio-description',
 				bg: 'var(--bg)',
 			},
+			header: {
+				title: this.$ts.ads,
+				icon: 'fas fa-audio-description',
+				bg: 'var(--bg)',
+				actions: [{
+					asFullButton: true,
+					icon: 'fas fa-plus',
+					text: this.$ts.add,
+					handler: this.add,
+				}],
+			},
 			ads: [],
 		}
 	},

src/client/pages/instance/announcements.vue

@@ -1,6 +1,8 @@
 <template>
-<div class="ztgjmzrw">
-	<MkButton @click="add()" primary style="margin: 0 auto 16px auto;"><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton>
+<div>
+	<MkHeader :info="header"/>
+
+	<div class="ztgjmzrw">
 		<section class="_card _gap announcements" v-for="announcement in announcements">
 			<div class="_content announcement">
 				<MkInput v-model="announcement.title">
@@ -19,6 +21,7 @@
 				</div>
 			</div>
 		</section>
+	</div>
 </div>
 </template>
 
@@ -46,6 +49,17 @@ export default defineComponent({
 				icon: 'fas fa-broadcast-tower',
 				bg: 'var(--bg)',
 			},
+			header: {
+				title: this.$ts.announcements,
+				icon: 'fas fa-broadcast-tower',
+				bg: 'var(--bg)',
+				actions: [{
+					asFullButton: true,
+					icon: 'fas fa-plus',
+					text: this.$ts.add,
+					handler: this.add,
+				}],
+			},
 			announcements: [],
 		}
 	},

src/client/pages/instance/index.vue

@@ -235,7 +235,6 @@ export default defineComponent({
 		> .main {
 			flex: 1;
 			min-width: 0;
-			overflow: auto;
 			--baseContentWidth: 100%;
 		}
 	}