ReVanced/revanced-website
1
0
Fork 0
mirror of https://github.com/revanced/revanced-website.git synced 2025-04-30 06:34:35 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: tweak dialogue, patch item, contributors ui

Browse Source
This commit is contained in:
afn 2023-04-20 22:22:00 -04:00
parent 80ae15bb18
commit 9734d9f64b
7 changed files with 26 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/app.scss
View File

@ -85,8 +85,8 @@ h3 {
h4 { h4 {
color: var(--accent-color-two); color: var(--accent-color-two);
font-weight: 500; font-weight: 400;
font-size: 1.2rem; font-size: 1rem;
letter-spacing: 0.02rem; letter-spacing: 0.02rem;
line-height: 2rem; line-height: 2rem;
} }
@ -107,7 +107,7 @@ h6 {
p { p {
color: var(--grey-five); color: var(--grey-five);
font-weight: 400; font-weight: 400;
font-size: 0.95rem; font-size: 1rem;
letter-spacing: 0.02rem; letter-spacing: 0.02rem;
line-height: 1.75rem; line-height: 1.75rem;
} }
@ -142,9 +142,9 @@ p {
hr { hr {
display: block; display: block;
height: 2px; height: 1px;
border: 0; border: 0;
border-top: 2px solid var(--grey-three); border-top: 1px solid var(--grey-three);
} }
input { input {

7
src/lib/components/Dialogue.svelte
View File

@ -21,7 +21,7 @@
transition:fade={{ easing: quadInOut, duration: 150 }} transition:fade={{ easing: quadInOut, duration: 150 }}
> >
<div class="top"> <div class="top">
<div class="title"> <div class="title" class:hasIcon={$$slots.icon}>
{#if fullscreen} {#if fullscreen}
<button on:click={() => (modalOpen = !modalOpen)}> <button on:click={() => (modalOpen = !modalOpen)}>
<img src="../icons/back.svg" id="back" alt="back" /> <img src="../icons/back.svg" id="back" alt="back" />
@ -69,7 +69,6 @@
.title { .title {
position: sticky; position: sticky;
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
gap: 1rem; gap: 1rem;
top: 0; top: 0;
@ -79,6 +78,10 @@
margin-bottom: 8px; margin-bottom: 8px;
} }
.hasIcon {
flex-direction: column;
}
.modal { .modal {
position: fixed; position: fixed;
width: min(85%, 425px); width: min(85%, 425px);

2
src/lib/components/Meta.svelte
View File

@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
let _title: string = ""; let _title: string = "";
$: title = _title === "" ? "ReVanced" : `ReVanced | ${_title}`; $: title = _title === "" ? "ReVanced" : `ReVanced · ${_title}`;
export { _title as title }; export { _title as title };

7
src/routes/contributors/+page.svelte
View File

@ -82,11 +82,18 @@
transition: all 0.3s var(--bezier-one); transition: all 0.3s var(--bezier-one);
} }
a:hover {
text-decoration: underline;
text-decoration-style: wavy;
text-decoration-color: var(--grey-four);
}
a:hover::after { a:hover::after {
transform: translateX(5px); transform: translateX(5px);
} }
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
.text-container { .text-container {
padding: 2rem 1.75rem;
margin-bottom: 2rem; margin-bottom: 2rem;
} }
} }

1
src/routes/contributors/ContributorPerson.svelte
View File

@ -36,6 +36,7 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
padding: 0.25rem 0;
} }
img { img {

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

@ -21,7 +21,7 @@
on:click={() => (expanded = !expanded)} on:click={() => (expanded = !expanded)}
on:keypress={() => (expanded = !expanded)} on:keypress={() => (expanded = !expanded)}
> >
<a href="https://github.com/{repo}" rel="noreferrer" target="_blank"> <a href="https://github.com/{repo}" rel="noreferrer" target="_blank" on:click|stopPropagation>
<h4>{repo_name}</h4> <h4>{repo_name}</h4>
</a> </a>
<img <img
@ -72,7 +72,6 @@
} }
a { a {
transition: all 0.3s var(--bezier-one);
display: flex; display: flex;
text-decoration: none; text-decoration: none;
width: max-content; width: max-content;

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

@ -32,14 +32,14 @@
target="_blank" target="_blank"
rel="noreferrer" rel="noreferrer"
> >
<li class="patch-info">📦 {pkg.name} ·</li> <li class="patch-info">📦 {pkg.name}</li>
</a> </a>
{/each} {/each}
<!-- should i hardcode this to get the version of the first package? idk you cant stop me --> <!-- should i hardcode this to get the version of the first package? idk you cant stop me -->
{#if patch.compatiblePackages.length && patch.compatiblePackages[0].versions.length} {#if patch.compatiblePackages.length && patch.compatiblePackages[0].versions.length}
<li class="patch-info"> <li class="patch-info">
🎯 {patch.compatiblePackages[0].versions.slice(-1)} · 🎯 {patch.compatiblePackages[0].versions.slice(-1)}
</li> </li>
{/if} {/if}
@ -47,10 +47,8 @@
<li class="patch-info">🌎 Universal patch</li> <li class="patch-info">🌎 Universal patch</li>
{/if} {/if}
<li class="patch-info">🧩 {patch.version}</li>
{#if hasPatchOptions} {#if hasPatchOptions}
<li class="patch-info">· ⚙️ Patch options</li> <li class="patch-info">⚙️ Patch options</li>
{/if} {/if}
</ul> </ul>
@ -84,6 +82,9 @@
font-size: 0.8rem; font-size: 0.8rem;
font-weight: 500; font-weight: 500;
color: var(--grey-five); color: var(--grey-five);
padding: 0.25rem 0.5rem;
border: 1px solid var(--grey-three);
border-radius: 8px;
} }
a { a {