ReVanced/revanced-website
1
0
Fork 0
mirror of https://github.com/revanced/revanced-website.git synced 2025-04-29 22:24:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor: Reduce repetition by adding icon arguments to Button

Browse Source
This commit is contained in:
Ushie 2024-12-22 03:19:02 +03:00
parent 2f24780f34
commit 24650c71a9
No known key found for this signature in database
GPG Key ID: B3AAD18842E34632
4 changed files with 15 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/layout/Hero/HeroSection.svelte
View File

@ -12,14 +12,8 @@
Customize your mobile experience through ReVanced <br /> by applying patches to your applications.
</p>
<div class="hero-buttons">
<Button type="filled" href="download">
<TrayArrowDown size="20px" />
Download
</Button>
<Button type="tonal" href="patches">
<FileDocumentOutline size="20px" />
View patches
</Button>
<Button type="filled" icon={TrayArrowDown} href="download">Download</Button>
<Button type="tonal" icon={FileDocumentOutline} href="patches">View patches</Button>
</div>
</div>
</section>

5
src/lib/components/Button.svelte
View File

@ -1,5 +1,8 @@
<script lang="ts">
export let type: 'filled' | 'tonal' | 'text' | 'outlined';
export let icon: any | undefined = undefined;
export let iconSize = 20;
export let iconColor = 'currentColor';
export let href: string = '';
export let target: string = '';
export let label: string = '';
@ -7,10 +10,12 @@
{#if href}
<a {href} {target} class={`button-${type}`} aria-label={label}>
<svelte:component this={icon} size={iconSize} color={iconColor} />
<slot />
</a>
{:else}
<button on:click class={`button-${type}`} aria-label={label}>
<svelte:component this={icon} size={iconSize} color={iconColor} />
<slot />
</button>
{/if}

2
src/routes/contributors/ContributorSection.svelte
View File

@ -25,7 +25,7 @@
<a href={url} rel="noreferrer" target="_blank" on:click|stopPropagation>
<h4>{name}</h4>
</a>
<div id="arrow" style:transform={expanded ? 'rotate(0deg)' : 'rotate(-180deg)'}>
<div id="arrow" style:transform={expanded ? 'rotate(0deg)' : 'rotate(180deg)'}>
<ChevronUp size="24px" color="var(--surface-six)" />
</div>
</div>

11
src/routes/download/+page.svelte
View File

@ -91,13 +91,16 @@
<div class="buttons">
<Query {query} let:data>
{#if !isAndroid || androidVersion < 8}
<Button on:click={handleClick} type="filled">
<TrayArrowDown size="20px" />
<Button on:click={handleClick} icon={TrayArrowDown} type="filled">
{data.release.version}
</Button>
{:else}
<Button on:click={handleClick} type="filled" href={data.release.download_url}>
<TrayArrowDown size="20px" />
<Button
on:click={handleClick}
icon={TrayArrowDown}
type="filled"
href={data.release.download_url}
>
{data.release.version}
</Button>
{/if}