more z-index issues

This commit is contained in:
Webifi 2023-06-03 10:58:49 -05:00
parent 08621bfcd3
commit 80aa0cbb57
2 changed files with 42 additions and 37 deletions

View File

@ -336,7 +336,7 @@ $modal-background-background-color-dark: rgba($dark, 0.86) !default; // remove t
} }
aside.menu.main-menu { aside.menu.main-menu {
// z-index:50; z-index:50;
position: fixed; position: fixed;
width: var(--sidebarWidth); width: var(--sidebarWidth);
padding-right: 20px; padding-right: 20px;
@ -610,6 +610,10 @@ aside.menu.main-menu .menu-expanse {
border-bottom-left-radius: 0px !important; border-bottom-left-radius: 0px !important;
} }
.modal {
z-index:100;
}
.modal-card footer { .modal-card footer {
justify-content: space-between; justify-content: space-between;
} }

View File

@ -501,6 +501,43 @@
</script> </script>
<ChatSettingsModal chatId={chatId} bind:show={showSettingsModal} />
<!-- rename modal -->
<form class="modal" bind:this={chatNameSettings} on:submit={saveChatNameSettings}>
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div class="modal-background" on:click={closeChatNameSettings} />
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title">Enter a new name for this chat</p>
</header>
<section class="modal-card-body">
<div class="field is-horizontal">
<div class="field-label is-normal">
<label class="label" for="settings-chat-name">New name:</label>
</div>
<div class="field-body">
<div class="field">
<input
class="input"
type="text"
id="settings-chat-name"
value={chat.name}
/>
</div>
</div>
</div>
</section>
<footer class="modal-card-foot">
<input type="submit" class="button is-info" value="Save" />
<button class="button" on:click={closeChatNameSettings}>Cancel</button>
</footer>
</div>
</form>
<!-- end -->
<div class="chat-content"> <div class="chat-content">
<nav class="level chat-header"> <nav class="level chat-header">
<div class="level-left"> <div class="level-left">
@ -581,42 +618,6 @@
</div> </div>
</Footer> </Footer>
<ChatSettingsModal chatId={chatId} bind:show={showSettingsModal} />
<!-- rename modal -->
<form class="modal" bind:this={chatNameSettings} on:submit={saveChatNameSettings}>
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div class="modal-background" on:click={closeChatNameSettings} />
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title">Enter a new name for this chat</p>
</header>
<section class="modal-card-body">
<div class="field is-horizontal">
<div class="field-label is-normal">
<label class="label" for="settings-chat-name">New name:</label>
</div>
<div class="field-body">
<div class="field">
<input
class="input"
type="text"
id="settings-chat-name"
value={chat.name}
/>
</div>
</div>
</div>
</section>
<footer class="modal-card-foot">
<input type="submit" class="button is-info" value="Save" />
<button class="button" on:click={closeChatNameSettings}>Cancel</button>
</footer>
</div>
</form>
<!-- end -->
<svelte:window <svelte:window
on:keydown={(event) => { on:keydown={(event) => {
if (event.key === 'Escape') { if (event.key === 'Escape') {