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

buttons work, added social buttons, contrib wip

Browse Source
This commit is contained in:
afnzmn 2022-07-18 17:56:50 -04:00
parent 88cf26714b
commit b99db6391f
16 changed files with 157 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -32,7 +32,7 @@
transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
transition-duration: 0.4s;
margin-right: 20px;
user-select: none;
}
.button-primary {

39
src/lib/components/atoms/ContributorButton.svelte Normal file
View File

@ -0,0 +1,39 @@
<script>
export let href = '#';
</script>
<button>
<a {href}>
<slot/>
</a>
</button>
<style>
a {
color: var(--white);
text-decoration: none;
}
button {
color: var(--white);
border-radius: 200px;
border: 0;
padding: 5px 5px;
width:128px;
height:128px;
max-height: 128px;
max-width: 128px;
cursor: pointer;
background-color: var(--grey-four);
font-size: 1.5rem;
transform: translateX(-5%);
transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
transition-duration: 0.4s;
user-select: none;
}
button:hover {
transform: translate(-5%, -5%);
}
</style>

10
src/lib/components/atoms/HeroImage.svelte
View File

@ -2,14 +2,16 @@
</script>
<img class="hero-img" src="/manager.png" alt="Screenshot of ReVanced Manager"/>
<div class="hero-img" style ="background-image:url('/manager.png')" alt="Screenshot of ReVanced Manager">afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real </div>
<style>
.hero-img {
width: 400px;
height: 400px;
width:fit-content;
border-radius: 20px;
float: right;
transform: rotate(3.7deg) translateY(-24%) translateX(-12%);
transform: rotate(3.7deg) translateY(-35%) translateX(200%);
user-select: none;
position: absolute;
}
</style>

6
src/lib/components/atoms/Navigation.svelte
View File

@ -14,13 +14,19 @@
list-style: none;
display: inline-block;
position: relative;
margin-left: 7x;
margin-right: 7px;
align-items: center;
user-select: none;
transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
transition-duration: 0.1s;
}
a {
color: var(--white);
text-decoration: none;
font-size: 1.25rem;
user-select: none;
}
li:hover {

36
src/lib/components/atoms/SocialButton.svelte Normal file
View File

@ -0,0 +1,36 @@
<script>
export let src = 'socials/github.svg';
export let alt = 'GitHub';
export let href = '#';
</script>
<button>
<a {href}>
<img {src} {alt}>
</a>
</button>
<style>
button {
color: var(--white);
border-radius: 200px;
border: 0;
padding: 15px 0px;
width:60px;
height:60px;
cursor: pointer;
background-color: var(--grey-four);
font-size: 1.5rem;
transform: translateX(-5%);
transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
transition-duration: 0.4s;
user-select: none;
margin-right:0.5rem;
margin-left: 0.5rem;
}
button:hover {
transform: translate(-5%, -5%);
}
</style>

21
src/lib/components/molecules/ContributorHost.svelte Normal file
View File

@ -0,0 +1,21 @@
<script>
import SocialButton from "../atoms/SocialButton.svelte";
</script>
<div class="social-host">
<SocialButton></SocialButton>
<SocialButton></SocialButton>
<SocialButton></SocialButton>
<SocialButton></SocialButton>
</div>
<style>
.social-host {
width: 100;
justify-content: space-between;
align-items: center;
display: flex;
margin-left: 5rem;
margin-right: 5rem;
}
</style>

11
src/lib/components/molecules/NavHost.svelte
View File

@ -3,7 +3,7 @@
</script>
<nav>
<div class="logo">ReVanced</div>
<img class="logo" src="/logo.svg" alt="ReVanced Logo"/>
<ul>
<Navigation href="/">Home</Navigation>
<Navigation href="/download">Download</Navigation>
@ -17,9 +17,14 @@
width: 100%;
display: flex;
padding-top: 1.25rem;
padding-right: 4rem;
padding-right: 2rem;
padding-left: 6rem;
justify-content: space-between;
align-items: center;
min-height: 83px;
min-height: 90px;
}
.logo {
width: 3rem;
}
</style>

20
src/lib/components/molecules/SocialHost.svelte Normal file
View File

