add /old
|
@ -92,7 +92,7 @@ export async function getPost(slug: string): Promise<BlogPost | null> {
|
|||
])
|
||||
)
|
||||
|
||||
// HACK: i'm probably comitting a felony by putting this here
|
||||
// HACK: i'm probably committing a felony by putting this here
|
||||
// but i couldn't come up with a better solution
|
||||
const html = /^[\w\W]*?<\/div>\s*([\w\W]+)<\/article>[\w\W]*?$/.exec(renderHtml)?.[1] ?? ''
|
||||
|
||||
|
|
67
src/routes/(main)/+layout.svelte
Normal file
|
@ -0,0 +1,67 @@
|
|||
<script lang="ts">
|
||||
import '../../app.css'
|
||||
import { fly } from 'svelte/transition'
|
||||
import type { LayoutData } from '../$types'
|
||||
|
||||
export let data: LayoutData
|
||||
|
||||
export const copyrightYear = new Date().getFullYear()
|
||||
|
||||
let previousPathname = data.pathname
|
||||
let currentPathName = data.pathname
|
||||
let flyDirection = 1 // 1 is right, -1 is left
|
||||
$: {
|
||||
if (previousPathname !== currentPathName)
|
||||
previousPathname = currentPathName
|
||||
currentPathName = data.pathname
|
||||
|
||||
// fly right if we're going forward, left if we're going back
|
||||
if (previousPathname === '/')
|
||||
flyDirection = 1
|
||||
else if (previousPathname === '/blog' && currentPathName !== '/')
|
||||
flyDirection = 1
|
||||
else
|
||||
flyDirection = -1
|
||||
}
|
||||
</script>
|
||||
|
||||
{#key data.pathname}
|
||||
<div id="page" in:fly={{ x: -5 * flyDirection, duration: 200, delay: 200 }} out:fly={{ x: 5 * flyDirection, duration: 200 }}>
|
||||
<main>
|
||||
<slot />
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<p>© {copyrightYear} matdoesdev</p>
|
||||
</footer>
|
||||
</div>
|
||||
{/key}
|
||||
|
||||
<style>
|
||||
:global(body) {
|
||||
overflow: hidden;
|
||||
}
|
||||
#page {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: stretch;
|
||||
overflow-x: hidden;
|
||||
overflow-wrap: break-word;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
main {
|
||||
padding: 1em;
|
||||
margin: auto;
|
||||
flex: 1 0;
|
||||
max-width: 50em;
|
||||
width: calc(100% - 2em);
|
||||
}
|
||||
footer {
|
||||
text-align: center;
|
||||
flex: 0 0;
|
||||
color: var(--text-color-alt-3);
|
||||
}
|
||||
</style>
|
9
src/routes/(main)/+layout.ts
Normal file
|
@ -0,0 +1,9 @@
|
|||
import type { Load } from '@sveltejs/kit'
|
||||
|
||||
export const prerender = true
|
||||
|
||||
export const load: Load = async function ({ url }) {
|
||||
return {
|
||||
pathname: url.pathname,
|
||||
}
|
||||
}
|
|
@ -8,7 +8,7 @@
|
|||
<section class="error-page">
|
||||
<div>
|
||||
<h1>451</h1>
|
||||
<h2>Unavailable For Legal Reasons</h2>
|
||||
<a href="/old"><h2>Unavailable For Legal Reasons</h2></a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
@ -34,4 +34,8 @@
|
|||
color: var(--text-color-alt-3);
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
</style>
|
|
@ -1,5 +1,7 @@
|
|||
<script lang="ts">
|
||||
export let data
|
||||
import type { PageData } from "./$types"
|
||||
|
||||
export let data: PageData
|
||||
const { page, slug } = data
|
||||
</script>
|
||||
|
|
@ -8,7 +8,7 @@ export const load: Load = async ({ params }) => {
|
|||
|
||||
let page
|
||||
try {
|
||||
page = await import(`../${slug}/index.svx`)
|
||||
page = await import(`../../${slug}/index.svx`)
|
||||
} catch (e) {
|
||||
throw error(404, 'Not found')
|
||||
}
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts">
|
||||
import BackAnchor from '$lib/BackAnchor.svelte'
|
||||
import PostPreview from '$lib/PostPreview.svelte'
|
||||
import type { BlogPostPreview } from '../blog.json/+server'
|
||||
import type { BlogPostPreview } from '../../blog.json/+server'
|
||||
|
||||
export let data
|
||||
export let posts: BlogPostPreview[] = data.posts
|
|
@ -2,7 +2,7 @@
|
|||
import BackAnchor from '$lib/BackAnchor.svelte'
|
||||
import Project from '$lib/Project.svelte'
|
||||
import { onMount } from 'svelte'
|
||||
import projects from '../_projects.json'
|
||||
import projects from '../../_projects.json'
|
||||
|
||||
// set the --project-height on page load so it doesn't jump around later
|
||||
onMount(() => {
|
|
@ -1,67 +1 @@
|
|||
<script lang="ts">
|
||||
import '../app.css'
|
||||
import { fly } from 'svelte/transition'
|
||||
import type { LayoutData } from './$types'
|
||||
|
||||
export let data: LayoutData
|
||||
|
||||
export const copyrightYear = new Date().getFullYear()
|
||||
|
||||
let previousPathname = data.pathname
|
||||
let currentPathName = data.pathname
|
||||
let flyDirection = 1 // 1 is right, -1 is left
|
||||
$: {
|
||||
if (previousPathname !== currentPathName)
|
||||
previousPathname = currentPathName
|
||||
currentPathName = data.pathname
|
||||
|
||||
// fly right if we're going forward, left if we're going back
|
||||
if (previousPathname === '/')
|
||||
flyDirection = 1
|
||||
else if (previousPathname === '/blog' && currentPathName !== '/')
|
||||
flyDirection = 1
|
||||
else
|
||||
flyDirection = -1
|
||||
}
|
||||
</script>
|
||||
|
||||
{#key data.pathname}
|
||||
<div id="page" in:fly={{ x: -5 * flyDirection, duration: 200, delay: 200 }} out:fly={{ x: 5 * flyDirection, duration: 200 }}>
|
||||
<main>
|
||||
<slot />
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<p>© {copyrightYear} matdoesdev</p>
|
||||
</footer>
|
||||
</div>
|
||||
{/key}
|
||||
|
||||
<style>
|
||||
:global(body) {
|
||||
overflow: hidden;
|
||||
}
|
||||
#page {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: stretch;
|
||||
overflow-x: hidden;
|
||||
overflow-wrap: break-word;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
main {
|
||||
padding: 1em;
|
||||
margin: auto;
|
||||
flex: 1 0;
|
||||
max-width: 50em;
|
||||
width: calc(100% - 2em);
|
||||
}
|
||||
footer {
|
||||
text-align: center;
|
||||
flex: 0 0;
|
||||
color: var(--text-color-alt-3);
|
||||
}
|
||||
</style>
|
||||
<slot/>
|
|
@ -1,7 +0,0 @@
|
|||
export const prerender = true
|
||||
|
||||
export const load = async function ({ url }) {
|
||||
return {
|
||||
pathname: url.pathname,
|
||||
}
|
||||
}
|
8
src/routes/old/+layout.svelte
Normal file
|
@ -0,0 +1,8 @@
|
|||
<script lang="ts">
|
||||
import './app.css'
|
||||
import './comicsans.ttf'
|
||||
</script>
|
||||
|
||||
<slot />
|
||||
|
||||
|
124
src/routes/old/+page.svelte
Normal file
|
@ -0,0 +1,124 @@
|
|||
<script lang="ts">
|
||||
import sparkles from './sparkles.gif'
|
||||
import contact from './contact.gif'
|
||||
import links from './links.gif'
|
||||
import projects from '../_projects.json'
|
||||
|
||||
import adryd from './buttons/adryd.png'
|
||||
import notnite from './buttons/notnite.gif'
|
||||
import archbtw from './buttons/archbtw.png'
|
||||
import getFirefox from './buttons/getfirefox.gif'
|
||||
import github from './buttons/github.gif'
|
||||
import kofi from './buttons/kofi.gif'
|
||||
import vscode from './buttons/vscode.gif'
|
||||
import hetzner from './buttons/hetzner.gif'
|
||||
|
||||
import type { BlogPostPreview } from "../blog.json/+server.js"
|
||||
|
||||
export let data
|
||||
export let posts: BlogPostPreview[] = data.posts
|
||||
</script>
|
||||
<table id="main-table">
|
||||
<tr>
|
||||
<td>
|
||||
<div id="welcome">
|
||||
<table>
|
||||
<tr>
|
||||
<td><img src={sparkles} alt="sparkles"/></td>
|
||||
<td>
|
||||
<h1>welcome to mat's site!!!</h1>
|
||||
</td>
|
||||
<td><img src={sparkles} alt="sparkles"/></td>
|
||||
</tr>
|
||||
</table>
|
||||
<div>
|
||||
hi, thanks for stopping by.
|
||||
i am mat, i make things on the internet.
|
||||
<br>
|
||||
this is my personal web site on the world wide web.
|
||||
</div>
|
||||
<br>
|
||||
<div>
|
||||
<a href="https://adryd.com/"><img src={adryd} alt="adryd" /></a>
|
||||
<a href="https://notnite.com/"><img src={notnite} alt="notnite" /></a>
|
||||
<a href="https://archlinux.org/"><img src={archbtw} alt="archbtw" /></a>
|
||||
<a href="https://www.mozilla.org/en-US/firefox/new/"><img src={getFirefox} alt="getFirefox" /></a>
|
||||
<a href="https://github.com/mat-1"><img src={github} alt="github" /></a>
|
||||
<a href="https://ko-fi.com/matdoesdev"><img src={kofi} alt="kofi" /></a>
|
||||
<a href="https://code.visualstudio.com/"><img src={vscode} alt="vscode" /></a>
|
||||
<a href="https://www.hetzner.com/"><img src={hetzner} alt="hetzner" /></a>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="sidebar-list">
|
||||
<h2>BLOG POSTS</h2>
|
||||
{#each posts as post}
|
||||
<div><a href={post.slug}>{post.title}</a></div>
|
||||
{/each}
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<table id="sections">
|
||||
<tr>
|
||||
<td class="section contact">
|
||||
<div><img src={contact} alt="contact" /></div>
|
||||
<p>
|
||||
my preferred method of contact is <a href="https://matrix.to/#/@mat:matdoes.dev">matrix</a>,
|
||||
but you can also email me (i have a catch-all on this domain).
|
||||
i'm also on <a href="https://f.matdoes.dev/mat">the fediverse</a>.
|
||||
</p>
|
||||
</td>
|
||||
<td class="section links">
|
||||
<div><img src={links} alt="links" /></div>
|
||||
<p>
|
||||
i have a github at <a href="https://github.com/mat-1">github.com/mat-1</a>,
|
||||
and you can give me money through ko-fi at <a href="https://ko-fi.com/matdoesdev">ko-fi.com/matdoesdev</a>.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
<div class="sidebar-list">
|
||||
<h2>PROJECTS</h2>
|
||||
{#each projects as project}
|
||||
<div><a href={project.href}>{project.name}</a></div>
|
||||
{/each}
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<style>
|
||||
.sidebar-list {
|
||||
text-align: right;
|
||||
height: 400px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.sidebar-list h2 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#main-table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#welcome {
|
||||
margin: 0 auto;
|
||||
max-width: 600px
|
||||
}
|
||||
|
||||
#sections {
|
||||
width: 100%;
|
||||
}
|
||||
.section p {
|
||||
max-width: 300px;
|
||||
}
|
||||
.contact {
|
||||
padding-right: 10px
|
||||
}
|
||||
</style>
|
11
src/routes/old/+page.ts
Normal file
|
@ -0,0 +1,11 @@
|
|||
import type { Load } from '@sveltejs/kit'
|
||||
|
||||
// export const csr = false
|
||||
|
||||
export const load: Load = async ({ fetch }) => {
|
||||
const posts = await fetch('/blog.json').then((r: Response) => r.json())
|
||||
|
||||
return {
|
||||
posts,
|
||||
}
|
||||
}
|
12
src/routes/old/app.css
Normal file
|
@ -0,0 +1,12 @@
|
|||
body {
|
||||
background-color: #000;
|
||||
background-image: url('/old/background.gif');
|
||||
color: #fff;
|
||||
|
||||
font-family: 'comic sans ms';
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
}
|
BIN
src/routes/old/background.gif
Normal file
After Width: | Height: | Size: 24 KiB |
BIN
src/routes/old/buttons/adryd.png
Normal file
After Width: | Height: | Size: 878 B |
BIN
src/routes/old/buttons/archbtw.png
Normal file
After Width: | Height: | Size: 1.9 KiB |
BIN
src/routes/old/buttons/getfirefox.gif
Normal file
After Width: | Height: | Size: 2.4 KiB |
BIN
src/routes/old/buttons/github.gif
Normal file
After Width: | Height: | Size: 701 B |
BIN
src/routes/old/buttons/hetzner.gif
Normal file
After Width: | Height: | Size: 1.1 KiB |
BIN
src/routes/old/buttons/kofi.gif
Normal file
After Width: | Height: | Size: 2.1 KiB |
BIN
src/routes/old/buttons/notnite.gif
Normal file
After Width: | Height: | Size: 1.5 KiB |
BIN
src/routes/old/buttons/vscode.gif
Normal file
After Width: | Height: | Size: 1.9 KiB |
BIN
src/routes/old/comicsans.ttf
Normal file
BIN
src/routes/old/contact.gif
Normal file
After Width: | Height: | Size: 41 KiB |
BIN
src/routes/old/links.gif
Normal file
After Width: | Height: | Size: 30 KiB |
BIN
src/routes/old/sparkles.gif
Normal file
After Width: | Height: | Size: 7.3 KiB |