CrispyPin/crispypin.cc_old
1
0
Fork 0
mirror of https://github.com/CrispyPin/crispypin.cc.git synced 2025-02-22 04:33:59 +01:00
Code Issues Projects Releases Packages Wiki Activity

convert all indentation to tabs

Browse source
This commit is contained in:
Crispy 2022-01-18 18:04:48 +01:00
parent 959b78d7af
commit aff25868d2
11 changed files with 315 additions and 315 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
docs/.well-known/matrix/client
View file

@ -1,5 +1,5 @@
{
"m.homeserver": {
"base_url": "https://matrix.crispypin.cc"
}
"m.homeserver": {
"base_url": "https://matrix.crispypin.cc"
}
}

136
docs/fractals/index.html
View file

@ -1,80 +1,80 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/style.css">
<link rel="icon" type="image/x-icon" href="/icons/favicon.png">
<title>CrispyPin.cc - Fractals</title>
<title>CrispyPin.cc - Fractals</title>
</head>
<body>
<header>
<a href="/" id="logo"><img src="/logo.png" alt=""></a>
</header>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/games/">Games</a></li>
<li><a href="/fractals/">Fractals</a></li>
<li><a href="/blender/">Blender stuff</a></li>
<li><a href="https://crispypin.github.io/gol-wallpaper">Game of Life</a></li>
</ul>
</nav>
<main>
<h1>Fractals</h1>
<p>This page is a collection of fractals renderers I made in JS for a school assignment back in 2020. Please note that I don't use JS anymore.</p>
<h2>Fractal tree</h2>
<p>The splitting angle is defined by the mouses x position. The number of iterations is set in the first input field (default is 12). Each branch is slightly smaller than its parent, the factor is the second input field. Click the canvas to pause/resume the image.</p>
<div class="demo-render" id="fractal-tree">
<canvas></canvas>
<div class="controlbar">
<input type="number" min=6 max=15 value=12 onchange="fractalTree.setIter(value)">
<input type="number" min=0.65 max=1 step=0.025 value=0.75 onchange="fractalTree.setMod(value)">
</div>
</div>
<h2>Mandelbrot set</h2>
<a href="https://en.wikipedia.org/wiki/Mandelbrot_set">Wikipedia page</a>
<p>You can click to zoom and set the iteration count in the input field.</p>
<div class="demo-render" id="mandelbrot">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="mandelbrot.reset()">Reset</button>
<input type="number" min=1 max=1000 value=256 onchange="mandelbrot.setIter(value)">
</div>
</div>
<h2>Multibrot set</h2>
<a href="https://en.wikipedia.org/wiki/Multibrot_set">Wikipedia page</a>
<p>You can click to zoom and set the iteration count in the input field. The second input controls the exponent. This is quite slow to render.</p>
<div class="demo-render" id="multibrot">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="multibrot.reset()">Render</button>
<input type="number" min=1 max=1000 value=256 onchange="multibrot.setIter(value)">
<input type="number" min=0 max=32 step=0.1 value=4 onchange="multibrot.setPower(value)">
</div>
</div>
<h2>Julia set</h2>
<a href="https://en.wikipedia.org/wiki/Julia_set">Wikipedia page</a>
<p>You can set the iteration count in the input field.</p>
<div class="demo-render" id="julia-set">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="juliaSet.reset()">Reset</button>
<input type="number" min=8 max=1000 value=80 step=8 onchange="juliaSet.setIter(value)">
</div>
</div>
<script src="fractals.js"></script>
</main>
<footer>
<p>crispypin.cc</p>
<div class="links">
<a href="https://github.com/CrispyPin"><img src="/icons/github.png" alt="" width=32px> </a>
<a href="https://crispypin.itch.io/"><img src="/icons/itchio.svg" alt="" width=32px> </a>
<a href="https://twitter.com/CrispyPin42"><img src="/icons/twitter.png" alt="" width=32px> </a>
<a href="https://www.youtube.com/channel/UCFW1QTsbFgux8VrduCz_ckQ"><img src="/icons/youtube.png" alt="" width=32px> </a>
</div>
</footer>
<header>
<a href="/" id="logo"><img src="/logo.png" alt=""></a>
</header>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/games/">Games</a></li>
<li><a href="/fractals/">Fractals</a></li>
<li><a href="/blender/">Blender stuff</a></li>
<li><a href="https://crispypin.github.io/gol-wallpaper">Game of Life</a></li>
</ul>
</nav>
<main>
<h1>Fractals</h1>
<p>This page is a collection of fractals renderers I made in JS for a school assignment back in 2020. Please note that I don't use JS anymore.</p>
<h2>Fractal tree</h2>
<p>The splitting angle is defined by the mouses x position. The number of iterations is set in the first input field (default is 12). Each branch is slightly smaller than its parent, the factor is the second input field. Click the canvas to pause/resume the image.</p>
<div class="demo-render" id="fractal-tree">
<canvas></canvas>
<div class="controlbar">
<input type="number" min=6 max=15 value=12 onchange="fractalTree.setIter(value)">
<input type="number" min=0.65 max=1 step=0.025 value=0.75 onchange="fractalTree.setMod(value)">
</div>
</div>
<h2>Mandelbrot set</h2>
<a href="https://en.wikipedia.org/wiki/Mandelbrot_set">Wikipedia page</a>
<p>You can click to zoom and set the iteration count in the input field.</p>
<div class="demo-render" id="mandelbrot">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="mandelbrot.reset()">Reset</button>
<input type="number" min=1 max=1000 value=256 onchange="mandelbrot.setIter(value)">
</div>
</div>
<h2>Multibrot set</h2>
<a href="https://en.wikipedia.org/wiki/Multibrot_set">Wikipedia page</a>
<p>You can click to zoom and set the iteration count in the input field. The second input controls the exponent. This is quite slow to render.</p>
<div class="demo-render" id="multibrot">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="multibrot.reset()">Render</button>
<input type="number" min=1 max=1000 value=256 onchange="multibrot.setIter(value)">
<input type="number" min=0 max=32 step=0.1 value=4 onchange="multibrot.setPower(value)">
</div>
</div>
<h2>Julia set</h2>
<a href="https://en.wikipedia.org/wiki/Julia_set">Wikipedia page</a>
<p>You can set the iteration count in the input field.</p>
<div class="demo-render" id="julia-set">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="juliaSet.reset()">Reset</button>
<input type="number" min=8 max=1000 value=80 step=8 onchange="juliaSet.setIter(value)">
</div>
</div>
<script src="fractals.js"></script>
</main>
<footer>
<p>Copyright © 2022 - CrispyPin</p>
<div class="links">
<a href="https://github.com/CrispyPin"><img src="/icons/github.png" alt="" width=32px></a>
<a href="https://crispypin.itch.io/"><img src="/icons/itchio.svg" alt="" width=32px></a>
<a href="https://twitter.com/CrispyPin42"><img src="/icons/twitter.png" alt="" width=32px></a>
<a href="https://www.youtube.com/channel/UCFW1QTsbFgux8VrduCz_ckQ"><img src="/icons/youtube.png" alt="" width=32px></a>
</div>
</footer>
</body>
</html>

