wip(22w7h): add error page

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

View file

@ -23,6 +23,9 @@ body {
width: 100%;
height: 100%;
overflow-x: hidden;
}
html {
background-color: rgba(var(--color-base), .7);
background-size: cover;
background-blend-mode: overlay;
@ -30,16 +33,6 @@ body {
background-attachment: fixed;
}
html {
height: 100vh;
overflow: hidden;
}
body {
overflow-y: scroll;
height: 100vh;
}
picture {
display: contents;
}
@ -74,6 +67,11 @@ body > div {
text-decoration: none;
text-align: center;
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;
margin-top: calc(var(--padding) / 2);
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 -- */

View file

@ -16,7 +16,14 @@ class Generator {
// Get or set the path to where base64 images are stored
get dir () { return this._dir; },
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();
}
}
}

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);

View file

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