vlw/victorwesterlund.com
1
0
Fork 0
mirror of https://codeberg.org/vlw/victorwesterlund.com.git synced 2025-09-14 03:23:41 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

wip(22w7h): add error page

Browse source
This commit is contained in:
Victor Westerlund 2022-02-19 16:10:08 +01:00
parent dc3f512121
commit e4d1882cb0
4 changed files with 30 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
public/assets/css/style.css
View file

@ -23,6 +23,9 @@ body {
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow-x: hidden; overflow-x: hidden;
}
html {
background-color: rgba(var(--color-base), .7); background-color: rgba(var(--color-base), .7);
background-size: cover; background-size: cover;
background-blend-mode: overlay; background-blend-mode: overlay;
@ -30,16 +33,6 @@ body {
background-attachment: fixed; background-attachment: fixed;
} }
html {
height: 100vh;
overflow: hidden;
}
body {
overflow-y: scroll;
height: 100vh;
}
picture { picture {
display: contents; display: contents;
} }
@ -74,6 +67,11 @@ body > div {
text-decoration: none; text-decoration: none;
text-align: center; text-align: center;
user-select: none; user-select: none;
background-color: rgba(var(--color-contrast), .13);
box-shadow:
inset 0 .3vh 1.6vh rgba(0, 0, 0, 0),
0 .1vh .3vh rgba(0, 0, 0, .12),
0 .1vh .2vh rgba(0, 0, 0, .24);
} }
/* --- */ /* --- */
@ -132,11 +130,6 @@ body > div {
padding: var(--padding-vert) 0; padding: var(--padding-vert) 0;
margin-top: calc(var(--padding) / 2); margin-top: calc(var(--padding) / 2);
border-radius: clamp(9px, .5vw, .5vw); border-radius: clamp(9px, .5vw, .5vw);
background-color: rgba(var(--color-contrast), .13);
box-shadow:
inset 0 .3vh 1.6vh rgba(0, 0, 0, 0),
0 .1vh .3vh rgba(0, 0, 0, .12),
0 .1vh .2vh rgba(0, 0, 0, .24);
} }
/* -- Media Queries -- */ /* -- Media Queries -- */

9
public/assets/js/glitch/Generator.mjs
View file

@ -16,7 +16,14 @@ class Generator {
// Get or set the path to where base64 images are stored // Get or set the path to where base64 images are stored
get dir () { return this._dir; }, get dir () { return this._dir; },
set dir (newPath) { set dir (newPath) {
this._dir = newPath + this._dir_rel; const url = new URL(newPath);
// Replace pathname of this file with relative path to assets
const path = url.pathname.split("/");
path[path.length - 1] = this._dir_rel;
url.pathname = path.join("/");
this._dir = url.toString();
} }
} }
} }

2
public/assets/js/script.mjs
View file

@ -11,4 +11,4 @@ for(let link of document.getElementsByTagName("a")) {
}); });
} }
window.glitch = new Glitch(document.body); window.glitch = new Glitch(document.body.parentElement);

30
public/error.html
View file

@ -5,24 +5,20 @@
<title>Victor Westerlund</title> <title>Victor Westerlund</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Full-stack web developer from Stockholm, Sweden."> <meta name="description" content="Full-stack web developer from Stockholm, Sweden.">
<link rel="icon" href="/assets/media/favicon-dark.png" media="(prefers-color-scheme:no-preference)"> <meta name="theme-color" content="#000000">
<link rel="icon" href="/assets/media/favicon-dark.png" media="(prefers-color-scheme:light)"> <link rel="icon" href="assets/media/favicon-dark.png" media="(prefers-color-scheme:no-preference)">
<link rel="icon" href="/assets/media/favicon-light.png" media="(prefers-color-scheme:dark)"> <link rel="icon" href="assets/media/favicon-dark.png" media="(prefers-color-scheme:light)">
<style> <link rel="icon" href="assets/media/favicon-light.png" media="(prefers-color-scheme:dark)">
html, body { margin: 30px; font-family: monospace; color: black; } <link rel="stylesheet" href="assets/css/style.css">
span { background: black; color: white; }
@media (prefers-color-scheme: dark) {
html, body, a { background: black; color: white; }
span { background: white; color: black; }
}
</style>
</head> </head>
<body> <body>
<h1>there is nothing here</h1> <div>
<p>and that is all I know</p> <div id="intro">
<a href="/"><h2>take me home</h2></a> <h1>there is nothing here</h1>
<footer> <p>and that's all I know</p>
<span>victorwesterlund.com</span> <a href="/">take me home -></a>
</footer> </div>
</div>
<script type="module" src="assets/js/script.mjs"></script>
</body> </body>
</html> </html>