54
docs/index.html
View file

@ -1,39 +1,39 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/style.css">
<link rel="icon" type="image/x-icon" href="/icons/favicon.png">
<title>CrispyPin.cc</title>
<title>CrispyPin.cc</title>
</head>
<body>
<header>
<a href="/" id="logo"><img src="/logo.png" alt=""></a>
</header>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/games/">Games</a></li>
<li><a href="/fractals/">Fractals</a></li>
<li><a href="/blender/">Blender stuff</a></li>
<li><a href="https://crispypin.github.io/gol-wallpaper">Game of Life</a></li>
</ul>
</nav>
<main>
<h1>Homepage</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Earum exercitationem quod laudantium neque. Dolor qui magnam debitis repellendus assumenda tenetur ab aliquam ea sit in harum facere neque ad nemo vel nesciunt distinctio totam, cupiditate, deleniti nam voluptas quia aperiam.</p>
</main>
<footer>
<p>crispypin.cc</p>
<div class="links">
<a href="https://github.com/CrispyPin"><img src="/icons/github.png" alt="" width=32px> </a>
<a href="https://crispypin.itch.io/"><img src="/icons/itchio.svg" alt="" width=32px> </a>
<a href="https://twitter.com/CrispyPin42"><img src="/icons/twitter.png" alt="" width=32px> </a>
<a href="https://www.youtube.com/channel/UCFW1QTsbFgux8VrduCz_ckQ"><img src="/icons/youtube.png" alt="" width=32px> </a>
</div>
</footer>
<header>
<a href="/" id="logo"><img src="/logo.png" alt=""></a>
</header>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/games/">Games</a></li>
<li><a href="/fractals/">Fractals</a></li>
<li><a href="/blender/">Blender stuff</a></li>
<li><a href="https://crispypin.github.io/gol-wallpaper">Game of Life</a></li>
</ul>
</nav>
<main>
<h1>Homepage</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Earum exercitationem quod laudantium neque. Dolor qui magnam debitis repellendus assumenda tenetur ab aliquam ea sit in harum facere neque ad nemo vel nesciunt distinctio totam, cupiditate, deleniti nam voluptas quia aperiam.</p>
</main>
<footer>
<p>Copyright © 2022 - CrispyPin</p>
<div class="links">
<a href="https://github.com/CrispyPin"><img src="/icons/github.png" alt="" width=32px></a>
<a href="https://crispypin.itch.io/"><img src="/icons/itchio.svg" alt="" width=32px></a>
<a href="https://twitter.com/CrispyPin42"><img src="/icons/twitter.png" alt="" width=32px></a>
<a href="https://www.youtube.com/channel/UCFW1QTsbFgux8VrduCz_ckQ"><img src="/icons/youtube.png" alt="" width=32px></a>
</div>
</footer>
</body>
</html>

