commit
8aed4100db
20
index.html
20
index.html
|
@ -1,15 +1,33 @@
|
||||||
|
<html lang="en-US">
|
||||||
<head>
|
<head>
|
||||||
<link rel="stylesheet" href="style.css">
|
<link rel="stylesheet" href="style.css">
|
||||||
|
|
||||||
|
<!-- metadata -->
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="author" content="Luna">
|
||||||
|
|
||||||
|
<meta name="og:title" content="Text Adventure">
|
||||||
|
<meta name="og:description" content="A small text adventure made in javascript by a beautiful girl">
|
||||||
|
<meta name="og:image" content="/greaterthans.png">
|
||||||
|
|
||||||
|
<link rel="icon" href="/greaterthans.png">
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<!-- top of terminal window -->
|
||||||
<div id="roundedtop"><h2 id="terminal">Terminal</h2><h2 id="fakebuttons">_ ☐ X</h2></div>
|
<div id="roundedtop"><h2 id="terminal">Terminal</h2><h2 id="fakebuttons">_ ☐ X</h2></div>
|
||||||
|
<!-- the main text area -->
|
||||||
<div id="userText">
|
<div id="userText">
|
||||||
<p></p>
|
<p></p>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- user input -->
|
||||||
<input type="text" id="userInput" name="inputBox" placeholder="Command">
|
<input type="text" id="userInput" name="inputBox" placeholder="Command">
|
||||||
<div id="infobox"><h4>Info:</h4><p>This game and website are a complete work in progress. None of this is final. If you have any suggestions feel free to contact Luna.</p></div>
|
<!-- info box at the bottom -->
|
||||||
|
<div id="infobox"><h4>Info:</h4><p>This game and website are a complete work in progress. None of this is final. If you have any suggestions feel free to contact <a href="https://kitty.lgbt/about/" alt="Luna's contact info">Luna</a>.</p></div>
|
||||||
|
<!-- load scripts -->
|
||||||
<script src="verbhandler.js"></script>
|
<script src="verbhandler.js"></script>
|
||||||
<script src="inventory.js"></script>
|
<script src="inventory.js"></script>
|
||||||
<script src="locations.js"></script>
|
<script src="locations.js"></script>
|
||||||
<script src="index.js"></script>
|
<script src="index.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
</html>
|
||||||
|
|
|
@ -0,0 +1,2 @@
|
||||||
|
User-agent: Googlebot
|
||||||
|
Disallow: /
|
43
style.css
43
style.css
|
@ -1,6 +1,14 @@
|
||||||
|
:root {
|
||||||
|
--term-colour: white;
|
||||||
|
--term-bg-colour: #3C3C3C;
|
||||||
|
--main-colour: white;
|
||||||
|
--main-bg-colour: #3C3C3C;
|
||||||
|
--body-bg-colour: black;
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
background-color: black;
|
background-color: var(--body-bg-colour);
|
||||||
font-family: "Courier New", monospace;
|
font-family: "Courier New", monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -8,27 +16,43 @@ p {
|
||||||
padding-left: 1%;
|
padding-left: 1%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #fdffea;
|
||||||
|
}
|
||||||
|
|
||||||
#fakebuttons {
|
#fakebuttons {
|
||||||
margin: auto;
|
margin: auto;
|
||||||
padding-top: 1%;
|
padding-top: 1%;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
float: right;
|
float: right;
|
||||||
padding-right: 2%;
|
padding-right: 2%;
|
||||||
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#terminal {
|
#terminal {
|
||||||
display:inline-block;
|
display:inline-block;
|
||||||
font-weight: bolder;
|
font-weight: bolder;
|
||||||
}
|
}
|
||||||
|
h2#terminal {
|
||||||
|
margin: 10px;
|
||||||
|
padding-left: 12%;
|
||||||
|
align-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
#infobox {
|
#infobox {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
background: rgb(60, 60, 60);
|
background: rgb(60, 60, 60);
|
||||||
color:white;
|
color: var(--main-colour);
|
||||||
width: 50%;
|
width: 50%;
|
||||||
height: 10%;
|
height: 10%;
|
||||||
margin-left: 25%;
|
margin-left: 25%;
|
||||||
margin-top: 5%;
|
margin-top: 5%;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
padding: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#roundedtop {
|
#roundedtop {
|
||||||
|
@ -37,14 +61,14 @@ p {
|
||||||
border-color: rgb(60, 60, 60);
|
border-color: rgb(60, 60, 60);
|
||||||
border-bottom: solid;
|
border-bottom: solid;
|
||||||
border-bottom-color: darkgray;
|
border-bottom-color: darkgray;
|
||||||
border-width: 1px;
|
border-width: 2px;
|
||||||
height: 5%;
|
height: 5%;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
margin-top: 5%;
|
margin-top: 5%;
|
||||||
margin-left: 25%;
|
margin-left: 25%;
|
||||||
background-color: rgb(60, 60, 60);
|
background-color: rgb(60, 60, 60);
|
||||||
position: relative;
|
position: relative;
|
||||||
color:white;
|
color: var(--main-colour);
|
||||||
font-weight: bolder;
|
font-weight: bolder;
|
||||||
word-spacing: 10px;
|
word-spacing: 10px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -53,8 +77,8 @@ p {
|
||||||
#userText {
|
#userText {
|
||||||
margin-left: 25%;
|
margin-left: 25%;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
background-color: rgb(60, 60, 60);
|
background-color: var(--term-bg-colour);
|
||||||
color: white;
|
color: var(--term-colour);
|
||||||
text-align: left;
|
text-align: left;
|
||||||
height: 45%;
|
height: 45%;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
|
@ -68,11 +92,12 @@ p {
|
||||||
background-image: url('./greaterthans.png');
|
background-image: url('./greaterthans.png');
|
||||||
background-position: 10px 10px;
|
background-position: 10px 10px;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background: rgb(60, 60, 60);
|
background: var(--term-bg-colour);
|
||||||
color: white;
|
color: var(--term-colour);
|
||||||
border-top: solid;
|
border-top: solid;
|
||||||
border-color: darkgray;
|
border-color: darkgray;
|
||||||
border-width: 1px;
|
border-width: 2px;
|
||||||
|
font-family: monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
#userInput:focus {
|
#userInput:focus {
|
||||||
|
|
Loading…
Reference in New Issue