ReVanced/revanced-website
1
0
Fork 0
mirror of https://github.com/revanced/revanced-website.git synced 2025-06-12 21:27:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: generate doc pages from markup

Browse Source
This commit is contained in:
Ax333l
2022-10-25 10:17:29 +02:00
parent 0503e81fb0
commit 214ce4934d
22 changed files with 911 additions and 176 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/routes/docs/+layout.server.ts Normal file
View File

@ -0,0 +1,10 @@
import type { PageServerLoad } from './$types';
import { index_content } from '$lib/documentation.server';
// The load function here used to get data from a json file created by a (prerendered) server route.
// This was because we could not prerender the documentation route before.
// If you can no longer prerender the docs, then you are going to have to move the load functions here to a prerendered server route like before and fetch them here.
export const prerender = true;
export const load: PageServerLoad = () => ({ tree: index_content() });

34
src/routes/docs/+layout.svelte Normal file
View File

@ -0,0 +1,34 @@
<script lang="ts">
import type { PageData } from './$types';
import DocsNavTree from '$lib/components/molecules/DocsNavTree.svelte';
import { fly } from 'svelte/transition';
import { quintOut } from 'svelte/easing';
export let data: PageData;
</script>
<section id="doc-section-main" in:fly={{ y: 10, easing: quintOut, duration: 700 }}>
<div class="menu">
<DocsNavTree tree={data.tree} />
</div>
<slot></slot>
</section>
<style lang="scss">
.menu {
padding: 90px 15px 0px 15px;
display: flex;
flex-direction: column;
gap: 1rem;
}
#doc-section-main {
display: grid;
grid-template-columns: 300px 3fr;
height: 100vh;
width: 100%;
}
</style>

126
src/routes/docs/+page.svelte
View File

@ -1,126 +0,0 @@
<script>
import { fly } from 'svelte/transition';
import { quintOut } from 'svelte/easing';
import Button from '$lib/components/atoms/Button.svelte';
</script>
<svelte:head>
<title>ReVanced | Docs</title>
<meta content="ReVanced | Docs" name="og:title" />
<meta content="ReVanced | Docs" name="twitter:title" />
</svelte:head>
<main in:fly={{ y: 10, easing: quintOut, duration: 700 }}>
<div class="menu">
<div class="doc-section-selected">
<h3>Prerequisites</h3>
</div>
<div class="doc-section">
<h3>Using ReVanced CLI and installiing ReVanced</h3>
</div>
</div>
<div class="content">
<h6>docs/prerequisites</h6>
<br />
<h4>Requirements</h4>
<h5>
<ul>
<li>ADB</li>
<li>x86/x86_64 host architecture</li>
<li>Zulu JDK 17</li>
<li>Latest Android SDK if you plan to build the integrations from the source</li>
<li>
The APK file you want to patch (e.g. YouTube v17.36.37 or YouTube Music v5.23.50). If you
want to mount patched applications as root, make sure the same version is installed on
your device.
</li>
<li>
You can continue by either building everything from source or downloading the prebuilt
packages.
</li>
</ul>
<br />
You can continue by either
<a href="https://github.com/revanced/revanced-documentation/wiki/Building-from-source"
>building everything from source</a
>
or
<a
href="https://github.com/revanced/revanced-documentation/wiki/Downloading-prebuilt-packages"
>downloading the prebuilt packages</a
>.
</h5>
<br />
<br />
<div class="button-wrapper">
Using ReVanced CLI and installing ReVanced (Docs will be overhauled anyways)
</div>
</div>
</main>
<style>
main {
display: grid;
grid-template-columns: 300px 3fr;
}
a {
text-decoration: none;
color: var(--white);
border-bottom: 1.5px solid var(--accent-color);
padding: 0px 5px;
transition: all 0.4s var(--bezier-one);
}
a:hover {
background-color: var(--accent-color);
border-radius: 6px;
color: var(--grey-four);
}
.menu,
.content {
height: 100vh;
width: 100%;
}
.menu {
padding: 90px 15px 0px 15px;
display: flex;
flex-direction: column;
gap: 1rem;
}
.content {
padding: 100px 30px 0px 30px;
}
.doc-section {
background-color: var(--grey-one);
border-radius: 12px;
padding: 15px 20px;
}
.doc-section-selected {
background-color: var(--grey-three);
border-radius: 12px;
padding: 15px 20px;
}
.doc-section-selected > h3 {
color: var(--white);
}
.button-wrapper {
width: 30rem;
}
ul {
padding-left: 2rem;
}
h4 {
margin-bottom: 0.5rem;
}
</style>

17
src/routes/docs/[...slug]/+page.server.ts Normal file
View File

@ -0,0 +1,17 @@
import type { PageServerLoad } from './$types';
import { error } from '@sveltejs/kit';
import { get } from '$lib/documentation.server';
// See also: ../+layout.server.ts
export const prerender = true;
export const load: PageServerLoad = ({ params }) => {
const document = get(params.slug);
if (document === null) {
error
throw error(404);
}
return document;
}

22
src/routes/docs/[...slug]/+page.svelte Normal file
View File

@ -0,0 +1,22 @@
<script lang="ts">
import type { PageData } from './$types';
import '$lib/documentation.scss';
// Data here comes from a trusted source.
// CSS comes from the layout.
export let data: PageData;
</script>
<svelte:head>
<title>ReVanced | Docs</title>
<meta content="ReVanced | Docs" name="og:title" />
<meta content="ReVanced | Docs" name="twitter:title" />
</svelte:head>
<div id="markup-content">
<h1 class="title">{data.title}</h1>
{@html data.content}
</div>