2
docs/style.css.map
View file

@ -1,6 +1,6 @@
{
"version": 3,
"mappings": "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",
"mappings": "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",
"sources": [
"style.scss"
],

274
docs/style.scss
View file

@ -10,171 +10,171 @@ $main-color: #cff;
body {
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
background-color: $main-bg;
color: $main-color;
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
background-color: $main-bg;
color: $main-color;
display: grid;
grid-template-rows: 50px auto 1fr auto;
display: grid;
grid-template-rows: 50px auto 1fr auto;
grid-template-columns: 20px 1fr 20px;
margin: 0;
min-height: 100vh;
grid-template-columns: 20px 1fr 20px;
margin: 0;
min-height: 100vh;
}
a:visited {
color: #b8f;
color: #b8f;
}
nav {
grid-column: 1 / -1;
ul {
list-style-type: none;
margin: 0;
display: grid;
padding: 5px 25px;
grid-gap: 5px;
grid-template-columns: repeat(auto-fill, minmax(175px, auto));
}
li {
@extend .clickable;
padding: 8px;
}
a {
font-size: 24px;
color: #000;
text-decoration: none;
display: block;
text-align: center;
&:visited {
color: #000;
}
}
grid-column: 1 / -1;
ul {
list-style-type: none;
margin: 0;
display: grid;
padding: 5px 25px;
grid-gap: 5px;
grid-template-columns: repeat(auto-fill, minmax(175px, auto));
}
li {
@extend .clickable;
padding: 8px;
}
a {
font-size: 24px;
color: #000;
text-decoration: none;
display: block;
text-align: center;
&:visited {
color: #000;
}
}
}
header {
grid-column: 1 / -1;
background-color: $main-bg;
padding: 0;
h1 {
font-size: 40px;
margin: 0;
}
grid-column: 1 / -1;
background-color: $main-bg;
padding: 0;
h1 {
font-size: 40px;
margin: 0;
}
}
footer {
grid-column: 1 / -1;
margin-top: 5px;
margin-bottom: 10px;
text-align: center;
p {
margin: 5px;
}
grid-column: 1 / -1;
margin-top: 5px;
margin-bottom: 10px;
text-align: center;
p {
margin: 5px;
}
}
main {
padding: 0 20px;
grid-column: 2 / -2;
background-color: $main-page-bg;
padding: 0 20px;
grid-column: 2 / -2;
background-color: $main-page-bg;
}
.demo-render {
margin: 20px;
width: min-content;
background-color: #000;
margin: 20px;
width: min-content;
background-color: #000;
}
.controlbar {
background-color: $main-bg;
padding: 2px 5px;
height: max-content;
display: flex;
justify-content: space-evenly;
align-content: stretch;
flex-wrap: wrap;
button, input {
@extend .clickable;
padding: 4px 6px;
height: 25px;
border: 1px solid #000;
border: 0;
cursor: pointer;
flex-grow: 1;
margin: 2px;
}
.slider {
-webkit-appearance: none;
-moz-appearance: none;
outline: none;
border-radius: 0;
height: 25px;
padding: 0;
margin: 2px;
cursor: pointer;
&::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
border-radius: 1px;
width: 25px;
height: 25px;
background-color: $main-item-active;
margin: 0;
border-radius: 0;
border: 1px solid #000;
}
&::-moz-range-thumb {
/*TODO make this look the same as on chrome*/
-moz-appearance: none;
width: 25px;
height: 100%;
background-color: $main-item-active;
margin: 0;
padding: 0;
border-radius: 0;
border: 1px solid #000;
}
}
label {
background-color: $main-bg;
color: #fb8;
margin: 2px;
font-family: 'Consolas', 'Courier New', Courier, monospace;
}
.play-button {
flex-basis: 35%;
}
background-color: $main-bg;
padding: 2px 5px;
height: max-content;
display: flex;
justify-content: space-evenly;
align-content: stretch;
flex-wrap: wrap;
button, input {
@extend .clickable;
padding: 4px 6px;
height: 25px;
border: 1px solid #000;
border: 0;
cursor: pointer;
flex-grow: 1;
margin: 2px;
}
.slider {
-webkit-appearance: none;
-moz-appearance: none;
outline: none;
border-radius: 0;
height: 25px;
padding: 0;
margin: 2px;
cursor: pointer;
&::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
border-radius: 1px;
width: 25px;
height: 25px;
background-color: $main-item-active;
margin: 0;
border-radius: 0;
border: 1px solid #000;
}
&::-moz-range-thumb {
/*TODO make this look the same as on chrome*/
-moz-appearance: none;
width: 25px;
height: 100%;
background-color: $main-item-active;
margin: 0;
padding: 0;
border-radius: 0;
border: 1px solid #000;
}
}
label {
background-color: $main-bg;
color: #fb8;
margin: 2px;
font-family: 'Consolas', 'Courier New', Courier, monospace;
}
.play-button {
flex-basis: 35%;
}
}
.clickable {
border-radius: 4px;
background-color: $main-item;
&:hover {
background-color: $main-item-hover;
}
&:active {
background-color: $main-item-active;
}
&:disabled {
background-color: $main-item-disabled;
text-decoration: line-through;
color: #000;
cursor: default;
}
border-radius: 4px;
background-color: $main-item;
&:hover {
background-color: $main-item-hover;
}
&:active {
background-color: $main-item-active;
}
&:disabled {
background-color: $main-item-disabled;
text-decoration: line-through;
color: #000;
cursor: default;
}
}
.scroll-reset {
@extend .clickable;
position: fixed;
right: 20px;
bottom: 20px;
width: 40px;
height: 40px;
background-image: url("uparrow.png");
cursor: pointer;
@extend .clickable;
position: fixed;
right: 20px;
bottom: 20px;
width: 40px;
height: 40px;
background-image: url("uparrow.png");
cursor: pointer;
}

