Compare commits
2 Commits
c41fe0dfea
...
da8b0b4228
Author | SHA1 | Date |
---|---|---|
BodgeMaster | da8b0b4228 | |
BodgeMaster | 1019ad2937 |
|
@ -52,6 +52,12 @@
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
<p>
|
||||||
|
Here is a quote: <span class="quote speech">Hello! It's me! The
|
||||||
|
quote.</span><br />
|
||||||
|
Here's a non-verbal quote: <span class="quote non-speech">
|
||||||
|
test abc</span>
|
||||||
|
</p>
|
||||||
<p>
|
<p>
|
||||||
Here are two types of pre-formatted text:
|
Here are two types of pre-formatted text:
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -1,3 +1,18 @@
|
||||||
|
* {
|
||||||
|
color: #101010;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #1515A0;
|
||||||
|
}
|
||||||
|
a:visited {
|
||||||
|
color: #185113;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
background-color: #e5e3e0;
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
width: 90%;
|
width: 90%;
|
||||||
|
@ -13,7 +28,7 @@ h1 {
|
||||||
padding-top: 0.8em;
|
padding-top: 0.8em;
|
||||||
padding-bottom: 0.5em;
|
padding-bottom: 0.5em;
|
||||||
|
|
||||||
border-bottom: 0.1em solid black;
|
border-bottom: 0.1em solid #101030;
|
||||||
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
margin-bottom: 0.8em;
|
margin-bottom: 0.8em;
|
||||||
|
@ -75,7 +90,7 @@ pre {
|
||||||
pre.terminal {
|
pre.terminal {
|
||||||
color: #B5E550;
|
color: #B5E550;
|
||||||
background-color: #3F3F3F;
|
background-color: #3F3F3F;
|
||||||
border: 1px solid black;
|
border: 1px solid #101030;
|
||||||
|
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
}
|
}
|
||||||
|
@ -84,7 +99,7 @@ pre.paper {
|
||||||
/* TODO: typewriter-look? */
|
/* TODO: typewriter-look? */
|
||||||
/* TODO: tractor feed ribbons? */
|
/* TODO: tractor feed ribbons? */
|
||||||
background-color: #F0E6CE;
|
background-color: #F0E6CE;
|
||||||
border: 1px solid black;
|
border: 1px solid #101030;
|
||||||
|
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
padding-bottom: 0em;
|
padding-bottom: 0em;
|
||||||
|
@ -98,14 +113,14 @@ span.quote.speech {
|
||||||
color: #303030;
|
color: #303030;
|
||||||
}
|
}
|
||||||
span.quote.speech::before {
|
span.quote.speech::before {
|
||||||
color: black;
|
color: #101030;
|
||||||
content: "\25b8";
|
content: "\25b8";
|
||||||
font-size: 0.75em;
|
font-size: 0.75em;
|
||||||
position: relative;
|
position: relative;
|
||||||
bottom: 0.15em;
|
bottom: 0.15em;
|
||||||
}
|
}
|
||||||
span.quote.speech::after {
|
span.quote.speech::after {
|
||||||
color: black;
|
color: #101030;
|
||||||
content: "\25c2";
|
content: "\25c2";
|
||||||
font-size: 0.75em;
|
font-size: 0.75em;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@ -116,14 +131,14 @@ span.quote.non-speech {
|
||||||
color: #303030;
|
color: #303030;
|
||||||
}
|
}
|
||||||
span.quote.non-speech::before {
|
span.quote.non-speech::before {
|
||||||
color: black;
|
color: #101030;
|
||||||
content: "\25b9";
|
content: "\25b9";
|
||||||
font-size: 0.75em;
|
font-size: 0.75em;
|
||||||
position: relative;
|
position: relative;
|
||||||
bottom: 0.15em;
|
bottom: 0.15em;
|
||||||
}
|
}
|
||||||
span.quote.non-speech::after {
|
span.quote.non-speech::after {
|
||||||
color: black;
|
color: #101030;
|
||||||
content: "\25c3";
|
content: "\25c3";
|
||||||
font-size: 0.75em;
|
font-size: 0.75em;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@ -149,6 +164,9 @@ span.quote.thought::after {
|
||||||
position: relative;
|
position: relative;
|
||||||
bottom: 0.15em;
|
bottom: 0.15em;
|
||||||
}
|
}
|
||||||
|
span.chapter {
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
span.chapter::before {
|
span.chapter::before {
|
||||||
content: "\25b9";
|
content: "\25b9";
|
||||||
font-size: 0.75em;
|
font-size: 0.75em;
|
||||||
|
|
|
@ -0,0 +1,20 @@
|
||||||
|
<!DOCTYPE html><html><head><title> Banished </title><link rel="stylesheet" type="text/css" href="html_resources/style.css"></head><body><a href="index.html"><button class="back"><</button></a>
|
||||||
|
<h1>Banished</h1>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
<span class="quote speech">Isabelle!</span><br />
|
||||||
|
<span class="quote speech">Lucas!</span><br />
|
||||||
|
<span class="quote speech">I got banished.</span><br />
|
||||||
|
<span class="quote speech">Wait what?</span><br />
|
||||||
|
The guard in front of her turns around:<br />
|
||||||
|
<span class="quote speech">No chit-chat, move along.</span><br />
|
||||||
|
Isabelle takes a moment to understand the implication of what Lucas had
|
||||||
|
said.<br />
|
||||||
|
<span class="quote speech">...ohhhhh. Congrats!</span><br />
|
||||||
|
The guards grab her by the arms and drag her away from his cell.<br />
|
||||||
|
<span class="quote speech">Move.</span><br />
|
||||||
|
<span class="comment">Lucas:</span>
|
||||||
|
<span class="quote speech">Good luck with your trial!</span>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p class="copyright">Copyright © 2023 Jan Danielzick (aka. BodgeMaster) – All rights reserved.</p><script>let spans = ["<span class=\"paper green\">", "<span>"]; let pre_texts = document.getElementsByTagName("pre"); for (let i = 0; i < pre_texts.length; i++) {if (pre_texts[i].className != "paper") continue; let lines = pre_texts[i].innerHTML.split("\n"); let result = ""; for (let j = 0; j < lines.length; j++) {result = result + spans[j%2] + lines[j] + " ".repeat(80-lines[j].length) + "</span>\n";} pre_texts[i].innerHTML = result;}</script></body></html>
|
Loading…
Reference in New Issue