:art:

2 files changed, 41 insertions, 16 deletions

diff --git a/src/client/pages/notifications.vue b/src/client/pages/notifications.vue
index 6b16b85b78..633718a90b 100644
--- a/src/client/pages/notifications.vue
+++ b/src/client/pages/notifications.vue
@@ -1,6 +1,6 @@
 <template>
-<div class="">
-	<XNotifications class="_content" @before="before" @after="after" page/>
+<div class="clupoqwt" v-size="{ min: [800] }">
+	<XNotifications class="notifications" @before="before" @after="after" page/>
 </div>
 </template>
 
@@ -43,3 +43,17 @@ export default defineComponent({
 	}
 });
 </script>
+
+<style lang="scss" scoped>
+.clupoqwt {
+	&.min-width_800px {
+		background: var(--bg);
+		padding: 32px 0;
+
+		> .notifications {
+			max-width: 800px;
+			margin: 0 auto;
+		}
+	}
+}
+</style>
diff --git a/src/client/pages/timeline.vue b/src/client/pages/timeline.vue
index 119815e2ae..f54549b982 100644
--- a/src/client/pages/timeline.vue
+++ b/src/client/pages/timeline.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="cmuxhskf" v-hotkey.global="keymap">
+<div class="cmuxhskf" v-hotkey.global="keymap" v-size="{ min: [800] }">
 	<XTutorial v-if="$store.reactiveState.tutorial.value != -1" class="tutorial _block _isolated"/>
 	<XPostForm v-if="$store.reactiveState.showFixedPostForm.value" class="post-form _block _isolated" fixed/>
 	<div class="tabs">
@@ -19,17 +19,19 @@
 		</div>
 	</div>
 	<div class="new" v-if="queue > 0"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div>
-	<XTimeline ref="tl" class="tl"
-		:key="src === 'list' ? `list:${list.id}` : src === 'antenna' ? `antenna:${antenna.id}` : src === 'channel' ? `channel:${channel.id}` : src"
-		:src="src"
-		:list="list ? list.id : null"
-		:antenna="antenna ? antenna.id : null"
-		:channel="channel ? channel.id : null"
-		:sound="true"
-		@before="before()"
-		@after="after()"
-		@queue="queueUpdated"
-	/>
+	<div class="tl">
+		<XTimeline ref="tl" class="tl"
+			:key="src === 'list' ? `list:${list.id}` : src === 'antenna' ? `antenna:${antenna.id}` : src === 'channel' ? `channel:${channel.id}` : src"
+			:src="src"
+			:list="list ? list.id : null"
+			:antenna="antenna ? antenna.id : null"
+			:channel="channel ? channel.id : null"
+			:sound="true"
+			@before="before()"
+			@after="after()"
+			@queue="queueUpdated"
+		/>
+	</div>
 </div>
 </template>
 
@@ -231,6 +233,7 @@ export default defineComponent({
 		padding: 0 8px;
 		white-space: nowrap;
 		overflow: auto;
+		border-bottom: solid 0.5px var(--divider);
 
 		// 影の都合上
 		position: relative;
@@ -287,8 +290,16 @@ export default defineComponent({
 		}
 	}
 
-	> .tl {
-		border-top: solid 0.5px var(--divider);
+	&.min-width_800px {
+		> .tl {
+			background: var(--bg);
+			padding: 32px 0;
+
+			> .tl {
+				max-width: 800px;
+				margin: 0 auto;
+			}
+		}
 	}
 }
 </style>