BIN
docs/uparrow.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 261 B

98
pages/fractals/index.html
View file

@ -1,56 +1,56 @@
<!DOCTYPE html>
<html lang="en">
<head>
<include meta.html/>
<title>CrispyPin.cc - Fractals</title>
<include meta.html/>
<title>CrispyPin.cc - Fractals</title>
</head>
<body>
<include header.html/>
<main>
<h1>Fractals</h1>
<p>This page is a collection of fractals renderers I made in JS for a school assignment back in 2020. Please note that I don't use JS anymore.</p>
<h2>Fractal tree</h2>
<p>The splitting angle is defined by the mouses x position. The number of iterations is set in the first input field (default is 12). Each branch is slightly smaller than its parent, the factor is the second input field. Click the canvas to pause/resume the image.</p>
<div class="demo-render" id="fractal-tree">
<canvas></canvas>
<div class="controlbar">
<input type="number" min=6 max=15 value=12 onchange="fractalTree.setIter(value)">
<input type="number" min=0.65 max=1 step=0.025 value=0.75 onchange="fractalTree.setMod(value)">
</div>
</div>
<h2>Mandelbrot set</h2>
<a href="https://en.wikipedia.org/wiki/Mandelbrot_set">Wikipedia page</a>
<p>You can click to zoom and set the iteration count in the input field.</p>
<div class="demo-render" id="mandelbrot">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="mandelbrot.reset()">Reset</button>
<input type="number" min=1 max=1000 value=256 onchange="mandelbrot.setIter(value)">
</div>
</div>
<h2>Multibrot set</h2>
<a href="https://en.wikipedia.org/wiki/Multibrot_set">Wikipedia page</a>
<p>You can click to zoom and set the iteration count in the input field. The second input controls the exponent. This is quite slow to render.</p>
<div class="demo-render" id="multibrot">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="multibrot.reset()">Render</button>
<input type="number" min=1 max=1000 value=256 onchange="multibrot.setIter(value)">
<input type="number" min=0 max=32 step=0.1 value=4 onchange="multibrot.setPower(value)">
</div>
</div>
<h2>Julia set</h2>
<a href="https://en.wikipedia.org/wiki/Julia_set">Wikipedia page</a>
<p>You can set the iteration count in the input field.</p>
<div class="demo-render" id="julia-set">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="juliaSet.reset()">Reset</button>
<input type="number" min=8 max=1000 value=80 step=8 onchange="juliaSet.setIter(value)">
</div>
</div>
<script src="fractals.js"></script>
</main>
<include footer.html/>
<include header.html/>
<main>
<h1>Fractals</h1>
<p>This page is a collection of fractals renderers I made in JS for a school assignment back in 2020. Please note that I don't use JS anymore.</p>
<h2>Fractal tree</h2>
<p>The splitting angle is defined by the mouses x position. The number of iterations is set in the first input field (default is 12). Each branch is slightly smaller than its parent, the factor is the second input field. Click the canvas to pause/resume the image.</p>
<div class="demo-render" id="fractal-tree">
<canvas></canvas>
<div class="controlbar">
<input type="number" min=6 max=15 value=12 onchange="fractalTree.setIter(value)">
<input type="number" min=0.65 max=1 step=0.025 value=0.75 onchange="fractalTree.setMod(value)">
</div>
</div>
<h2>Mandelbrot set</h2>
<a href="https://en.wikipedia.org/wiki/Mandelbrot_set">Wikipedia page</a>
<p>You can click to zoom and set the iteration count in the input field.</p>
<div class="demo-render" id="mandelbrot">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="mandelbrot.reset()">Reset</button>
<input type="number" min=1 max=1000 value=256 onchange="mandelbrot.setIter(value)">
</div>
</div>
<h2>Multibrot set</h2>
<a href="https://en.wikipedia.org/wiki/Multibrot_set">Wikipedia page</a>
<p>You can click to zoom and set the iteration count in the input field. The second input controls the exponent. This is quite slow to render.</p>
<div class="demo-render" id="multibrot">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="multibrot.reset()">Render</button>
<input type="number" min=1 max=1000 value=256 onchange="multibrot.setIter(value)">
<input type="number" min=0 max=32 step=0.1 value=4 onchange="multibrot.setPower(value)">
</div>
</div>
<h2>Julia set</h2>
<a href="https://en.wikipedia.org/wiki/Julia_set">Wikipedia page</a>
<p>You can set the iteration count in the input field.</p>
<div class="demo-render" id="julia-set">
<canvas></canvas>
<div class="controlbar">
<button type="button" onclick="juliaSet.reset()">Reset</button>
<input type="number" min=8 max=1000 value=80 step=8 onchange="juliaSet.setIter(value)">
</div>
</div>
<script src="fractals.js"></script>
</main>
<include footer.html/>
</body>
</html>

