CalvinBackup/phishingclub
1
0
Fork 0
mirror of https://github.com/phishingclub/phishingclub.git synced 2026-07-06 04:17:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix shadow and blurs on modals and etc

Browse Source 
Signed-off-by: Ronni Skansing <rskansing@gmail.com>
This commit is contained in:
Ronni Skansing
2026-03-28 21:20:36 +01:00
parent d153aaf9be
commit 8fa58ded8f
5 changed files with 22 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/components/Alert.svelte
+7 -5
View File
@@ -27,13 +27,13 @@
$: {
if (visible && !alertInitialized) {
window.addEventListener('keydown', keyHandler);
// Prevent body scrolling when alert is open
// prevent body scrolling when alert is open
document.body.style.overflow = 'hidden';
handleAlertOpen();
alertInitialized = true;
} else if (!visible && alertInitialized) {
window.removeEventListener('keydown', keyHandler);
// Restore body scrolling when alert is closed
// restore body scrolling when alert is closed
document.body.style.overflow = 'auto';
handleAlertClose();
alertInitialized = false;
@@ -244,10 +244,12 @@
</script>
{#if visible}
<div class="fixed top-0 left-0 w-full h-full opacity-[0.5]" />
<div
transition:fade={{ duration: 150 }}
class="fixed top-0 left-0 w-full h-full flex justify-center items-center bg-overlay/[0.92] z-20"
class="fixed top-0 left-0 w-full h-full bg-overlay/[0.92] z-[19]"
/>
<div
class="fixed top-0 left-0 w-full h-full flex justify-center items-center z-20"
role="dialog"
aria-modal="true"
aria-labelledby="alert-title"
@@ -255,7 +257,7 @@
>
<section
bind:this={alertElement}
class="shadow-2xl ring-1 ring-white/10 dark:shadow-gray-900/80 w-[32rem] bg-white dark:bg-gray-800 opacity-100 rounded-md flex flex-col transition-colors duration-200"
class="ring-1 ring-white/10 w-[32rem] bg-white dark:bg-gray-800 opacity-100 rounded-md flex flex-col transition-colors duration-200"
>
<!-- Header -->
<div
frontend/src/lib/components/ConfirmPrompt.svelte
+5 -4
View File
@@ -18,13 +18,13 @@
$: {
if (visible && !confirmInitialized) {
window.addEventListener('keydown', keyHandler);
// Prevent body scrolling when confirm prompt is open
// prevent body scrolling when confirm prompt is open
document.body.style.overflow = 'hidden';
handleConfirmOpen();
confirmInitialized = true;
} else if (!visible && confirmInitialized) {
window.removeEventListener('keydown', keyHandler);
// Restore body scrolling when confirm prompt is closed
// restore body scrolling when confirm prompt is closed
document.body.style.overflow = 'auto';
handleConfirmClose();
confirmInitialized = false;
@@ -163,7 +163,8 @@
{#if visible}
<div
transition:fade={{ duration: 150 }}
class="fixed top-0 left-0 w-full h-full bg-overlay/[0.93] transition-colors duration-200"
class="fixed top-0 left-0 w-full h-full bg-overlay/[0.92]"
style="z-index: 19;"
/>
<div
class="fixed top-0 left-0 w-full h-full flex justify-center items-center z-20"
@@ -174,7 +175,7 @@
>
<section
bind:this={confirmElement}
class="flex flex-col items-center w-1/3 bg-slate-100 dark:bg-gray-800 shadow-2xl ring-1 ring-white/10 dark:shadow-gray-900/80 rounded-md transition-colors duration-200"
class="flex flex-col items-center w-1/3 bg-slate-100 dark:bg-gray-800 ring-1 ring-white/10 rounded-md transition-colors duration-200"
>
<div
class="bg-cta-orange2 dark:bg-orange-600 text-white rounded-tl-md rounded-tr-md w-full transition-colors duration-200"
frontend/src/lib/components/Loader.svelte
-1
View File
@@ -15,7 +15,6 @@
</script>
{#if $isLoading && isAnimating}
<div class="fixed top-0 left-0 w-full h-full opacity-[0.5]" transition:fade={{ duration }} />
<div
transition:fade={{ duration }}
class="fixed top-0 left-0 w-full h-full flex justify-center items-center z-50"
frontend/src/lib/components/Modal.svelte
+4 -4
View File
@@ -317,12 +317,12 @@
{#if visible}
<div bind:this={bindTo}>
<div
class="fixed top-0 left-0 w-full h-full opacity-[0.5]"
transition:fade={{ duration: 150 }}
class="fixed top-0 left-0 w-full h-full bg-overlay/[0.92]"
style="z-index: 19;"
/>
<div
transition:fade={{ duration: 150 }}
class="fixed top-0 left-0 w-full h-full flex justify-center items-center bg-overlay/[0.92] z-20"
class="fixed top-0 left-0 w-full h-full flex justify-center items-center z-20"
role="dialog"
aria-modal="true"
aria-labelledby="modal-title"
@@ -330,7 +330,7 @@
>
<section
bind:this={modalElement}
class="shadow-2xl ring-1 ring-white/10 dark:shadow-gray-900/80 bg-white dark:bg-gray-800 opacity-100 rounded-md flex flex-col transition-all duration-200
class="ring-1 ring-white/10 bg-white dark:bg-gray-800 opacity-100 rounded-md flex flex-col transition-all duration-200
{fullscreen
? 'fixed inset-0 w-full h-full max-w-none max-h-none rounded-none'
: 'w-auto ml-20 mr-8 max-h-[90vh]'}"
frontend/src/lib/components/modal/CommandPalette.svelte
+6 -2
View File
@@ -236,11 +236,15 @@
</script>
{#if visible}
<div
transition:fade={{ duration: 150 }}
class="fixed inset-0 bg-overlay/[0.92]"
style="z-index: 49;"
/>
<!-- svelte-ignore a11y-click-events-have-key-events -->
<!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
<div
transition:fade={{ duration: 150, easing: cubicOut }}
class="fixed inset-0 z-50 flex items-start justify-center pt-20 bg-overlay/[0.92]"
class="fixed inset-0 z-50 flex items-start justify-center pt-20"
on:click|self={close}
on:keydown={handleKeydown}
role="dialog"