@ -0,0 +1,20 @@
<script>
import SocialButton from "../atoms/SocialButton.svelte";
</script>
<div class="social-host">
<SocialButton src="socials/github.svg" alt="GitHub" href="https://revanced.app/github"></SocialButton>
<SocialButton src="socials/discord.svg" alt="Discord" href="http://revanced.app/discord"></SocialButton>
<SocialButton src="socials/reddit.svg" alt="Reddit" href="https://revanced.app/reddit"></SocialButton>
<SocialButton src="socials/telegram.svg" alt="Telegram" href="https://revanced.app/telegram"></SocialButton>
</div>
<style>
.social-host {
justify-content: space-between;
align-items: center;
display: inline-block;
transform: translateY(380%);
}
</style>

13
src/routes/__layout.svelte
View File

@ -15,6 +15,10 @@ import NavHost from "$lib/components/molecules/NavHost.svelte";
href="https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap"
rel="stylesheet"
/>
<meta name="og:title" content="ReVanced"/>
<meta name="og:image" itemprop="image" content="embed.png">
<meta name="twitter:card" content="summary_large_image">
<meta name="theme-color" content="#0f111a">
<title>ReVanced</title>
<link rel="stylesheet" href="css/styles.css" />
</svelte:head>
@ -51,6 +55,7 @@ import NavHost from "$lib/components/molecules/NavHost.svelte";
--grey-one: #1c1e29;
--grey-two: #2b2d3a;
--grey-three: #3e404f;
--grey-four: #1B1E29;
}
:global(::selection) {
@ -88,12 +93,4 @@ import NavHost from "$lib/components/molecules/NavHost.svelte";
:global(::-webkit-scrollbar-thumb:hover) {
background-color: var(--grey-three);
}
:global(::-webkit-scrollbar-track-piece){
display:none;
}
:global(::-webkit-scrollbar-track) {
background: rgba(0, 0, 0, 0.2);
}
</style>

2
src/routes/index.svelte
View File

@ -2,11 +2,13 @@
import IndexDescription from '$lib/components/organisms/IndexDescription.svelte';
import Wave from '$lib/components/atoms/Wave.svelte';
import HeroImage from '$lib/components/atoms/HeroImage.svelte';
import SocialHost from '$lib/components/molecules/SocialHost.svelte';
</script>
<div class="wrapper">
<IndexDescription />
<HeroImage />
<SocialHost />
</div>
<Wave />

BIN
static/embed.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 42 KiB

2
static/logo.svg
View File

@ -2,5 +2,5 @@
<path fill-rule="evenodd" clip-rule="evenodd" d="M47.3571 27.8116C52.2143 25.0064 52.2143 17.9936 47.3571 15.1884L22.7679 0.98728C17.9107 -1.81788 11.8393 1.68858 11.8393 7.2989V11.2962L5.46429 7.61446C3.03572 6.21189 9.23091e-07 7.96511 9.23091e-07 10.7703L0 32.2297C-8.51576e-08 35.0349 3.03571 36.7881 5.46429 35.3855L11.8393 31.7038V35.7011C11.8393 41.3114 17.9107 44.8179 22.7679 42.0127L47.3571 27.8116ZM11.8393 11.2962L11.8393 31.7038L24.0429 24.6558C26.4714 23.2532 26.4714 19.7468 24.0429 18.3442L11.8393 11.2962Z" fill="#FF4151"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M47.3571 27.8116C52.2143 25.0064 52.2143 17.9936 47.3571 15.1884L22.7679 0.98728C17.9107 -1.81788 11.8393 1.68858 11.8393 7.2989V11.2962L5.46429 7.61446C3.03572 6.21189 9.23091e-07 7.96511 9.23091e-07 10.7703L0 32.2297C-8.51576e-08 35.0349 3.03571 36.7881 5.46429 35.3855L11.8393 31.7038V35.7011C11.8393 41.3114 17.9107 44.8179 22.7679 42.0127L47.3571 27.8116ZM11.8393 11.2962L11.8393 31.7038L24.0429 24.6558C26.4714 23.2532 26.4714 19.7468 24.0429 18.3442L11.8393 11.2962Z" fill="#FF4151"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M47.3571 15.1884C52.2143 17.9936 52.2143 25.0064 47.3571 27.8116L22.7679 42.0127C17.9107 44.8179 11.8393 41.3114 11.8393 35.7011V31.7038L24.0429 24.6558C26.4714 23.2532 26.4714 19.7468 24.0429 18.3442L11.8393 11.2962V7.2989C11.8393 1.68858 17.9107 -1.81788 22.7679 0.98728L47.3571 15.1884Z" fill="#FF4151"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M47.3571 15.1884C52.2143 17.9936 52.2143 25.0064 47.3571 27.8116L22.7679 42.0127C17.9107 44.8179 11.8393 41.3114 11.8393 35.7011V31.7038L24.0429 24.6558C26.4714 23.2532 26.4714 19.7468 24.0429 18.3442L11.8393 11.2962V7.2989C11.8393 1.68858 17.9107 -1.81788 22.7679 0.98728L47.3571 15.1884Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M47.3571 15.1884C52.2143 17.9936 52.2143 25.0064 47.3571 27.8116L22.7679 42.0127C17.9107 44.8179 11.8393 41.3114 11.8393 35.7011V31.7038L24.0429 24.6558C26.4714 23.2532 26.4714 19.7468 24.0429 18.3442L11.8393 11.2962V7.2989C11.8393 1.68858 17.9107 -1.81788 22.7679 0.98728L47.3571 15.1884Z" fill="#FFE1E1"/>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

3
static/socials/discord.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="32" height="24" viewBox="0 0 32 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M26.3478 2.32318C24.4079 1.43303 22.3275 0.777215 20.1524 0.4016C20.1128 0.394351 20.0732 0.412467 20.0528 0.4487C19.7853 0.924558 19.4889 1.54535 19.2814 2.03329C16.9419 1.68305 14.6144 1.68305 12.3229 2.03329C12.1154 1.53451 11.8082 0.924558 11.5395 0.4487C11.5191 0.413676 11.4795 0.39556 11.4399 0.4016C9.26599 0.776014 7.18566 1.43183 5.24448 2.32318C5.22768 2.33042 5.21327 2.34251 5.20371 2.3582C1.25776 8.25337 0.176798 14.0036 0.707082 19.6826C0.709481 19.7104 0.725077 19.737 0.746673 19.7539C3.3501 21.6658 5.87196 22.8265 8.347 23.5958C8.38661 23.6079 8.42858 23.5934 8.45378 23.5608C9.03925 22.7613 9.56115 21.9182 10.0086 21.0317C10.035 20.9798 10.0098 20.9182 9.95585 20.8976C9.12804 20.5836 8.33979 20.2007 7.58156 19.766C7.52158 19.7309 7.51678 19.6451 7.57196 19.6041C7.73152 19.4845 7.89112 19.3601 8.04348 19.2345C8.07104 19.2116 8.10945 19.2067 8.14186 19.2212C13.1231 21.4955 18.516 21.4955 23.4385 19.2212C23.4709 19.2055 23.5093 19.2104 23.538 19.2333C23.6904 19.3589 23.85 19.4845 24.0108 19.6041C24.0659 19.6451 24.0623 19.7309 24.0024 19.766C23.2441 20.2092 22.4559 20.5836 21.6269 20.8964C21.5729 20.917 21.5489 20.9798 21.5753 21.0317C22.0324 21.917 22.5543 22.76 23.1289 23.5596C23.1529 23.5934 23.1961 23.6079 23.2357 23.5958C25.7228 22.8265 28.2446 21.6658 30.848 19.7539C30.8708 19.737 30.8852 19.7116 30.8876 19.6838C31.5223 13.1183 29.8247 7.41518 26.3874 2.3594C26.379 2.34251 26.3647 2.33042 26.3478 2.32318ZM10.7525 16.2247C9.25279 16.2247 8.01707 14.8479 8.01707 13.157C8.01707 11.4661 9.22882 10.0892 10.7525 10.0892C12.2881 10.0892 13.5119 11.4781 13.4879 13.157C13.4879 14.8479 12.2761 16.2247 10.7525 16.2247ZM20.8662 16.2247C19.3666 16.2247 18.1309 14.8479 18.1309 13.157C18.1309 11.4661 19.3426 10.0892 20.8662 10.0892C22.4019 10.0892 23.6256 11.4781 23.6017 13.157C23.6017 14.8479 22.4019 16.2247 20.8662 16.2247Z" fill="#D0D0D0"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

3
static/socials/github.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.3129 0.46875C6.20343 0.46875 0 6.63867 0 14.7656C0 21.2637 4.08105 26.8242 9.91028 28.7813C10.6587 28.916 10.9218 28.4531 10.9218 28.0723C10.9218 27.709 10.9042 25.7051 10.9042 24.4746C10.9042 24.4746 6.81149 25.3535 5.95202 22.7285C5.95202 22.7285 5.28548 21.0234 4.32661 20.584C4.32661 20.584 2.9877 19.6641 4.42016 19.6816C4.42016 19.6816 5.87601 19.7988 6.67702 21.1934C7.95746 23.4551 10.1032 22.8047 10.9393 22.418C11.0738 21.4805 11.4538 20.8301 11.8748 20.4434C8.60645 20.0801 5.30887 19.6055 5.30887 13.9688C5.30887 12.3574 5.75323 11.5488 6.68871 10.5176C6.53669 10.1367 6.03972 8.56641 6.84073 6.53906C8.0627 6.1582 10.875 8.12109 10.875 8.12109C12.0444 7.79297 13.3014 7.62305 14.5468 7.62305C15.7921 7.62305 17.0492 7.79297 18.2185 8.12109C18.2185 8.12109 21.0308 6.15234 22.2528 6.53906C23.0538 8.57227 22.5569 10.1367 22.4048 10.5176C23.3403 11.5547 23.9133 12.3633 23.9133 13.9688C23.9133 19.623 20.4696 20.0742 17.2012 20.4434C17.7391 20.9062 18.1952 21.7852 18.1952 23.1621C18.1952 25.1367 18.1776 27.5801 18.1776 28.0605C18.1776 28.4414 18.4466 28.9043 19.1891 28.7695C25.0359 26.8242 29 21.2637 29 14.7656C29 6.63867 22.4224 0.46875 14.3129 0.46875Z" fill="#D0D0D0"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

3
static/socials/reddit.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="30" height="28" viewBox="0 0 30 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M29.6996 14.1953C29.6772 13.5747 29.478 12.9738 29.126 12.4653C28.7741 11.9567 28.2844 11.5621 27.716 11.329C27.1476 11.096 26.5247 11.0344 25.9226 11.1517C25.3204 11.2691 24.7646 11.5603 24.3222 11.9904C21.8456 10.2854 18.9344 9.3434 15.9405 9.27835L17.3556 2.39902L22.0145 3.39123C22.0699 3.91266 22.307 4.39701 22.6832 4.75736C23.0594 5.11771 23.5501 5.33045 24.0672 5.3574C24.5844 5.38434 25.094 5.22373 25.5048 4.90439C25.9155 4.58505 26.2004 4.12789 26.3083 3.61497C26.4163 3.10206 26.3402 2.56698 26.0937 2.10578C25.8472 1.64458 25.4464 1.28746 24.9634 1.09853C24.4804 0.909604 23.9466 0.901232 23.4581 1.07492C22.9695 1.24861 22.558 1.59299 22.2975 2.04624L16.9637 0.965828C16.8765 0.946446 16.7863 0.944792 16.6984 0.960962C16.6106 0.977131 16.5267 1.0108 16.4518 1.06002C16.3769 1.10925 16.3124 1.17304 16.262 1.24771C16.2115 1.32238 16.1763 1.40643 16.1582 1.49501L14.5472 9.14606C11.5164 9.19233 8.56516 10.135 6.05658 11.8581C5.72096 11.5383 5.3207 11.2962 4.88353 11.1486C4.44635 11.001 3.98272 10.9515 3.52476 11.0034C3.06681 11.0554 2.62548 11.2076 2.23136 11.4494C1.83724 11.6913 1.49976 12.017 1.2423 12.4041C0.98484 12.7912 0.813563 13.2303 0.740338 13.6911C0.667112 14.1519 0.693688 14.6233 0.818225 15.0726C0.942761 15.522 1.16228 15.9385 1.46157 16.2934C1.76086 16.6483 2.13276 16.933 2.55149 17.1278C2.52698 17.4508 2.52698 17.7751 2.55149 18.098C2.55149 23.037 8.23365 27.05 15.2438 27.05C22.254 27.05 27.9361 23.037 27.9361 18.098C27.9607 17.7751 27.9607 17.4508 27.9361 17.1278C28.4734 16.8574 28.9241 16.4385 29.2361 15.9196C29.5482 15.4006 29.7088 14.8028 29.6996 14.1953ZM7.92886 16.4002C7.92886 15.9641 8.05654 15.5378 8.29576 15.1752C8.53498 14.8126 8.875 14.53 9.2728 14.3631C9.67061 14.1963 10.1083 14.1526 10.5307 14.2377C10.953 14.3228 11.3409 14.5327 11.6454 14.8411C11.9498 15.1495 12.1572 15.5424 12.2412 15.9701C12.3252 16.3978 12.2821 16.8411 12.1173 17.244C11.9525 17.6469 11.6735 17.9913 11.3154 18.2335C10.9574 18.4758 10.5365 18.6051 10.1059 18.6051C9.82003 18.6051 9.53694 18.5481 9.2728 18.4373C9.00867 18.3265 8.76867 18.1641 8.56651 17.9593C8.36435 17.7546 8.20399 17.5115 8.09458 17.244C7.98517 16.9765 7.92886 16.6898 7.92886 16.4002ZM20.5776 22.4637C19.0331 23.6426 17.1327 24.2426 15.2003 24.1615C13.2679 24.2426 11.3675 23.6426 9.82291 22.4637C9.73034 22.3495 9.68303 22.2045 9.69018 22.0568C9.69734 21.9092 9.75846 21.7696 9.86164 21.6651C9.96483 21.5606 10.1027 21.4987 10.2485 21.4914C10.3942 21.4842 10.5374 21.5321 10.6502 21.6259C11.9591 22.5982 13.5568 23.0883 15.1785 23.015C16.8022 23.1044 18.4073 22.6299 19.7286 21.67C19.8441 21.5559 19.9995 21.493 20.1608 21.4951C20.2407 21.4961 20.3195 21.5131 20.3929 21.545C20.4663 21.5769 20.5328 21.6231 20.5885 21.681C20.6443 21.7389 20.6882 21.8074 20.7178 21.8825C20.7475 21.9576 20.7622 22.0379 20.7612 22.1187C20.7602 22.1996 20.7434 22.2795 20.712 22.3538C20.6805 22.4281 20.6348 22.4955 20.5776 22.5519V22.4637ZM20.1858 18.6933C19.7552 18.6933 19.3343 18.564 18.9763 18.3217C18.6182 18.0795 18.3392 17.7351 18.1744 17.3322C18.0096 16.9293 17.9665 16.486 18.0505 16.0583C18.1345 15.6305 18.3419 15.2377 18.6463 14.9293C18.9508 14.6209 19.3387 14.4109 19.761 14.3259C20.1834 14.2408 20.6211 14.2845 21.0189 14.4513C21.4167 14.6182 21.7567 14.9008 21.9959 15.2634C22.2352 15.626 22.3628 16.0523 22.3628 16.4884C22.3747 16.7872 22.3264 17.0852 22.2209 17.3645C22.1154 17.6438 21.955 17.8984 21.7493 18.1129C21.5436 18.3274 21.297 18.4972 21.0245 18.6122C20.752 18.7271 20.4592 18.7848 20.164 18.7815L20.1858 18.6933Z" fill="#D0D0D0"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

3
static/socials/telegram.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="26" height="24" viewBox="0 0 26 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.459237 11.5359L6.45016 13.7719L8.76901 21.2293C8.91738 21.7069 9.50143 21.8835 9.88909 21.5665L13.2285 18.8442C13.5786 18.5589 14.0772 18.5447 14.443 18.8103L20.4662 23.1832C20.8808 23.4846 21.4684 23.2574 21.5724 22.7563L25.9847 1.53242C26.0982 0.98503 25.5603 0.528383 25.0391 0.72997L0.452217 10.2149C-0.154537 10.4489 -0.14925 11.3079 0.459237 11.5359ZM8.3953 12.5816L20.1038 5.37036C20.3142 5.24114 20.5307 5.52567 20.35 5.69328L10.6871 14.6754C10.3475 14.9916 10.1284 15.4147 10.0663 15.8739L9.73716 18.3132C9.69357 18.6389 9.23606 18.6713 9.14618 18.3561L7.88024 13.9079C7.73525 13.4005 7.94654 12.8586 8.3953 12.5816Z" fill="#D0D0D0"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 759 B