initial layout and styles
This commit is contained in:
parent
4da2f1815c
commit
0dcc38dc3a
2 changed files with 101 additions and 0 deletions
41
index.html
Normal file
41
index.html
Normal file
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>landing</title>
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<div id="header">
|
||||
<header>
|
||||
<h1>zoner.work</h1>
|
||||
<p><a href="https://status.zoner.work">Status Page</a></p>
|
||||
</header>
|
||||
</div>
|
||||
<div id="linkblock">
|
||||
<h3>social</h3>
|
||||
<p><a href="https://zoner.work">Sharkey</a></p>
|
||||
<p><a href="https://wf.zoner.work">Writefreely</a></p>
|
||||
<p><a href="https://m.zoner.work">Matrix</a></p>
|
||||
</div>
|
||||
<div id="linkblock">
|
||||
<h3>a/v</h3>
|
||||
<p><a href="https://inv.zoner.work">Invidious</a></p>
|
||||
</div>
|
||||
<div id="linkblock">
|
||||
<h3>utility</h3>
|
||||
<p><a href="https://nc.zoner.work">Nextcloud</a></p>
|
||||
<p><a href="https://search.zoner.work">SearXNG</a></p>
|
||||
<p><a href="https://git.zoner.work">Forgejo</a></p>
|
||||
</div>
|
||||
<div id="description">
|
||||
<hr>
|
||||
<p>zoner.work is a network of hosted services and community spaces administrated by <a href="https://zoner.work/@fen">fennel kora</a>.
|
||||
this network's purpose is to maintain inclusive, safe spaces for those who need them that stand apart from a corporatized, centralized web.</p>
|
||||
<p>All account-based services are open to registration by invite. Please reach out to fen for details. Sharkey is open for public registrations,
|
||||
though accounts will still require systematic approval.</p>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
60
style.css
Normal file
60
style.css
Normal file
|
@ -0,0 +1,60 @@
|
|||
body {
|
||||
background-image: url("https://i.zoner.work/firefish/kyushu.jpg");
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
font-family: sans-serif;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
margin-top: 150px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 50%;
|
||||
min-width: 600px;
|
||||
padding:2em;
|
||||
background-color: #0D1117;
|
||||
border-radius: 40px;
|
||||
box-shadow: 3px 3px 5px #111111;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
p {
|
||||
padding: 0px;
|
||||
margin: 0.8em;
|
||||
font-size: 0.9em
|
||||
}
|
||||
|
||||
#linkblock {
|
||||
flex: 1;
|
||||
padding-left: 2em;
|
||||
border-left: 1px solid rgba(255, 255, 255,0.3);
|
||||
}
|
||||
|
||||
#header {
|
||||
flex: 2;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
margin-top: auto;
|
||||
margin-bottom: auto;
|
||||
}
|
||||
|
||||
a {
|
||||
color: white;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: orangered
|
||||
}
|
||||
|
||||
#description {
|
||||
order: 6;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 2em;
|
||||
}
|
Loading…
Reference in a new issue