diff --git a/packages/frontend/src/components/MkAbuseReportWindow.vue b/packages/frontend/src/components/MkAbuseReportWindow.vue index e20cf1b735..6481c0d876 100644 --- a/packages/frontend/src/components/MkAbuseReportWindow.vue +++ b/packages/frontend/src/components/MkAbuseReportWindow.vue @@ -1,5 +1,5 @@ <template> -<XWindow ref="uiWindow" :initial-width="400" :initial-height="500" :can-resize="true" @closed="emit('closed')"> +<MkWindow ref="uiWindow" :initial-width="400" :initial-height="500" :can-resize="true" @closed="emit('closed')"> <template #header> <i class="ti ti-exclamation-circle" style="margin-right: 0.5em;"></i> <I18n :src="i18n.ts.reportAbuseOf" tag="span"> @@ -8,24 +8,26 @@ </template> </I18n> </template> - <div class="dpvffvvy _autoGap"> - <div class=""> - <MkTextarea v-model="comment"> - <template #label>{{ i18n.ts.details }}</template> - <template #caption>{{ i18n.ts.fillAbuseReportDescription }}</template> - </MkTextarea> + <MkSpacer :margin-min="20" :margin-max="28"> + <div class="dpvffvvy _autoGap"> + <div class=""> + <MkTextarea v-model="comment"> + <template #label>{{ i18n.ts.details }}</template> + <template #caption>{{ i18n.ts.fillAbuseReportDescription }}</template> + </MkTextarea> + </div> + <div class=""> + <MkButton primary full :disabled="comment.length === 0" @click="send">{{ i18n.ts.send }}</MkButton> + </div> </div> - <div class=""> - <MkButton primary full :disabled="comment.length === 0" @click="send">{{ i18n.ts.send }}</MkButton> - </div> - </div> -</XWindow> + </MkSpacer> +</MkWindow> </template> <script setup lang="ts"> import { ref, shallowRef } from 'vue'; import * as Misskey from 'misskey-js'; -import XWindow from '@/components/MkWindow.vue'; +import MkWindow from '@/components/MkWindow.vue'; import MkTextarea from '@/components/form/textarea.vue'; import MkButton from '@/components/MkButton.vue'; import * as os from '@/os'; @@ -40,7 +42,7 @@ const emit = defineEmits<{ (ev: 'closed'): void; }>(); -const uiWindow = shallowRef<InstanceType<typeof XWindow>>(); +const uiWindow = shallowRef<InstanceType<typeof MkWindow>>(); const comment = ref(props.initialComment || ''); function send() { diff --git a/packages/frontend/src/components/MkDriveWindow.vue b/packages/frontend/src/components/MkDriveWindow.vue index 617200321b..8b2abc15a3 100644 --- a/packages/frontend/src/components/MkDriveWindow.vue +++ b/packages/frontend/src/components/MkDriveWindow.vue @@ -1,5 +1,5 @@ <template> -<XWindow +<MkWindow ref="window" :initial-width="800" :initial-height="500" @@ -10,14 +10,14 @@ {{ i18n.ts.drive }} </template> <XDrive :initial-folder="initialFolder"/> -</XWindow> +</MkWindow> </template> <script lang="ts" setup> import { } from 'vue'; import * as Misskey from 'misskey-js'; import XDrive from '@/components/MkDrive.vue'; -import XWindow from '@/components/MkWindow.vue'; +import MkWindow from '@/components/MkWindow.vue'; import { i18n } from '@/i18n'; defineProps<{ diff --git a/packages/frontend/src/components/MkPageWindow.vue b/packages/frontend/src/components/MkPageWindow.vue index e25737d50c..f80974772b 100644 --- a/packages/frontend/src/components/MkPageWindow.vue +++ b/packages/frontend/src/components/MkPageWindow.vue @@ -1,5 +1,5 @@ <template> -<XWindow +<MkWindow ref="windowEl" :initial-width="500" :initial-height="500" @@ -20,13 +20,13 @@ <div class="yrolvcoq" :style="{ background: pageMetadata?.value?.bg }" style="container-type: inline-size;"> <RouterView :router="router"/> </div> -</XWindow> +</MkWindow> </template> <script lang="ts" setup> import { ComputedRef, inject, provide } from 'vue'; import RouterView from '@/components/global/RouterView.vue'; -import XWindow from '@/components/MkWindow.vue'; +import MkWindow from '@/components/MkWindow.vue'; import { popout as _popout } from '@/scripts/popout'; import copyToClipboard from '@/scripts/copy-to-clipboard'; import { url } from '@/config'; @@ -47,7 +47,7 @@ defineEmits<{ const router = new Router(routes, props.initialPath); let pageMetadata = $ref<null | ComputedRef<PageMetadata>>(); -let windowEl = $shallowRef<InstanceType<typeof XWindow>>(); +let windowEl = $shallowRef<InstanceType<typeof MkWindow>>(); const history = $ref<{ path: string; key: any; }[]>([{ path: router.getCurrentPath(), key: router.getCurrentKey(), diff --git a/packages/frontend/src/components/MkWindow.vue b/packages/frontend/src/components/MkWindow.vue index b28c5e4b85..401f0f4a2e 100644 --- a/packages/frontend/src/components/MkWindow.vue +++ b/packages/frontend/src/components/MkWindow.vue @@ -489,6 +489,7 @@ defineExpose({ flex: 1; overflow: auto; background: var(--panel); + container-type: inline-size; } } diff --git a/packages/frontend/src/components/MkYoutubePlayer.vue b/packages/frontend/src/components/MkYoutubePlayer.vue index c12b03572d..d1f1f9e9c5 100644 --- a/packages/frontend/src/components/MkYoutubePlayer.vue +++ b/packages/frontend/src/components/MkYoutubePlayer.vue @@ -1,5 +1,5 @@ <template> -<XWindow :initial-width="640" :initial-height="402" :can-resize="true" :close-button="true"> +<MkWindow :initial-width="640" :initial-height="402" :can-resize="true" :close-button="true"> <template #header> <i class="icon ti ti-brand-youtube" style="margin-right: 0.5em;"></i> <span>{{ title ?? 'YouTube' }}</span> @@ -14,11 +14,11 @@ <MkLoading v-if="fetching"/> <MkError v-else-if="!player.url" @retry="ytFetch()"/> </div> -</XWindow> +</MkWindow> </template> <script lang="ts" setup> -import XWindow from '@/components/MkWindow.vue'; +import MkWindow from '@/components/MkWindow.vue'; import { versatileLang } from '@/scripts/intl-const'; const props = defineProps<{