4 files changed, 166 insertions, 0 deletions
diff --git a/img/dark_logo.png b/img/dark_logo.png
new file mode 100755
index 0000000..89eba3e
--- /dev/null
+++ b/img/dark_logo.png
diff --git a/img/white_logo.png b/img/white_logo.png
new file mode 100755
index 0000000..ef326a1
--- /dev/null
+++ b/img/white_logo.png
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..da54545
--- /dev/null
+++ b/index.html
@@ -0,0 +1,62 @@
+<DOCTYPE html>
+<html>
+<head>
+    <title>sys-core.org</title>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" type="text/css" href="style.css">
+</head>
+<body>
+<div id="container">
+
+    <div id="nav">
+	<img src="img/white_logo.png" id="white_logo" alt=>
+	<img src="img/dark_logo.png" id="dark_logo" alt=>
+        <ul>
+            <li><a href="">mailing list</a></li>
+            <li><a href="https://git.sys-core.org">source code</a></li>
+        </ul>
+    </div>
+
+<div id="main">
+<p>Modern software is too large, too fragile, and too dependent on layers its own authors no longer understand.</p>
+<p>We reject this.</p>
+<p>We believe software should be:</p>
+
+<ul>
+	<li><p>Small enough to understand.</p></li>
+	<li><p>Simple enough to modify.</p></li>
+	<li><p>Clear enough to trust.</p></li>
+	<li><p>Stable enough to last.</p></li>
+	<li><p>Portable enough to survive platforms.</p></li>
+	<li><p>Useful before it is fashionable.</p></li>
+</ul>
+
+<p>Complexity is not sophistication.</p>
+<p>Abstraction is not always progress.</p>
+<p>Dependencies are not free.</p>
+<p>More code is not more value.</p>
+
+<p>A good program does one thing directly and predictably.</p>
+<p>Its source code is part of its interface.</p>
+<p>Its behavior should be explainable without mythology.</p>
+<p>Its build system should not be larger than the program.</p>
+<p>Its failure modes should be obvious.</p>
+
+<p>We prefer:</p>
+
+<ul>
+	<li><p>Plain text over opaque formats.</p></li>
+	<li><p>Source code over generated machinery.</p></li>
+	<li><p>Explicit behavior over hidden magic.</p></li>
+	<li><p>Small tools over monolithic systems.</p></li>
+	<li><p>Correctness over convenience.</p></li>
+	<li><p>Maintenance over novelty.</p></li>
+</ul>
+
+</div>
+</div>
+
+</body>
+</html>
+
diff --git a/style.css b/style.css
new file mode 100755
index 0000000..09802cd
--- /dev/null
+++ b/style.css
@@ -0,0 +1,104 @@
+body {
+        background:#ffffff;
+	margin: 0;
+	width: 90vw;
+}
+
+* {
+	box-sizing: border-box;
+}
+
+p {
+	text-align: none;
+	color: #000000;
+	margin-top: 0.5vh;
+	margin-bottom:0.5vh;
+}
+
+h1 {
+	color: #000000;
+	text-align: center;
+}
+
+img {
+	display: block;
+	margin: 0 auto;
+}
+
+
+#container {
+	height: 100%;
+	margin: auto;
+	display: flex;
+	justify-content: flex-start;
+}
+
+#main {
+	height: 100%;
+	padding-left: 10vw;
+	padding-top: 10vh;
+	padding-bottom: 10vh;
+	padding-right: 10vw;
+}
+
+#nav {
+	width: 12vw;
+	background-color: #000000;
+}
+
+#nav ul {
+	text-align: center;
+	padding: 0;
+	margin: 0;
+	list-style-type: none;
+}
+
+#nav li {
+	padding-top: 1vh;
+	padding-bottom: 1vh;
+}
+
+#nav li a {
+	color: #ffffff;
+	text-decoration: none;
+}
+
+#dark_logo {
+	display: none;		
+}
+
+#white_logo {
+	display: block;
+}
+
+@media (prefers-color-scheme: dark){
+    body {
+        background-color:#000000;
+        color: #ffffff;
+    }
+
+    .content a {
+        color: white;
+    }
+
+    	#dark_logo {
+		display: block;
+	}
+
+    	#white_logo {
+		display: none;		
+	}
+
+    #nav {
+        background-color:#ffffff;
+    }
+
+    #nav li a {
+        color:#000000;
+    }
+
+    p {
+	color: white;
+    }
+
+}