16
pages/index.html
View file

@ -1,15 +1,15 @@
<!DOCTYPE html>
<html lang="en">
<head>
<include meta.html/>
<title>CrispyPin.cc</title>
<include meta.html/>
<title>CrispyPin.cc</title>
</head>
<body>
<include header.html/>
<main>
<h1>Homepage</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Earum exercitationem quod laudantium neque. Dolor qui magnam debitis repellendus assumenda tenetur ab aliquam ea sit in harum facere neque ad nemo vel nesciunt distinctio totam, cupiditate, deleniti nam voluptas quia aperiam.</p>
</main>
<include footer.html/>
<include header.html/>
<main>
<h1>Homepage</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Earum exercitationem quod laudantium neque. Dolor qui magnam debitis repellendus assumenda tenetur ab aliquam ea sit in harum facere neque ad nemo vel nesciunt distinctio totam, cupiditate, deleniti nam voluptas quia aperiam.</p>
</main>
<include footer.html/>
</body>
</html>

18
templates/footer.html
View file

@ -1,9 +1,9 @@
<footer>
<p>crispypin.cc</p>
<div class="links">
<a href="https://github.com/CrispyPin"><img src="/icons/github.png" alt="" width=32px> </a>
<a href="https://crispypin.itch.io/"><img src="/icons/itchio.svg" alt="" width=32px> </a>
<a href="https://twitter.com/CrispyPin42"><img src="/icons/twitter.png" alt="" width=32px> </a>
<a href="https://www.youtube.com/channel/UCFW1QTsbFgux8VrduCz_ckQ"><img src="/icons/youtube.png" alt="" width=32px> </a>
</div>
</footer>
<footer>
<p>Copyright © 2022 - CrispyPin</p>
<div class="links">
<a href="https://github.com/CrispyPin"><img src="/icons/github.png" alt="" width=32px></a>
<a href="https://crispypin.itch.io/"><img src="/icons/itchio.svg" alt="" width=32px></a>
<a href="https://twitter.com/CrispyPin42"><img src="/icons/twitter.png" alt="" width=32px></a>
<a href="https://www.youtube.com/channel/UCFW1QTsbFgux8VrduCz_ckQ"><img src="/icons/youtube.png" alt="" width=32px></a>
</div>
</footer>

8
templates/header.html
View file

@ -1,4 +1,4 @@
<header>
<a href="/" id="logo"><img src="/logo.png" alt=""></a>
</header>
<include navbar.html/>
<header>
<a href="/" id="logo"><img src="/logo.png" alt=""></a>
</header>
<include navbar.html/>

18
templates/navbar.html
View file

@ -1,9 +1,9 @@
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/games/">Games</a></li>
<li><a href="/fractals/">Fractals</a></li>
<li><a href="/blender/">Blender stuff</a></li>
<li><a href="https://crispypin.github.io/gol-wallpaper">Game of Life</a></li>
</ul>
</nav>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/games/">Games</a></li>
<li><a href="/fractals/">Fractals</a></li>
<li><a href="/blender/">Blender stuff</a></li>
<li><a href="https://crispypin.github.io/gol-wallpaper">Game of Life</a></li>
</ul>
</nav>