TileOS/tileos-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Outside click close, bugfixes

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

36
src/routes/+page.svelte
View file

@ -11,6 +11,7 @@
let checksumSwayIsPressed = false;
let checksumRiverIsPressed = false;
onMount(() => {
let lightbox = new PhotoSwipeLightbox({
gallery: '#sway-screenshots',
@ -19,6 +20,21 @@
});
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>
<svelte:head>
@ -33,18 +49,18 @@
<div class="relative inline-block text-left">
<div>
<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={() => {
downloadIsPressed = !downloadIsPressed;
}}
>
<Download className="mr-1.5"></Download>
<Download className="mr-1.5 download-all"></Download>
Download
</button>
</div>
<div
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'}"
>
<div class="py-1">
@ -115,12 +131,12 @@
<div class="relative inline-block text-left">
<div>
<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={() => {
checksumSwayIsPressed = !checksumSwayIsPressed;
}}
>
<Check className="mr-1.5"></Check>
<Check className="mr-1.5 checksum-sway"></Check>
Checksums
</button>
</div>
@ -220,12 +236,12 @@
<div class="relative inline-block text-left">
<div>
<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={() => {
checksumRiverIsPressed = !checksumRiverIsPressed;
}}
>
<Check className="mr-1.5"></Check>
<Check className="mr-1.5 checksum-river"></Check>
Checksums
</button>
</div>
@ -297,8 +313,8 @@
</div>
</div>
</div>
<div class="flex flex-row md:flex-col m-7">
<div class="flex-1 m-5">
<div class="flex flex-col md:flex-row m-7">
<div class="m-5 flex-1">
<h2 class="text-2xl font-bold mb-3">System requirements:</h2>
<ul class="list-disc">
<li class="ml-[15.3px]">CPU: Dual-core CPU with 1.6 GHz</li>
@ -311,7 +327,7 @@
</li>
</ul>
</div>
<div class="flex-1 m-5">
<div class="m-5 flex-1">
<h2 class="text-2xl font-bold mb-3">Known Issues:</h2>
<ul class="list-disc">
<li class="ml-[15.3px]">

2
tsconfig.json
View file

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