Outside click close, bugfixes

This commit is contained in:
IndexZeroZzz 2024-02-28 22:42:33 +03:00
parent df568a572b
commit 49fc0156d5
2 changed files with 27 additions and 11 deletions

View file

@ -11,6 +11,7 @@
let checksumSwayIsPressed = false; let checksumSwayIsPressed = false;
let checksumRiverIsPressed = false; let checksumRiverIsPressed = false;
onMount(() => { onMount(() => {
let lightbox = new PhotoSwipeLightbox({ let lightbox = new PhotoSwipeLightbox({
gallery: '#sway-screenshots', gallery: '#sway-screenshots',
@ -19,6 +20,21 @@
}); });
lightbox.init(); lightbox.init();
}); });
onMount(() => {
document.body.addEventListener('click', (e) => {
let classes = (e.target as HTMLElement).classList;
if(classes.contains('download-all') == false) {
downloadIsPressed = false;
}
if(classes.contains('checksum-sway') == false) {
checksumSwayIsPressed = false;
}
if(classes.contains('checksum-river') == false) {
checksumRiverIsPressed = false;
}
})
});
</script> </script>
<svelte:head> <svelte:head>
@ -33,18 +49,18 @@
<div class="relative inline-block text-left"> <div class="relative inline-block text-left">
<div> <div>
<button <button
class="border-2 p-2.5 mx-5 my-3 rounded-md bg-[#6993e9]" class="border-2 p-2.5 mx-5 my-3 rounded-md bg-[#6993e9] download-all"
on:click={() => { on:click={() => {
downloadIsPressed = !downloadIsPressed; downloadIsPressed = !downloadIsPressed;
}} }}
> >
<Download className="mr-1.5"></Download> <Download className="mr-1.5 download-all"></Download>
Download Download
</button> </button>
</div> </div>
<div <div
class="absolute left-0 mx-5 my-3 w-56 rounded-md bg-[#6993e9] {downloadIsPressed class="absolute left-0 mx-5 my-3 w-56 rounded-md bg-[#6993e9] {downloadIsPressed
? 'transition ease-in duration-75 opacity-100 scale-100' ? 'transition ease-in duration-75 opacity-100 scale-100 visible'
: 'opacity-0 transition ease-out duration-100 scale-95'}" : 'opacity-0 transition ease-out duration-100 scale-95'}"
> >
<div class="py-1"> <div class="py-1">
@ -115,12 +131,12 @@
<div class="relative inline-block text-left"> <div class="relative inline-block text-left">
<div> <div>
<button <button
class="border-2 p-2.5 mx-5 my-3 ml-0 rounded-md bg-[#8bd5ca]" class="border-2 p-2.5 mx-5 my-3 ml-0 rounded-md bg-[#8bd5ca] checksum-sway"
on:click={() => { on:click={() => {
checksumSwayIsPressed = !checksumSwayIsPressed; checksumSwayIsPressed = !checksumSwayIsPressed;
}} }}
> >
<Check className="mr-1.5"></Check> <Check className="mr-1.5 checksum-sway"></Check>
Checksums Checksums
</button> </button>
</div> </div>
@ -220,12 +236,12 @@
<div class="relative inline-block text-left"> <div class="relative inline-block text-left">
<div> <div>
<button <button
class="border-2 p-2.5 mx-5 my-3 ml-0 rounded-md bg-[#8bd5ca]" class="border-2 p-2.5 mx-5 my-3 ml-0 rounded-md bg-[#8bd5ca] checksum-river"
on:click={() => { on:click={() => {
checksumRiverIsPressed = !checksumRiverIsPressed; checksumRiverIsPressed = !checksumRiverIsPressed;
}} }}
> >
<Check className="mr-1.5"></Check> <Check className="mr-1.5 checksum-river"></Check>
Checksums Checksums
</button> </button>
</div> </div>
@ -297,8 +313,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="flex flex-row md:flex-col m-7"> <div class="flex flex-col md:flex-row m-7">
<div class="flex-1 m-5"> <div class="m-5 flex-1">
<h2 class="text-2xl font-bold mb-3">System requirements:</h2> <h2 class="text-2xl font-bold mb-3">System requirements:</h2>
<ul class="list-disc"> <ul class="list-disc">
<li class="ml-[15.3px]">CPU: Dual-core CPU with 1.6 GHz</li> <li class="ml-[15.3px]">CPU: Dual-core CPU with 1.6 GHz</li>
@ -311,7 +327,7 @@
</li> </li>
</ul> </ul>
</div> </div>
<div class="flex-1 m-5"> <div class="m-5 flex-1">
<h2 class="text-2xl font-bold mb-3">Known Issues:</h2> <h2 class="text-2xl font-bold mb-3">Known Issues:</h2>
<ul class="list-disc"> <ul class="list-disc">
<li class="ml-[15.3px]"> <li class="ml-[15.3px]">

View file

@ -2,7 +2,7 @@
"extends": "./.svelte-kit/tsconfig.json", "extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": { "compilerOptions": {
"allowJs": true, "allowJs": true,
"checkJs": true, "checkJs": false,
"esModuleInterop": true, "esModuleInterop": true,
"forceConsistentCasingInFileNames": true, "forceConsistentCasingInFileNames": true,
"resolveJsonModule": true, "resolveJsonModule": true,