summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components
diff options
context:
space:
mode:
authorsyuilo <Syuilotan@yahoo.co.jp>2023-01-14 21:04:20 +0900
committersyuilo <Syuilotan@yahoo.co.jp>2023-01-14 21:04:20 +0900
commitdc19f20153fbdb7c3ad26119bbd243c1175f105d (patch)
tree2fe3342bb65331b796878956af43c0e2610299b8 /packages/frontend/src/components
parentrefactor(client): use css modules (diff)
downloadsharkey-dc19f20153fbdb7c3ad26119bbd243c1175f105d.tar.gz
sharkey-dc19f20153fbdb7c3ad26119bbd243c1175f105d.tar.bz2
sharkey-dc19f20153fbdb7c3ad26119bbd243c1175f105d.zip
refactor
Diffstat (limited to 'packages/frontend/src/components')
-rw-r--r--packages/frontend/src/components/MkDialog.vue1
-rw-r--r--packages/frontend/src/components/MkModal.vue20
-rw-r--r--packages/frontend/src/components/MkPostFormDialog.vue4
-rw-r--r--packages/frontend/src/components/MkUpdated.vue1
-rw-r--r--packages/frontend/src/components/MkWaitingDialog.vue1
5 files changed, 8 insertions, 19 deletions
diff --git a/packages/frontend/src/components/MkDialog.vue b/packages/frontend/src/components/MkDialog.vue
index 160ea23e05..74cb534859 100644
--- a/packages/frontend/src/components/MkDialog.vue
+++ b/packages/frontend/src/components/MkDialog.vue
@@ -146,6 +146,7 @@ onBeforeUnmount(() => {
<style lang="scss" module>
.root {
position: relative;
+ margin: auto;
padding: 32px;
min-width: 320px;
max-width: 480px;
diff --git a/packages/frontend/src/components/MkModal.vue b/packages/frontend/src/components/MkModal.vue
index 9c11aa0640..6265e637d6 100644
--- a/packages/frontend/src/components/MkModal.vue
+++ b/packages/frontend/src/components/MkModal.vue
@@ -7,9 +7,9 @@
:leave-to-class="$style['transition_' + transitionName + '_leaveTo']"
:duration="transitionDuration" appear @after-leave="emit('closed')" @enter="emit('opening')" @after-enter="onOpened"
>
- <div v-show="manualShowing != null ? manualShowing : showing" v-hotkey.global="keymap" :class="[$style.root, { [$style.drawer]: type === 'drawer', [$style.dialog]: type === 'dialog' || type === 'dialog:top', [$style.popup]: type === 'popup' }]" :style="{ zIndex, pointerEvents: (manualShowing != null ? manualShowing : showing) ? 'auto' : 'none', '--transformOrigin': transformOrigin }">
+ <div v-show="manualShowing != null ? manualShowing : showing" v-hotkey.global="keymap" :class="[$style.root, { [$style.drawer]: type === 'drawer', [$style.dialog]: type === 'dialog', [$style.popup]: type === 'popup' }]" :style="{ zIndex, pointerEvents: (manualShowing != null ? manualShowing : showing) ? 'auto' : 'none', '--transformOrigin': transformOrigin }">
<div class="_modalBg" :class="[$style.bg, { [$style.bgTransparent]: transparentBg && (type === 'popup') }]" :style="{ zIndex }" @click="onBgClick" @mousedown="onBgClick" @contextmenu.prevent.stop="() => {}"></div>
- <div ref="content" :class="[$style.content, { [$style.fixed]: fixed, [$style.top]: type === 'dialog:top' }]" :style="{ zIndex }" @click.self="onBgClick">
+ <div ref="content" :class="[$style.content, { [$style.fixed]: fixed }]" :style="{ zIndex }" @click.self="onBgClick">
<slot :max-height="maxHeight" :type="type"></slot>
</div>
</div>
@@ -33,7 +33,7 @@ function getFixedContainer(el: Element | null): Element | null {
}
}
-type ModalTypes = 'popup' | 'dialog' | 'dialog:top' | 'drawer';
+type ModalTypes = 'popup' | 'dialog' | 'drawer';
const props = withDefaults(defineProps<{
manualShowing?: boolean | null;
@@ -413,16 +413,6 @@ defineExpose({
-webkit-mask-image: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 16px, rgba(0,0,0,1) calc(100% - 16px), rgba(0,0,0,0) 100%);
mask-image: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 16px, rgba(0,0,0,1) calc(100% - 16px), rgba(0,0,0,0) 100%);
}
-
- &:global > * {
- margin: auto;
- }
-
- &.top {
- &:global > * {
- margin-top: 0;
- }
- }
}
}
@@ -450,10 +440,6 @@ defineExpose({
left: 0;
right: 0;
margin: auto;
-
- &:global > * {
- margin: auto;
- }
}
}
}
diff --git a/packages/frontend/src/components/MkPostFormDialog.vue b/packages/frontend/src/components/MkPostFormDialog.vue
index f71dbdfdab..6326c498d7 100644
--- a/packages/frontend/src/components/MkPostFormDialog.vue
+++ b/packages/frontend/src/components/MkPostFormDialog.vue
@@ -1,6 +1,6 @@
<template>
-<MkModal ref="modal" :prefer-type="'dialog:top'" @click="modal.close()" @closed="onModalClosed()">
- <MkPostForm ref="form" v-bind="props" autofocus freeze-after-posted @posted="onPosted" @cancel="modal.close()" @esc="modal.close()"/>
+<MkModal ref="modal" :prefer-type="'dialog'" @click="modal.close()" @closed="onModalClosed()">
+ <MkPostForm ref="form" style="margin: 0 auto auto auto;" v-bind="props" autofocus freeze-after-posted @posted="onPosted" @cancel="modal.close()" @esc="modal.close()"/>
</MkModal>
</template>
diff --git a/packages/frontend/src/components/MkUpdated.vue b/packages/frontend/src/components/MkUpdated.vue
index ba6b7853d4..eed7fa71f6 100644
--- a/packages/frontend/src/components/MkUpdated.vue
+++ b/packages/frontend/src/components/MkUpdated.vue
@@ -34,6 +34,7 @@ onMounted(() => {
<style lang="scss" module>
.root {
+ margin: auto;
position: relative;
padding: 32px;
min-width: 320px;
diff --git a/packages/frontend/src/components/MkWaitingDialog.vue b/packages/frontend/src/components/MkWaitingDialog.vue
index 984cdc5266..da835d21cc 100644
--- a/packages/frontend/src/components/MkWaitingDialog.vue
+++ b/packages/frontend/src/components/MkWaitingDialog.vue
@@ -37,6 +37,7 @@ watch(() => props.showing, () => {
<style lang="scss" scoped>
.iuyakobc {
+ margin: auto;
position: relative;
padding: 32px;
box-sizing: border-box;