mirror/cherrypick
1
1
Fork 0
mirror of https://github.com/kokonect-link/cherrypick synced 2024-10-31 15:21:46 +09:00
Code

fix(client): fix zindex issues

Browse Source 
Fix #8060
This commit is contained in:
syuilo 2021-12-16 10:57:07 +09:00
parent fa8eb43eaf
commit 58b9dc581e
2 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/client/src/components/url-preview-popup.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="fgmtyycl" :style="{ top: top + 'px', left: left + 'px' }">
<div class="fgmtyycl" :style="{ zIndex, top: top + 'px', left: left + 'px' }">
<transition name="zoom" @after-leave="$emit('closed')">
<MkUrlPreview v-if="showing" class="_popup _shadow" :url="url"/>
</transition>
@ -35,6 +35,7 @@ export default defineComponent({
u: null,
top: 0,
left: 0,
zIndex: os.claimZIndex(),
};
},
@ -52,7 +53,6 @@ export default defineComponent({
<style lang="scss" scoped>
.fgmtyycl {
position: absolute;
z-index: 11000;
width: 500px;
max-width: calc(90vw - 12px);
pointer-events: none;

4
packages/client/src/components/user-preview.vue
View File

@ -1,6 +1,6 @@
<template>
<transition name="popup" appear @after-leave="$emit('closed')">
<div v-if="showing" class="fxxzrfni _popup _shadow" :style="{ top: top + 'px', left: left + 'px' }" @mouseover="() => { $emit('mouseover'); }" @mouseleave="() => { $emit('mouseleave'); }">
<div v-if="showing" class="fxxzrfni _popup _shadow" :style="{ zIndex, top: top + 'px', left: left + 'px' }" @mouseover="() => { $emit('mouseover'); }" @mouseleave="() => { $emit('mouseleave'); }">
<div v-if="fetched" class="info">
<div class="banner" :style="user.bannerUrl ? `background-image: url(${user.bannerUrl})` : ''"></div>
<MkAvatar class="avatar" :user="user" :disable-preview="true" :show-indicator="true"/>
@ -65,6 +65,7 @@ export default defineComponent({
fetched: false,
top: 0,
left: 0,
zIndex: os.claimZIndex(),
};
},
@ -109,7 +110,6 @@ export default defineComponent({
.fxxzrfni {
position: absolute;
z-index: 11000;
width: 300px;
overflow: hidden;
transform-origin: center top;