client: tweak ui

packages/client/src/components/global/spacer.vue

@@ -7,7 +7,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, onMounted, onUnmounted, ref } from 'vue';
+import { defineComponent, inject, onMounted, onUnmounted, ref } from 'vue';
 
 export default defineComponent({
 	props: {
@@ -33,7 +33,13 @@ export default defineComponent({
 		const root = ref<HTMLElement>();
 		const content = ref<HTMLElement>();
 		const margin = ref(0);
+		const shouldSpacerMin = inject('shouldSpacerMin', false);
 		const adjust = (rect: { width: number; height: number; }) => {
+			if (shouldSpacerMin) {
+				margin.value = props.marginMin;
+				return;
+			}
+
 			if (rect.width > props.contentMax || rect.width > 500) {
 				margin.value = props.marginMax;
 			} else {

packages/client/src/components/poll-editor.vue

@@ -206,8 +206,6 @@ export default defineComponent({
 
 			> .input {
 				flex: 1;
-				margin-top: 16px;
-				margin-bottom: 0;
 			}
 
 			> button {

packages/client/src/pages/timeline.vue

@@ -1,5 +1,6 @@
 <template>
-<div v-size="{ min: [800] }" v-hotkey.global="keymap" class="cmuxhskf">
+<MkSpacer :content-max="800">
+	<div v-hotkey.global="keymap" class="cmuxhskf">
 		<XTutorial v-if="$store.reactiveState.tutorial.value != -1" class="tutorial _block"/>
 		<XPostForm v-if="$store.reactiveState.showFixedPostForm.value" class="post-form _block" fixed/>
 
@@ -14,7 +15,8 @@
 				@queue="queueUpdated"
 			/>
 		</div>
-</div>
+	</div>
+</MkSpacer>
 </template>
 
 <script lang="ts">
@@ -188,8 +190,6 @@ export default defineComponent({
 
 <style lang="scss" scoped>
 .cmuxhskf {
-	padding: var(--margin);
-
 	> .new {
 		position: sticky;
 		top: calc(var(--stickyTop, 0px) + 16px);
@@ -213,10 +213,5 @@ export default defineComponent({
 		border-radius: var(--radius);
 		overflow: clip;
 	}
-
-	&.min-width_800px {
-		max-width: 800px;
-		margin: 0 auto;
-	}
 }
 </style>

packages/client/src/ui/classic.vue

@@ -86,6 +86,7 @@ export default defineComponent({
 	provide() {
 		return {
 			shouldHeaderThin: this.showMenuOnTop,
+			shouldSpacerMin: true,
 		};
 	},
 

packages/client/src/ui/deck.vue

@@ -49,11 +49,14 @@ export default defineComponent({
 	},
 
 	provide() {
-		return deckStore.state.navWindow ? {
+		return {
+			shouldSpacerMin: true,
+			...deckStore.state.navWindow ? {
 				navHook: (url) => {
 					os.pageWindow(url);
 				}
-		} : {};
+			} : {}
+		};
 	},
 
 	data() {