ReVanced/revanced-website
1
0
Fork 0
mirror of https://github.com/revanced/revanced-website.git synced 2025-05-01 23:24:30 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor: properly disable buttons

Browse Source
This commit is contained in:
afn 2023-03-28 03:59:45 -04:00
parent f85989c083
commit c119d4a721
2 changed files with 7 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/lib/components/atoms/Button.svelte
View File

@ -4,10 +4,11 @@
export let maxWidth = false;
export let icon = '';
export let alt = '';
export let unclickable = false;
export let disabled = false;
</script>
<button class={type} class:unclickable on:click|stopPropagation style="width: {maxWidth ? '100%' : 'max-content'}">
<button class={type} {disabled} on:click|stopPropagation style="width: {maxWidth ? '100%' : 'max-content'}">
{#if icon}
<img src={icon} {alt} />
{/if}
@ -22,7 +23,7 @@
transition: all 0.2s var(--bezier-one);
}
.unclickable {
button:disabled {
cursor: not-allowed;
opacity: 0.25;
}

8
src/routes/poll/+page.svelte
View File

@ -106,7 +106,6 @@
});
function previousPage() {
if (currentPage <= 0 || submitted) return null;
currentPage--;
submit = false;
transitionDirection = -5;
@ -114,14 +113,12 @@
}
function nextPage() {
if (currentPage >= logoPages || submitted) return null;
currentPage++;
transitionDirection = 5;
window.scrollTo({ top: 0, left: 0, behavior: 'smooth' });
}
function submitSelection() {
if (ui_selected_count < 1) return null;
submitModal = true;
}
@ -276,11 +273,11 @@
</Modal>
</div>
<div class="buttons-container">
<Button on:click={previousPage} unclickable={currentPage <= 0 || submitted}>Previous</Button>
<Button on:click={previousPage} disabled={currentPage <= 0 || submitted}>Previous</Button>
<Button
kind="primary"
on:click={finalPage ? submitSelection : nextPage}
unclickable={(finalPage && ui_selected_count < 1) || submitted}
disabled={(finalPage && ui_selected_count < 1) || submitted}
>
{finalPage ? 'Submit' : 'Next'}
</Button>
@ -415,6 +412,7 @@
.warning {
display: flex;
justify-content: center;
margin-bottom: 2rem;
}
@media screen and (max-width: 768px) {