quartznet/quartznet-info
2
0
Fork 0
Code Issues Pull Requests Actions Packages Activity

Update _error layout

Browse Source 
- Added Banner component.
- Cleanup formatting and indentation issues.
- Made CSS clearer and easier to change.
This commit is contained in:
Chris Dill 2021-02-06 21:51:55 +00:00
parent ef909d0246
commit 49c42375b9
1 changed files with 96 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

202
src/routes/_error.svelte
View File

@ -1,12 +1,12 @@
<script> <script>
import {onMount} from 'svelte' import {onMount} from 'svelte'
import Banner from '../components/banner.svelte'
export let status; export let status;
export let error; export let error;
const dev = process.env.NODE_ENV === 'development'; const dev = process.env.NODE_ENV === 'development';
var appa = ` .,-:;//;:=, var appa = ` .,-:;//;:=,
. :H@@@MM@M#H/.,+%;, . :H@@@MM@M#H/.,+%;,
,/X+ +M@@M@MM%=,-%HMMM@X/, ,/X+ +M@@M@MM%=,-%HMMM@X/,
@ -217,11 +217,8 @@ H@: :HHHHHHHHHHHHHHHHHHX, =@H
,:/%XM####H/. ,:/%XM####H/.
,.:=-.`; ,.:=-.`;
//appa // appa, atom, nuke
//atom
//nuke
var options = [cake, heart, fire, tick, bang, mesa, cube]; var options = [cake, heart, fire, tick, bang, mesa, cube];
let active = cake let active = cake
function updateView() { function updateView() {
@ -230,41 +227,32 @@ H@: :HHHHHHHHHHHHHHHHHHX, =@H
} }
onMount(() => updateView()); onMount(() => updateView());
</script> </script>
<style> <style>
* { * {
all: unset; color: white !important;
font-family: monospace; font-family: monospace;
white-space: pre; white-space: pre;
} }
.ascii {
div { text-align: center;
text-align: center; width: 100%;
} }
.info {
h1, p { margin-bottom: 30px;
margin: 0 auto; position: relative;
} white-space: pre;
text-align: center;
h1 {
font-size: 2.8em;
font-weight: 700;
margin: 0 0 0.5em 0;
}
p {
margin: 1em auto;
} }
pre { pre {
display: inline-block; /* display: inline-block; */
margin: 0 auto; margin: 0 auto;
position: center; /* position: center; */
text-align: left; /* text-align: left; */
font-family: monospace; font-family: monospace;
white-space: pre; white-space: pre;
} }
@ -277,100 +265,102 @@ H@: :HHHHHHHHHHHHHHHHHHX, =@H
</style> </style>
<svelte:head> <svelte:head>
<title>{status}</title> <title>Quartnzet - {status}</title>
</svelte:head> </svelte:head>
<h1>{status}</h1> <Banner title="{status}"/>
<p>{error.message}</p> <main class="container">
<p>{error.message}</p>
{#if dev && error.stack} {#if dev && error.stack}
<pre>{error.stack}</pre> <pre>{error.stack}</pre>
{:else} {:else}
<audio controls autoplay> <audio controls autoplay>
<track kind="captions"/> <track kind="captions"/>
<source src="http://quartznet.info/alive.ogg" type="audio/wav"> <source src="http://quartznet.info/alive.ogg" type="audio/wav">
</audio> </audio>
<div style="text-align: center; width: 100%; display: inline-block"> <div class="ascii">
<br> <div>
<div style=""> <pre><br>{active}</pre>
<pre> </div>
<br>{active}</pre>
</div> </div>
<br> <hr>
This was a triumph! <p class="info">
I'm making a note here: This was a triumph!
Huge success! I'm making a note here:
Huge success!
It's hard to overstate It's hard to overstate
my satisfaction. my satisfaction.
Aperture Science: Aperture Science:
We do what we must We do what we must
because we can because we can
For the good of all of us. For the good of all of us.
Except the ones who are dead. Except the ones who are dead.
But there's no sense crying But there's no sense crying
over every mistake. over every mistake.
You just keep on trying You just keep on trying
'til you run out of cake. 'til you run out of cake.
And the science gets done. And the science gets done.
And you make a neat gun And you make a neat gun
for the people who are for the people who are
still alive. still alive.
I'm not even angry... I'm not even angry...
I'm being so sincere right now. I'm being so sincere right now.
Even though you broke my heart, Even though you broke my heart,
and killed me. and killed me.
And tore me to pieces. And tore me to pieces.
And threw every piece into a fire. And threw every piece into a fire.
As they burned it hurt because As they burned it hurt because
I was so happy for you! I was so happy for you!
Now, these points of data Now, these points of data
make a beautiful line. make a beautiful line.
And we're out of beta. And we're out of beta.
We're releasing on time! We're releasing on time!
So I'm GLaD I got burned! So I'm GLaD I got burned!
Think of all the things we learned! Think of all the things we learned!
for the people who are for the people who are
still alive. still alive.
Go ahead and leave me... Go ahead and leave me...
I think I'd prefer to stay inside... I think I'd prefer to stay inside...
Maybe you'll find someone else Maybe you'll find someone else
to help you. to help you.
Maybe Black Mesa? Maybe Black Mesa?
That was a joke. Ha Ha. Fat Chance! That was a joke. Ha Ha. Fat Chance!
Anyway this cake is great! Anyway this cake is great!
It's so delicious and moist! It's so delicious and moist!
Look at me: still talking Look at me: still talking
when there's science to do! when there's science to do!
When I look out there, When I look out there,
it makes me glad I'm not you. it makes me glad I'm not you.
I've experiments to run. I've experiments to run.
There is research to be done. There is research to be done.
On the people who are On the people who are
still alive. still alive.
And believe me I am And believe me I am
still alive. still alive.
I'm doing science and I'm I'm doing science and I'm
still alive. still alive.
I feel fantastic and I'm I feel fantastic and I'm
still alive. still alive.
While you're dying I'll be While you're dying I'll be
still alive. still alive.
And when you're dead I will be And when you're dead I will be
still alive still alive
Still alive. Still alive.
Still alive. Still alive.
</div> </p>
{/if} {/if}
</main>