completed sidebar base
This commit is contained in:
@@ -2,6 +2,10 @@
|
||||
const { frontmatter } = Astro.props;
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
const title = frontmatter.title + "| Docs";
|
||||
const unsortedDocs = await Astro.glob("../pages/docs/*/*.mdx");
|
||||
const docs = unsortedDocs
|
||||
.sort((a, b) => +new Date(b.frontmatter.date) - +new Date(a.frontmatter.date))
|
||||
.filter((doc) => doc.frontmatter.repo === frontmatter.repo);
|
||||
---
|
||||
|
||||
<Layout
|
||||
@@ -20,8 +24,16 @@ const title = frontmatter.title + "| Docs";
|
||||
<hr />
|
||||
<br />
|
||||
<slot />
|
||||
<div class="sidebar">
|
||||
<a href={"/docs/" + frontmatter.repo}>{frontmatter.repo}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sidebar">
|
||||
<a href={"/docs/" + frontmatter.repo}>Home</a><br />
|
||||
{
|
||||
docs.map((page) => (
|
||||
<>
|
||||
<a href={page.url}>{page.frontmatter.title}</a>
|
||||
<br />
|
||||
</>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
</Layout>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
interface Props {
|
||||
title: string;
|
||||
description: string;
|
||||
title: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
const { title } = Astro.props;
|
||||
@@ -17,20 +17,22 @@ import { ViewTransitions } from "astro:transitions";
|
||||
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="darkreader-lock" />
|
||||
<meta name="description" content={description} />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>{title} | vaporvee's Website</title>
|
||||
<ViewTransitions />
|
||||
</head>
|
||||
<body>
|
||||
<Navbar />
|
||||
<slot />
|
||||
<br />
|
||||
<Footer />
|
||||
</body>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="darkreader-lock" />
|
||||
<meta name="description" content={description} />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>{title} | vaporvee's Website</title>
|
||||
<ViewTransitions />
|
||||
</head>
|
||||
<body>
|
||||
<Navbar />
|
||||
<main>
|
||||
<slot />
|
||||
</main>
|
||||
<br />
|
||||
<Footer />
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
import "../styles/docs.scss";
|
||||
const unsortedDocs = await Astro.glob("./docs/*/index.mdx");
|
||||
const docs = unsortedDocs.sort(
|
||||
(a, b) => +new Date(b.frontmatter.date) - +new Date(a.frontmatter.date)
|
||||
@@ -13,7 +12,7 @@ const docs = unsortedDocs.sort(
|
||||
>
|
||||
<main>
|
||||
<div class="content">
|
||||
<h1>Docs</h1>
|
||||
<h1 style="text-align: center;">Docs</h1>
|
||||
{
|
||||
docs.map((doc) => (
|
||||
<div class="second-content">
|
||||
@@ -31,7 +30,7 @@ const docs = unsortedDocs.sort(
|
||||
{doc.frontmatter.has_thumbnail ? (
|
||||
<a href={doc.url}>
|
||||
<img
|
||||
width="800vh"
|
||||
width="100%"
|
||||
src={"/img/docs/thumbnails/" + doc.frontmatter.repo + ".webp"}
|
||||
/>
|
||||
</a>
|
||||
|
||||
@@ -74,7 +74,7 @@ func _ready():
|
||||
|
||||
**Then it will look similar to this:**
|
||||
|
||||
<img src="https://raw.githubusercontent.com/vaporvee/discord-sdk-godot/main/project/assets/ActivityPreview.svg" />
|
||||
<img width="30%" src="https://raw.githubusercontent.com/vaporvee/discord-sdk-godot/main/project/assets/ActivityPreview.svg" />
|
||||
|
||||
[**Try a built demo**](https://github.com/vaporvee/discord-sdk-godot/releases/latest/download/Demo-Export.zip)<br /><br />
|
||||
|
||||
|
||||
@@ -6,48 +6,49 @@ const yannikAge = new Date().getFullYear() - 2004; // 31/12/2003
|
||||
---
|
||||
|
||||
<Layout
|
||||
title="Home"
|
||||
description="This is my personal website with my projects, docs and other useful stuff."
|
||||
title="Home"
|
||||
description="This is my personal website with my projects, docs and other useful stuff."
|
||||
>
|
||||
<main>
|
||||
<div class="home-main-box">
|
||||
<div class="home-title-box">
|
||||
<h1 class="home-title" style="font-size: 6vw;">vaporvee</h1>
|
||||
<h2
|
||||
class="home-title"
|
||||
style="font-size: 2vw; margin-top: -10px; margin-bottom: 12vh;"
|
||||
>
|
||||
Making video games
|
||||
</h2>
|
||||
<img
|
||||
class="using-engines"
|
||||
src="/using_engines.svg"
|
||||
alt="engines I'm using"
|
||||
/>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p>
|
||||
Hello my name is <b>Yannik</b>!<br />
|
||||
I’m a {yannikAge} year old <b>Game Developer</b> living <b
|
||||
>in Germany</b
|
||||
>.<br />
|
||||
I mostly code in C++, Godot Engine's GDScript and C#.<br />
|
||||
I am mostly self taught but i cant really say when i began to
|
||||
learn game developement.<br />
|
||||
Currently i already work at a game studio and i also have my
|
||||
own game side projects and tools.<br />
|
||||
This website will mostly have <a href="/docs">docs</a>, <a
|
||||
href="/tutorials">tutorials</a
|
||||
>, and showcasing of my <a href="/projects">projects</a>.
|
||||
Maybe also some other stuff all around the creative process
|
||||
of game developement or completely unrelated stuff like
|
||||
cooking recepies in my <a href="/blog">blog</a> ;)<br />
|
||||
<i style="font-size: 8px;"
|
||||
>(this website is getting rewritten and is not looking
|
||||
good on mobile devices yet)</i
|
||||
>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<div class="lines">
|
||||
<div class="home-main-box">
|
||||
<div class="home-title-box">
|
||||
<h1 class="home-title" style="font-size: 6vw;">vaporvee</h1>
|
||||
<h2
|
||||
class="home-title"
|
||||
style="font-size: 2vw; margin-top: -10px; margin-bottom: 12vh;"
|
||||
>
|
||||
Making video games
|
||||
</h2>
|
||||
<img
|
||||
class="using-engines"
|
||||
src="/using_engines.svg"
|
||||
alt="engines I'm using"
|
||||
/>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p>
|
||||
Hello my name is <b>Yannik</b>!<br />
|
||||
I’m a {yannikAge} year old <b>Game Developer</b> living <b
|
||||
>in Germany</b
|
||||
>.<br />
|
||||
I mostly code in C++, Godot Engine's GDScript and C#.<br />
|
||||
I am mostly self taught but i cant really say when i began to learn game
|
||||
developement.<br />
|
||||
Currently i already work at a game studio and i also have my own game side
|
||||
projects and tools.<br />
|
||||
This website will mostly have <a href="/docs">docs</a>, <a
|
||||
href="/tutorials">tutorials</a
|
||||
>, and showcasing of my <a href="/projects">projects</a>. Maybe also
|
||||
some other stuff all around the creative process of game developement
|
||||
or completely unrelated stuff like cooking recepies in my <a
|
||||
href="/blog">blog</a
|
||||
> ;)<br />
|
||||
<i style="font-size: 8px;"
|
||||
>(this website is getting rewritten and is not looking good on
|
||||
mobile devices yet)</i
|
||||
>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
|
||||
@@ -8,6 +8,7 @@
|
||||
border: var(--callout-border);
|
||||
border-radius: var(--callout-radius);
|
||||
background: var(--callout-background);
|
||||
margin: 1vh;
|
||||
}
|
||||
|
||||
.callout code,
|
||||
|
||||
@@ -1,5 +0,0 @@
|
||||
.content{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
@@ -1,4 +1,10 @@
|
||||
main {
|
||||
main{
|
||||
display: unset;
|
||||
flex-direction: unset;
|
||||
align-items: unset;
|
||||
}
|
||||
|
||||
.lines {
|
||||
background-image: url("/diagonal_lines_home.png");
|
||||
background-size: cover;
|
||||
background-repeat: repeat;
|
||||
|
||||
@@ -16,32 +16,39 @@ h1 {
|
||||
font-family: "Tanker-Regular", "Arial";
|
||||
}
|
||||
|
||||
main{
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-self: center;
|
||||
background-color: $highlight-primary;
|
||||
border-radius: 25px;
|
||||
border: 1px solid lighten($highlight-primary, 16%);
|
||||
box-shadow: 0px 4px 4px 0px #00000040;
|
||||
padding: 2vw;
|
||||
margin-inline: 10vw;
|
||||
width: 60vw;
|
||||
margin-bottom: 11vh;
|
||||
}
|
||||
.second-content {
|
||||
align-self: center;
|
||||
text-align: center;
|
||||
$second-content-clr: #6e6e6e40;
|
||||
background-color: $second-content-clr;
|
||||
border-radius: 25px;
|
||||
border: 1px solid lighten($second-content-clr, 16%);
|
||||
width: 80vh;
|
||||
padding: 1vh;
|
||||
width: 42vw;
|
||||
padding: 2vh;
|
||||
margin-inline: 10vw;
|
||||
margin-bottom: 11vh;
|
||||
}
|
||||
|
||||
.sidebar{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
margin-top: 10.5vh;
|
||||
}
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user