diff --git a/packages/client/src/components/global/spacer.vue b/packages/client/src/components/global/spacer.vue index 417282ad12ef9bfb9c640f936fb22fb2c0dcbf3b..45481a2c8db7519ad7d8bb06731298746576d1ef 100644 --- a/packages/client/src/components/global/spacer.vue +++ b/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 { diff --git a/packages/client/src/components/poll-editor.vue b/packages/client/src/components/poll-editor.vue index c2f760acbd33b7028d2c15721cbf229db597a956..70ffb35d42b15f20b040b1e72c93f59ad65aa34c 100644 --- a/packages/client/src/components/poll-editor.vue +++ b/packages/client/src/components/poll-editor.vue @@ -206,8 +206,6 @@ export default defineComponent({ > .input { flex: 1; - margin-top: 16px; - margin-bottom: 0; } > button { diff --git a/packages/client/src/pages/timeline.vue b/packages/client/src/pages/timeline.vue index b0a02d17a19f741e1222a71aa5dae8f7480eeace..494932c602284bc1de3f2e15cf19a1c99e775321 100644 --- a/packages/client/src/pages/timeline.vue +++ b/packages/client/src/pages/timeline.vue @@ -1,20 +1,22 @@ <template> -<div v-size="{ min: [800] }" 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/> - - <div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div> - <div class="tl _block"> - <XTimeline ref="tl" :key="src" - class="tl" - :src="src" - :sound="true" - @before="before()" - @after="after()" - @queue="queueUpdated" - /> +<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/> + + <div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div> + <div class="tl _block"> + <XTimeline ref="tl" :key="src" + class="tl" + :src="src" + :sound="true" + @before="before()" + @after="after()" + @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> diff --git a/packages/client/src/ui/classic.vue b/packages/client/src/ui/classic.vue index fe533662d00c5b719744e71dcad16fac67d56b65..684a075c04590fb22753ac01be19754123d90bff 100644 --- a/packages/client/src/ui/classic.vue +++ b/packages/client/src/ui/classic.vue @@ -86,6 +86,7 @@ export default defineComponent({ provide() { return { shouldHeaderThin: this.showMenuOnTop, + shouldSpacerMin: true, }; }, diff --git a/packages/client/src/ui/deck.vue b/packages/client/src/ui/deck.vue index 329716664e047818c5445cd71e40fca9147ab320..4f1efb0a4c44b1284d3c616f01cff5b914eedafb 100644 --- a/packages/client/src/ui/deck.vue +++ b/packages/client/src/ui/deck.vue @@ -49,11 +49,14 @@ export default defineComponent({ }, provide() { - return deckStore.state.navWindow ? { - navHook: (url) => { - os.pageWindow(url); - } - } : {}; + return { + shouldSpacerMin: true, + ...deckStore.state.navWindow ? { + navHook: (url) => { + os.pageWindow(url); + } + } : {} + }; }, data() {