ReVanced/revanced-website
1
0
Fork 0
mirror of https://github.com/ReVanced/revanced-website.git synced 2026-01-11 13:46:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: dont use patch-info-chip for expand button (#154)

Browse Source 
* feat: different button

* feat: make it larger
This commit is contained in:
Ushie
2023-08-01 02:05:16 +03:00
committed by GitHub
parent b9e50cf8d6
commit 48f5c3aec9
1 changed files with 5 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/routes/patches/PatchItem.svelte
View File

@@ -3,6 +3,7 @@
import { quintOut } from 'svelte/easing'; import { quintOut } from 'svelte/easing';
import type { Patch } from '$lib/types'; import type { Patch } from '$lib/types';
import { compare, coerce } from 'semver'; import { compare, coerce } from 'semver';
import Button from '$lib/components/Button.svelte';
export let patch: Patch; export let patch: Patch;
export let showAllVersions: boolean; export let showAllVersions: boolean;
@@ -22,7 +23,7 @@
<h3>{patch.name}</h3> <h3>{patch.name}</h3>
</div> </div>
{#if hasPatchOptions} {#if hasPatchOptions}
<img class="expand-arrow" id="expand-card" src="/icons/arrow.svg" alt="dropdown" /> <img class="expand-arrow" src="/icons/arrow.svg" alt="dropdown" />
{/if} {/if}
</div> </div>
<h5>{patch.description}</h5> <h5>{patch.description}</h5>
@@ -68,15 +69,14 @@
</li> </li>
{/if} {/if}
{#if patch.compatiblePackages[0].versions.length > 1} {#if patch.compatiblePackages[0].versions.length > 1}
<li class="patch-info button" on:click={() => (showAllVersions = !showAllVersions)}> <Button type="text" on:click={() => (showAllVersions = !showAllVersions)}>
<img <img
class="expand-arrow" class="expand-arrow"
id="expand-versions"
style:transform={showAllVersions ? 'rotate(90deg)' : 'rotate(-90deg)'} style:transform={showAllVersions ? 'rotate(90deg)' : 'rotate(-90deg)'}
src="/icons/expand_more.svg" src="/icons/expand_more.svg"
alt="dropdown" alt="dropdown"
/> />
</li> </Button>
{/if} {/if}
{/if} {/if}
</ul> </ul>
@@ -169,13 +169,8 @@
.expand-arrow { .expand-arrow {
transition: all 0.2s var(--bezier-one); transition: all 0.2s var(--bezier-one);
user-select: none; user-select: none;
&#expand-versions {
height: 1.125rem;
}
&#expand-card {
height: 1.5rem; height: 1.5rem;
} }
}
.rotate .expand-arrow { .rotate .expand-arrow {
transform: rotate(180deg); transform: rotate(180deg);