render modal at the root level using portal
This commit is contained in:
parent
5740123ee6
commit
9c8af14908
3 changed files with 17 additions and 12 deletions
|
@ -49,6 +49,7 @@
|
||||||
</div>
|
</div>
|
||||||
<chat-panel :floating="true" v-if="currentUser && chat" class="floating-chat mobile-hidden"></chat-panel>
|
<chat-panel :floating="true" v-if="currentUser && chat" class="floating-chat mobile-hidden"></chat-panel>
|
||||||
<UserReportingModal />
|
<UserReportingModal />
|
||||||
|
<portal-target name="modal" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
@ -62,6 +62,7 @@
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -80,6 +81,7 @@
|
||||||
background-color: var(--lightBg, $fallback--lightBg);
|
background-color: var(--lightBg, $fallback--lightBg);
|
||||||
border-top: 1px solid $fallback--bg;
|
border-top: 1px solid $fallback--bg;
|
||||||
border-top: 1px solid var(--bg, $fallback--bg);
|
border-top: 1px solid var(--bg, $fallback--bg);
|
||||||
|
display: flex;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
|
|
||||||
button {
|
button {
|
||||||
|
|
|
@ -65,18 +65,20 @@
|
||||||
{{ $t('user_card.admin_menu.moderation') }}
|
{{ $t('user_card.admin_menu.moderation') }}
|
||||||
</button>
|
</button>
|
||||||
</Popper>
|
</Popper>
|
||||||
<DialogModal v-if="showDeleteUserDialog" :onCancel='deleteUserDialog.bind(this, false)'>
|
<portal to="modal">
|
||||||
<span slot="header">{{ $t('user_card.admin_menu.delete_user') }}</span>
|
<DialogModal v-if="showDeleteUserDialog" :onCancel='deleteUserDialog.bind(this, false)'>
|
||||||
<p>{{ $t('user_card.admin_menu.delete_user_confirmation') }}</p>
|
<template slot="header">{{ $t('user_card.admin_menu.delete_user') }}</template>
|
||||||
<span slot="footer">
|
<p>{{ $t('user_card.admin_menu.delete_user_confirmation') }}</p>
|
||||||
<button @click='deleteUserDialog(false)'>
|
<template slot="footer">
|
||||||
{{ $t('general.cancel') }}
|
<button class="btn btn-default" @click='deleteUserDialog(false)'>
|
||||||
</button>
|
{{ $t('general.cancel') }}
|
||||||
<button class="danger" @click='deleteUser()'>
|
</button>
|
||||||
{{ $t('user_card.admin_menu.delete_user') }}
|
<button class="btn btn-default danger" @click='deleteUser()'>
|
||||||
</button>
|
{{ $t('user_card.admin_menu.delete_user') }}
|
||||||
</span>
|
</button>
|
||||||
</DialogModal>
|
</template>
|
||||||
|
</DialogModal>
|
||||||
|
</portal>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue