1
0
Fork 0
mirror of https://github.com/mat-1/matdoesdev.git synced 2025-08-02 14:46:04 +00:00
This commit is contained in:
mat 2023-09-05 22:12:44 -05:00
parent b29bf0a4e1
commit cd403c121a
35 changed files with 244 additions and 80 deletions

View file

@ -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] ?? ''

View 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>&copy; {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>

View 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,
}
}

View file

@ -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>

View file

@ -1,5 +1,7 @@
<script lang="ts">
export let data
import type { PageData } from "./$types"
export let data: PageData
const { page, slug } = data
</script>

View file

@ -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')
}

View file

@ -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

View file

@ -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(() => {

View file

@ -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>&copy; {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/>

View file

@ -1,7 +0,0 @@
export const prerender = true
export const load = async function ({ url }) {
return {
pathname: url.pathname,
}
}

View file

@ -0,0 +1,8 @@
<script lang="ts">
import './app.css'
import './comicsans.ttf'
</script>
<slot />

124
src/routes/old/+page.svelte Normal file
View 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
View 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
View 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;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 878 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 701 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

BIN
src/routes/old/contact.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

BIN
src/routes/old/links.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

BIN
src/routes/old/sparkles.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 KiB