Add content and change style

This commit is contained in:
Case Duckworth 2019-03-12 00:34:27 -05:00
parent 91cf24845b
commit 815afd604e
2 changed files with 132 additions and 7 deletions

View File

@ -3,7 +3,9 @@
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport content="width=device-width, initial-scale=1">
<meta name="viewport"
content="width=device-width, initial-scale=1, user-scalable=yes">
<meta name="author" content="acdw">
<title>acdw's house</title>
@ -11,13 +13,80 @@
<script src="script.js" type="text/javascript"> </script>
</head>
<body>
<div id="everything">
<section id="cover">
<h1>~acdw</h1>
<a id="moon" href="moon/">&#127770;</a>
</section>
<div id="below-the-fold">
<main role="main">
<h1>Hey there</h1>
<p>What's up man?</p>
<section id="house">
<table id="site-header">
<tr><td>
<pre>
__
/ \
/ \
------
| ____|
| | ||
| | '||
~~~~~~~~
</pre>
</td>
<td id="titleblock">
<h1>acdw's house</h1>
<h2>in the
<a href="https://tilde.town">
~.town
</a>
</h2>
</td>
</tr>
</table>
</section>
<section id="links">
<h2>links</h2>
<dl>
<dt>world wide web</dt>
<dd><a href="feels">
feels</a></dd>
<dd><a href="https://www.acdw.net">
my "real" website</a></dd>
<dd><a href="/~loosepoops/">
L&nbsp;O&nbsp;O&nbsp;S&nbsp;E&nbsp;P&nbsp;O&nbsp;O&nbsp;P&nbsp;S</a></dd>
<dt>around town</dt>
<dd><a href="/~troido/cadastre/town.html">
town plots</a></dd>
<dd><a href="/~demophoon/">
~demophoon</a></dd>
</dl>
</section>
</main>
<footer>
<span class="ring" id="tilde_ring">
<em>a member of the ~ring</em>
(<a href="/~eeeeeta/ring/join.html">join</a>)
</span>
<span class="ring-links">
<a id="tilde_town_ring" class="tilde_ring_link" href="">
random ~user
</a>
| <a id="random_tildebox" class="tilde_ring_link" href="">
random ~box
</a>
| <a id="tilde_town_ring_next" class="tilde_ring_link" href="">
next ~user
</a>
</span>
<script type="text/javascript">
var ringjs = document.createElement('script')
ringjs.src = document.location.protocol
+ '//tilde.town/~login/tilde_ring.js'
document.getElementById('tilde_ring').appendChild(ringjs)
</script>
</footer>
</div>
</div>
</body>
</html>

View File

@ -6,6 +6,8 @@ body,
margin: 0;
padding: 0;
}
html { font: 16px/22px "Courier Prime", "Courier New", monospace; }
body { background: PapayaWhip; }
#cover h1 {
position: absolute;
@ -13,6 +15,15 @@ body,
bottom: 1em;
font-size: 3em;
}
#cover {
position: fixed;
color: white;
height: 100vh;
width: 100vw;
margin: 0;
padding: 0;
background: no-repeat center/100% url("flamingobathroom.jpg");
}
#moon {
position: absolute;
@ -20,14 +31,59 @@ body,
text-decoration: none;
}
#cover {
background: no-repeat center/100% url("flamingobathroom.jpg");
#everything {
height: 100vh;
position: relative;
color: white;
}
body {
#below-the-fold {
position: relative;
top: 100vh;
}
main { }
main section {
max-width: 50rem;
width: 90%;
margin: 0 auto;
background: papayawhip;
padding: 1rem;
border-radius: 5px;
margin-bottom: 1rem;
}
main section :first-child {
margin-top: 0;
padding-top: 0;
}
#house pre {
background-color: #efd5ff;
padding-right: 1rem;
}
#titleblock {
text-align: right;
width: 100%;
}
footer {
max-width: 50rem;
width: 90%;
margin: 0 auto;
padding: 0 1rem;
background-color: #d5efff;
text-align: right;
border-radius: 5px 5px 0 0;
}
a {
color: inherit;
}
a:link {}
a:active {
text-transform: uppercase;
}
a:hover {
text-transform: uppercase;
background-color: #d5d5ff;
}
a:visited {}