Initial site layout

5 files changed, 250 insertions, 0 deletions

diff --git a/static/css/style.css b/static/css/style.css
new file mode 100644
index 0000000..3e7670a
--- /dev/null
+++ b/static/css/style.css
@@ -0,0 +1,191 @@
+/*
+  The MIT License (MIT)
+
+  Copyright (c) 2019 panr
+  Copyright (c) 2019 David T. Sadler
+
+  Permission is hereby granted, free of charge, to any person obtaining a copy of
+  this software and associated documentation files (the "Software"), to deal in
+  the Software without restriction, including without limitation the rights to
+  use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+  the Software, and to permit persons to whom the Software is furnished to do so,
+  subject to the following conditions:
+
+  The above copyright notice and this permission notice shall be included in all
+  copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+  FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+  COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+  IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+  CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+*/
+
+html {
+  box-sizing: border-box;
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+}
+
+html {
+  color: #ffffff;
+  font-family: 'Fira Code', Monaco, Consolas, Ubuntu Mono, monospace;
+  font-size: 1em;
+  line-height: 1.4;
+}
+
+body {
+  max-width: 800px;
+  margin: auto;
+  background-color: #1f222a;
+  padding: 8px;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  color: #78e2a0;
+}
+
+a {
+  color: inherit;
+}
+
+ol, ul {
+  margin: 8px;
+}
+
+table {
+  table-layout: fixed;
+  border-collapse: collapse;
+  width: 100%;
+  margin: 40px 0;
+}
+
+table, th, td {
+  border: 1px dashed #78e2a0;
+  padding: 10px;
+}
+
+th {
+  color: var(--accent);
+}
+
+article {
+  text-align: left;
+}
+
+hr {
+  height: 1px;
+  border: none;
+  background-color: #78e2a0;
+}
+
+img {
+  width: 100%;
+}
+
+header div {
+  display: flex;
+  flex: 1;
+}
+
+header div::after {
+  background: repeating-linear-gradient(90deg,#78e2a0,#78e2a0 2px,transparent 0,transparent 10px);
+  content: "";
+  display: block;
+  right: 10px;
+  width: 100%;
+}
+
+header a {
+  color: #000000;
+  background-color: #78e2a0;
+  padding: 4px 16px;
+  text-decoration: none;
+  flex: 0 0 auto;
+}
+
+nav {
+  margin: 16px 0;
+}
+
+nav ul {
+  display: flex;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+nav li {
+  padding-right: 16px;
+}
+
+article h1 {
+  border-bottom: 3px dotted #78e2a0;
+  padding-bottom: 8px;
+  position: relative;
+}
+
+article h1:after {
+  border-bottom: 3px dotted #78e2a0;
+  bottom: 2px;
+  content: "";
+  display: block;
+  position: absolute;
+  width: 100%;
+}
+
+nav.pagination {
+  margin-top: 32px;
+}
+
+nav.pagination p {
+  margin: 0;
+  text-align: center;
+}
+
+nav.pagination ul {
+  display: flex;
+  justify-content: center;
+}
+
+nav.pagination li {
+  padding-right: 0;
+  flex-grow: 1;
+}
+
+nav.pagination li.prev {
+  text-align: left;
+}
+
+nav.pagination li.next {
+  text-align: right;
+}
+
+nav.pagination li a {
+  text-decoration: none;
+}
+
+footer {
+  text-align: center;
+  margin-top: 32px;
+  opacity: .5;
+}
+
+@font-face {
+  font-family: 'Fira Code';
+  font-style:  normal;
+  font-weight: 400;
+  src: url("../fonts/FiraCode-Regular.woff") format("woff");
+}
+
+@font-face {
+  font-family: 'Fira Code';
+  font-style:  normal;
+  font-weight: 800;
+  src: url("../fonts/FiraCode-Bold.woff") format("woff");
+}
diff --git a/static/css/syntax.css b/static/css/syntax.css
new file mode 100644
index 0000000..681758d
--- /dev/null
+++ b/static/css/syntax.css
@@ -0,0 +1,59 @@
+/* Background */ .chroma { color: #f8f8f2; background-color: #272822 }
+/* Error */ .chroma .err { color: #960050; background-color: #1e0010 }
+/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
+/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; }
+/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc }
+/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; }
+/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; }
+/* Keyword */ .chroma .k { color: #66d9ef }
+/* KeywordConstant */ .chroma .kc { color: #66d9ef }
+/* KeywordDeclaration */ .chroma .kd { color: #66d9ef }
+/* KeywordNamespace */ .chroma .kn { color: #f92672 }
+/* KeywordPseudo */ .chroma .kp { color: #66d9ef }
+/* KeywordReserved */ .chroma .kr { color: #66d9ef }
+/* KeywordType */ .chroma .kt { color: #66d9ef }
+/* NameAttribute */ .chroma .na { color: #a6e22e }
+/* NameClass */ .chroma .nc { color: #a6e22e }
+/* NameConstant */ .chroma .no { color: #66d9ef }
+/* NameDecorator */ .chroma .nd { color: #a6e22e }
+/* NameException */ .chroma .ne { color: #a6e22e }
+/* NameFunction */ .chroma .nf { color: #a6e22e }
+/* NameOther */ .chroma .nx { color: #a6e22e }
+/* NameTag */ .chroma .nt { color: #f92672 }
+/* Literal */ .chroma .l { color: #ae81ff }
+/* LiteralDate */ .chroma .ld { color: #e6db74 }
+/* LiteralString */ .chroma .s { color: #e6db74 }
+/* LiteralStringAffix */ .chroma .sa { color: #e6db74 }
+/* LiteralStringBacktick */ .chroma .sb { color: #e6db74 }
+/* LiteralStringChar */ .chroma .sc { color: #e6db74 }
+/* LiteralStringDelimiter */ .chroma .dl { color: #e6db74 }
+/* LiteralStringDoc */ .chroma .sd { color: #e6db74 }
+/* LiteralStringDouble */ .chroma .s2 { color: #e6db74 }
+/* LiteralStringEscape */ .chroma .se { color: #ae81ff }
+/* LiteralStringHeredoc */ .chroma .sh { color: #e6db74 }
+/* LiteralStringInterpol */ .chroma .si { color: #e6db74 }
+/* LiteralStringOther */ .chroma .sx { color: #e6db74 }
+/* LiteralStringRegex */ .chroma .sr { color: #e6db74 }
+/* LiteralStringSingle */ .chroma .s1 { color: #e6db74 }
+/* LiteralStringSymbol */ .chroma .ss { color: #e6db74 }
+/* LiteralNumber */ .chroma .m { color: #ae81ff }
+/* LiteralNumberBin */ .chroma .mb { color: #ae81ff }
+/* LiteralNumberFloat */ .chroma .mf { color: #ae81ff }
+/* LiteralNumberHex */ .chroma .mh { color: #ae81ff }
+/* LiteralNumberInteger */ .chroma .mi { color: #ae81ff }
+/* LiteralNumberIntegerLong */ .chroma .il { color: #ae81ff }
+/* LiteralNumberOct */ .chroma .mo { color: #ae81ff }
+/* Operator */ .chroma .o { color: #f92672 }
+/* OperatorWord */ .chroma .ow { color: #f92672 }
+/* Comment */ .chroma .c { color: #75715e }
+/* CommentHashbang */ .chroma .ch { color: #75715e }
+/* CommentMultiline */ .chroma .cm { color: #75715e }
+/* CommentSingle */ .chroma .c1 { color: #75715e }
+/* CommentSpecial */ .chroma .cs { color: #75715e }
+/* CommentPreproc */ .chroma .cp { color: #75715e }
+/* CommentPreprocFile */ .chroma .cpf { color: #75715e }
+/* GenericDeleted */ .chroma .gd { color: #f92672 }
+/* GenericEmph */ .chroma .ge { font-style: italic }
+/* GenericInserted */ .chroma .gi { color: #a6e22e }
+/* GenericStrong */ .chroma .gs { font-weight: bold }
+/* GenericSubheading */ .chroma .gu { color: #75715e }
diff --git a/static/fonts/FiraCode-Bold.woff b/static/fonts/FiraCode-Bold.woff
new file mode 100644
index 0000000..dd7abb6
--- /dev/null
+++ b/static/fonts/FiraCode-Bold.woff
diff --git a/static/fonts/FiraCode-Regular.woff b/static/fonts/FiraCode-Regular.woff
new file mode 100644
index 0000000..5e4106f
--- /dev/null
+++ b/static/fonts/FiraCode-Regular.woff
diff --git a/static/img/green.png b/static/img/green.png
new file mode 100644
index 0000000..4909792
--- /dev/null
+++ b/static/img/green.png