_Bastler/partey_workadventure
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix embed website z-index

Browse Source
This commit is contained in:
Alexis Faizeau 2022-04-26 18:38:13 +02:00
parent 97e3397398
commit 99bfe11f84
5 changed files with 35 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
front/src/Components/EmbedScreens/EmbedScreensContainer.svelte
View File

@ -19,6 +19,5 @@
padding-top: 2%; padding-top: 2%;
height: 100%; height: 100%;
position: relative; position: relative;
z-index: 200;
} }
</style> </style>

42
front/src/Components/EmbedScreens/Layouts/PresentationLayout.svelte
View File

@ -67,10 +67,11 @@
{/key} {/key}
{:else if $highlightedEmbedScreen.type === "cowebsite"} {:else if $highlightedEmbedScreen.type === "cowebsite"}
{#key $highlightedEmbedScreen.embed.getId()} {#key $highlightedEmbedScreen.embed.getId()}
<div <div class="highlighted-cowebsite-container nes-container is-rounded">
id={"cowebsite-slot-" + $highlightedEmbedScreen.embed.getId()} <div
class="highlighted-cowebsite nes-container is-rounded" id={"cowebsite-slot-" + $highlightedEmbedScreen.embed.getId()}
> class="highlighted-cowebsite"
/>
<div class="actions"> <div class="actions">
<button type="button" class="nes-btn is-error close" on:click={closeCoWebsite} <button type="button" class="nes-btn is-error close" on:click={closeCoWebsite}
>&times;</button >&times;</button
@ -120,20 +121,29 @@
.highlighted-cowebsite { .highlighted-cowebsite {
height: 100% !important; height: 100% !important;
width: 96%; width: 100% !important;
background-color: rgba(#000000, 0.6); position: relative;
margin: 0 !important; z-index: 200;
.actions { &-container {
z-index: 200; height: 100% !important;
position: relative; width: 96%;
display: flex; background-color: rgba(#000000, 0.6);
flex-direction: row; margin: 0 !important;
justify-content: end; padding: 0 !important;
gap: 2%; .actions {
z-index: 202;
position: absolute;
width: 100%;
top: 0;
display: flex;
flex-direction: row;
justify-content: end;
gap: 2%;
button { button {
pointer-events: all; pointer-events: all;
}
} }
} }
} }

3
front/src/Components/HelpCameraSettings/HelpCameraSettingsPopup.svelte
View File

@ -53,11 +53,14 @@
background: #eceeee; background: #eceeee;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
position: absolute;
left: 0; left: 0;
right: 0; right: 0;
margin-top: 4%; margin-top: 4%;
max-height: 80vh; max-height: 80vh;
max-width: 80vw; max-width: 80vw;
margin-left: 10%;
margin-right: 10%;
z-index: 600; z-index: 600;
overflow: auto; overflow: auto;
text-align: center; text-align: center;

10
front/src/Components/MainLayout.svelte
View File

@ -68,6 +68,11 @@
</aside> </aside>
<section id="main-layout-main"> <section id="main-layout-main">
<Lazy
when={$showDesktopCapturerSourcePicker}
component={() => import("./Video/DesktopCapturerSourcePicker.svelte")}
/>
{#if $menuVisiblilityStore} {#if $menuVisiblilityStore}
<Menu /> <Menu />
{/if} {/if}
@ -120,11 +125,6 @@
<Lazy when={$emoteMenuStore} component={() => import("./EmoteMenu/EmoteMenu.svelte")} /> <Lazy when={$emoteMenuStore} component={() => import("./EmoteMenu/EmoteMenu.svelte")} />
<Lazy
when={$showDesktopCapturerSourcePicker}
component={() => import("./Video/DesktopCapturerSourcePicker.svelte")}
/>
{#if hasEmbedScreen} {#if hasEmbedScreen}
<EmbedScreensContainer /> <EmbedScreensContainer />
{/if} {/if}

2
front/style/cowebsite/_global.scss
View File

@ -92,7 +92,7 @@
&-buffer { &-buffer {
iframe { iframe {
z-index: 45 !important; z-index: 201 !important;
pointer-events: none !important; pointer-events: none !important;
overflow: hidden; overflow: hidden;
border: 0; border: 0;