mirror of
https://github.com/mat-1/matdoesdev.git
synced 2025-08-02 14:46:04 +00:00
scroll retro background on other pages
This commit is contained in:
parent
bec2bdadc0
commit
f96d4ea099
10 changed files with 184 additions and 72 deletions
Binary file not shown.
140
Caddyfile
140
Caddyfile
|
|
@ -1,15 +1,53 @@
|
|||
matdoes.dev:443 http://matctazmu565vivubva3p3bulaneangiff47xmnezzjx2nuinwjoxjyd.onion:8181 {
|
||||
(https_redirect) {
|
||||
@do_https_redirect {
|
||||
not header_regexp veryoldbrowser User-Agent Navigator|MSIE|Mosaic
|
||||
protocol http
|
||||
}
|
||||
redir @do_https_redirect https://{host}{uri}
|
||||
}
|
||||
|
||||
(gif_redirect) {
|
||||
@do_not_gif_redirect {
|
||||
not header_regexp oldweb_today Origin http://localhost:10001
|
||||
not header_regexp oldweb_today Origin oldweb.today
|
||||
not header_regexp veryveryoldbrowser User-Agent Navigator|MSIE|NCSA_Mosaic
|
||||
}
|
||||
vars not_gif_redirect false
|
||||
vars @do_not_gif_redirect not_gif_redirect true
|
||||
@do_gif_redirect {
|
||||
expression `{vars.not_gif_redirect} == false`
|
||||
path_regexp ^/retro/.*\.png$
|
||||
}
|
||||
|
||||
uri @do_gif_redirect path_regexp \.png$ .gif
|
||||
}
|
||||
|
||||
matdoes.dev:80 matdoes.dev:443 http://matctazmu565vivubva3p3bulaneangiff47xmnezzjx2nuinwjoxjyd.onion {
|
||||
import https_redirect
|
||||
import gif_redirect
|
||||
|
||||
@not_retro not path /retro
|
||||
header @not_retro Server "caddy i think"
|
||||
header /retro Server "CERN httpd"
|
||||
|
||||
# block chrome but not chromium-based browsers
|
||||
@chrome {
|
||||
header_regexp chrome User-Agent Chrome\/[0-9./]+\s(Mobile\s)?Safari\/[0-9./]+$
|
||||
not header User-Agent *Googlebot/*
|
||||
not path /dot_git/*
|
||||
}
|
||||
@notchrome {
|
||||
header User-Agent *Googlebot/*
|
||||
}
|
||||
root @notchrome /www
|
||||
respond @chrome "This site is best viewed with Firefox (or literally any browser that isn't Chrome)." 403
|
||||
respond @chrome "This site is best viewed with Firefox (or literally any browser that isn't Chrome).
|
||||
|
||||
If you're unable to use Firefox, you can also access this website via SSH, Gemini, Gopher, Finger, Telnet, and some others." 403
|
||||
root * /www
|
||||
|
||||
# easter egg that makes old browsers show the retro page
|
||||
@retro_redirect {
|
||||
path /
|
||||
header_regexp oldbrowser User-Agent PaleMoon|Trident|MSIE|Netscape|Navigator
|
||||
}
|
||||
redir @retro_redirect /retro 302
|
||||
|
||||
file_server {
|
||||
precompressed br gzip
|
||||
}
|
||||
|
|
@ -19,11 +57,11 @@ matdoes.dev:443 http://matctazmu565vivubva3p3bulaneangiff47xmnezzjx2nuinwjoxjyd.
|
|||
header Accept application/json
|
||||
not path *.json
|
||||
}
|
||||
@jsonindex {
|
||||
@json_index {
|
||||
header Accept application/json
|
||||
path /
|
||||
}
|
||||
rewrite @jsonindex /.json
|
||||
rewrite @json_index /.json
|
||||
rewrite @json {path}.json
|
||||
|
||||
# don't require .html
|
||||
|
|
@ -52,33 +90,36 @@ matdoes.dev:443 http://matctazmu565vivubva3p3bulaneangiff47xmnezzjx2nuinwjoxjyd.
|
|||
redir https://matrix.matdoes.dev{uri}
|
||||
}
|
||||
|
||||
# .git easter egg
|
||||
uri /.git/* replace .git dot_git 1
|
||||
|
||||
handle_errors {
|
||||
@shouldBe404 {
|
||||
@should_be_404 {
|
||||
expression {http.error.status_code} == 404
|
||||
not random_paths 0.05
|
||||
}
|
||||
@shouldBe451 {
|
||||
@should_be_451 {
|
||||
expression {http.error.status_code} == 404
|
||||
random_paths 0.05
|
||||
}
|
||||
|
||||
vars is451 false
|
||||
vars @shouldBe451 is451 true
|
||||
@is451 `{vars.is451} == true`
|
||||
@isNot451 `{vars.is451} == false`
|
||||
vars is_451 false
|
||||
vars @should_be_451 is_451 true
|
||||
@is_451 `{vars.is_451} == true`
|
||||
@is_not_451 `{vars.is_451} == false`
|
||||
|
||||
rewrite @is451 /451.html
|
||||
file_server @is451 {
|
||||
rewrite @is_451 /451.html
|
||||
file_server @is_451 {
|
||||
status 451
|
||||
}
|
||||
|
||||
rewrite @shouldBe404 /404.html
|
||||
file_server @isNot451
|
||||
rewrite @should_be_404 /404.html
|
||||
file_server @is_not_451
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
matrix.matdoes.dev {
|
||||
(matrix_media_proxy) {
|
||||
handle /_matrix/media/*/download/matdoes.dev/discord_* {
|
||||
header Access-Control-Allow-Origin *
|
||||
# Remove path prefix
|
||||
|
|
@ -104,36 +145,17 @@ matrix.matdoes.dev {
|
|||
header_up Host media.discordapp.net
|
||||
}
|
||||
}
|
||||
}
|
||||
matrix.matdoes.dev {
|
||||
import matrix_media_proxy
|
||||
|
||||
handle {
|
||||
reverse_proxy 127.0.0.1:81
|
||||
}
|
||||
}
|
||||
matrix.matdoes.dev:8448 {
|
||||
handle /_matrix/media/*/download/matdoes.dev/discord_* {
|
||||
header Access-Control-Allow-Origin *
|
||||
# Remove path prefix
|
||||
uri path_regexp ^/_matrix/media/.+/download/matdoes\.dev/discord_ /
|
||||
# The mxc patterns use | instead of /, so replace it first turning it into attachments/1234/5678/filename.png
|
||||
uri replace "%7C" /
|
||||
reverse_proxy {
|
||||
# reverse_proxy automatically includes the uri, so no {uri} at the end
|
||||
to https://cdn.discordapp.com
|
||||
# Caddy doesn't set the Host header automatically when reverse proxying
|
||||
# (because usually reverse proxies are local and don't care about Host headers)
|
||||
header_up Host cdn.discordapp.com
|
||||
}
|
||||
}
|
||||
# Do the same for thumbnails, but redirect to media.discordapp.net (which is Discord's thumbnailing server, and happens to use similar width/height params as Matrix)
|
||||
# Alternatively, you can point this at cdn.discordapp.com too. Clients shouldn't mind even if they get a bigger image than they asked for.
|
||||
handle /_matrix/media/*/thumbnail/matdoes.dev/discord_* {
|
||||
header Access-Control-Allow-Origin *
|
||||
uri path_regexp ^/_matrix/media/.+/thumbnail/matdoes\.dev/discord_ /
|
||||
uri replace "%7C" /
|
||||
reverse_proxy {
|
||||
to https://media.discordapp.net
|
||||
header_up Host media.discordapp.net
|
||||
}
|
||||
}
|
||||
import matrix_media_proxy
|
||||
|
||||
handle {
|
||||
reverse_proxy 127.0.0.1:8449
|
||||
}
|
||||
|
|
@ -152,19 +174,37 @@ fedi.matdoes.dev {
|
|||
f.matdoes.dev {
|
||||
@chrome {
|
||||
header_regexp chrome User-Agent Chrome\/[0-9./]+\s(Mobile\s)?Safari\/[0-9./]+$
|
||||
}
|
||||
@notchrome {
|
||||
header User-Agent *Googlebot/*
|
||||
not header User-Agent *Googlebot/*
|
||||
}
|
||||
|
||||
reverse_proxy @notchrome 127.0.0.1:4000
|
||||
respond @chrome "This site is best viewed with Firefox (or literally any browser that isn't Chrome)." 403
|
||||
reverse_proxy 127.0.0.1:4000
|
||||
}
|
||||
git.matdoes.dev {
|
||||
reverse_proxy 127.0.0.1:3000
|
||||
}
|
||||
|
||||
mail.matdoes.dev {
|
||||
respond "mat's mail server :)"
|
||||
}
|
||||
matdoes.dev:3 {
|
||||
respond ":3"
|
||||
}
|
||||
header {
|
||||
colon3 :3
|
||||
Content-Type :3
|
||||
Date :3
|
||||
Server :3
|
||||
}
|
||||
respond ":3
|
||||
"
|
||||
}
|
||||
hetzner.matdoes.dev {
|
||||
redir https://matdoes.dev{uri}
|
||||
}
|
||||
|
||||
5.161.205.195 {
|
||||
header {
|
||||
Content-Type text/html
|
||||
Server "i forgor"
|
||||
}
|
||||
respond "uwu" 402
|
||||
}
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@
|
|||
"html-minifier": "^4.0.0",
|
||||
"patch-package": "^8.0.0",
|
||||
"postinstall-postinstall": "^2.1.0",
|
||||
"svelte-body": "^1.4.0",
|
||||
"vite": "5.0.6"
|
||||
},
|
||||
"engines": {
|
||||
|
|
|
|||
|
|
@ -8,5 +8,7 @@
|
|||
%sveltekit.head%
|
||||
</head>
|
||||
|
||||
%sveltekit.body%
|
||||
<body>
|
||||
%sveltekit.body%
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
35
src/hooks.server.ts
Normal file
35
src/hooks.server.ts
Normal file
|
|
@ -0,0 +1,35 @@
|
|||
import type { Handle } from '@sveltejs/kit'
|
||||
|
||||
export const handle: Handle = async ({ event, resolve }) => {
|
||||
if (event.url.pathname.startsWith('/retro')) {
|
||||
return resolve(event, {
|
||||
transformPageChunk: ({ html }) =>
|
||||
html.replace(
|
||||
'<body>',
|
||||
`<body bgcolor="#000000"
|
||||
background="/retro/background.gif"
|
||||
text="#ffffff"
|
||||
link="#ffffff"
|
||||
alink="#ffffff"
|
||||
vlink="#ffffff">`
|
||||
),
|
||||
})
|
||||
}
|
||||
|
||||
return await resolve(event)
|
||||
}
|
||||
|
||||
// export async function handle({ event, resolve }) {
|
||||
// return resolve(event, {
|
||||
// transformPage: ({ html }) =>
|
||||
// html.replace(
|
||||
// '%bodyfields%',
|
||||
// `bgcolor="#000000"
|
||||
// background="/retro/background.gif"
|
||||
// text="#ffffff"
|
||||
// link="#ffffff"
|
||||
// alink="#ffffff"
|
||||
// vlink="#ffffff"`
|
||||
// ),
|
||||
// })
|
||||
// }
|
||||
|
|
@ -11,22 +11,22 @@
|
|||
let currentPathName = data.pathname
|
||||
let flyDirection = 1 // 1 is right, -1 is left
|
||||
$: {
|
||||
if (previousPathname !== currentPathName)
|
||||
previousPathname = currentPathName
|
||||
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
|
||||
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 }}>
|
||||
<div
|
||||
id="page"
|
||||
in:fly={{ x: -5 * flyDirection, duration: 200, delay: 200 }}
|
||||
out:fly={{ x: 5 * flyDirection, duration: 200 }}
|
||||
>
|
||||
<main>
|
||||
<slot />
|
||||
</main>
|
||||
|
|
|
|||
|
|
@ -1,3 +1 @@
|
|||
<body>
|
||||
<slot />
|
||||
</body>
|
||||
<slot />
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
<script lang="ts">
|
||||
import { browser } from '$app/environment'
|
||||
import { onMount } from 'svelte'
|
||||
import MusicPlayer from './MusicPlayer.svelte'
|
||||
import './app.css'
|
||||
|
|
@ -19,13 +18,12 @@
|
|||
})
|
||||
</script>
|
||||
|
||||
<body
|
||||
<!-- <Body
|
||||
bgcolor="#000000"
|
||||
background="/retro/background.gif"
|
||||
text="#ffffff"
|
||||
link="#ffffff"
|
||||
alink="#ffffff"
|
||||
vlink="#ffffff"
|
||||
>
|
||||
<slot />
|
||||
</body>
|
||||
/> -->
|
||||
<slot />
|
||||
|
|
|
|||
|
|
@ -1,9 +1,12 @@
|
|||
body {
|
||||
body,
|
||||
#page {
|
||||
background: #000000 url(/retro/background.gif);
|
||||
color: #ffffff;
|
||||
|
||||
font-family: 'Comic Sans MS', cursive !important;
|
||||
overflow: auto;
|
||||
|
||||
background-attachment: local;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
|
|
@ -11,6 +14,10 @@ body {
|
|||
src: url(/retro/comicsans.ttf) format('truetype');
|
||||
}
|
||||
|
||||
:root {
|
||||
--background-color-alt: rgba(255, 255, 255, 0.05) !important;
|
||||
}
|
||||
|
||||
a,
|
||||
/* these are necessary for ie5 */
|
||||
a:link,
|
||||
|
|
@ -36,5 +43,9 @@ h2 {
|
|||
}
|
||||
|
||||
#main-title:after {
|
||||
content: ' :3';
|
||||
content: 'silly edition';
|
||||
display: block;
|
||||
font-size: 1rem;
|
||||
opacity: 0.5;
|
||||
margin-top: -0.5em;
|
||||
}
|
||||
|
|
|
|||
31
yarn.lock
31
yarn.lock
|
|
@ -1334,6 +1334,13 @@ __metadata:
|
|||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"clsx@npm:^1.2.1":
|
||||
version: 1.2.1
|
||||
resolution: "clsx@npm:1.2.1"
|
||||
checksum: 34dead8bee24f5e96f6e7937d711978380647e936a22e76380290e35486afd8634966ce300fc4b74a32f3762c7d4c0303f442c3e259f4ce02374eb0c82834f27
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"code-red@npm:^1.0.3":
|
||||
version: 1.0.4
|
||||
resolution: "code-red@npm:1.0.4"
|
||||
|
|
@ -1439,6 +1446,13 @@ __metadata:
|
|||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"csstype@npm:^3.1.2":
|
||||
version: 3.1.3
|
||||
resolution: "csstype@npm:3.1.3"
|
||||
checksum: 80c089d6f7e0c5b2bd83cf0539ab41474198579584fa10d86d0cafe0642202343cbc119e076a0b1aece191989477081415d66c9fefbf3c957fc2fc4b7009f248
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"debug@npm:4, debug@npm:^4.1.1, debug@npm:^4.3.2, debug@npm:^4.3.4":
|
||||
version: 4.3.4
|
||||
resolution: "debug@npm:4.3.4"
|
||||
|
|
@ -2562,6 +2576,7 @@ __metadata:
|
|||
prettier-plugin-svelte: "npm:^3.1.2"
|
||||
sharp: "npm:^0.33.0"
|
||||
svelte: "npm:4.2.8"
|
||||
svelte-body: "npm:^1.4.0"
|
||||
svelte-check: "npm:^3.6.2"
|
||||
svelte-preprocess: "npm:^5.1.1"
|
||||
tslib: "npm:^2.6.2"
|
||||
|
|
@ -3580,6 +3595,18 @@ __metadata:
|
|||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"svelte-body@npm:^1.4.0":
|
||||
version: 1.4.0
|
||||
resolution: "svelte-body@npm:1.4.0"
|
||||
dependencies:
|
||||
clsx: "npm:^1.2.1"
|
||||
csstype: "npm:^3.1.2"
|
||||
peerDependencies:
|
||||
svelte: ^3.47.0 || ^4.0.0
|
||||
checksum: 2524763d708fd41c609d43720471748f002fcaa4282d30f6c2d1d35f3b23db8b66996ef14919ccff4975bc23f84c44455f9a6da70ff47aa7a08a0601fe500f6f
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"svelte-check@npm:^3.6.2":
|
||||
version: 3.6.2
|
||||
resolution: "svelte-check@npm:3.6.2"
|
||||
|
|
@ -3796,11 +3823,11 @@ __metadata:
|
|||
|
||||
"typescript@patch:typescript@npm%3A^5.3.3#optional!builtin<compat/typescript>":
|
||||
version: 5.3.3
|
||||
resolution: "typescript@patch:typescript@npm%3A5.3.3#optional!builtin<compat/typescript>::version=5.3.3&hash=29ae49"
|
||||
resolution: "typescript@patch:typescript@npm%3A5.3.3#optional!builtin<compat/typescript>::version=5.3.3&hash=e012d7"
|
||||
bin:
|
||||
tsc: bin/tsc
|
||||
tsserver: bin/tsserver
|
||||
checksum: e22df47df9b2b2f2617b8bf511a29aea3d177f9f7a0756818230a76b01cbd7da988bf55f9463aaa1a4c1ff90b80f8dc5676460d4e9dfc010572cbba59b822b0c
|
||||
checksum: 1d0a5f4ce496c42caa9a30e659c467c5686eae15d54b027ee7866744952547f1be1262f2d40de911618c242b510029d51d43ff605dba8fb740ec85ca2d3f9500
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue