Add website

[proportionaltomonofont] / assets / css / style.scss

diff --git a/assets/css/style.scss b/assets/css/style.scss
new file mode 100644 (file)
index 0000000..c7954eb
--- /dev/null
+++ b/assets/css/style.scss
@@ -0,0 +1,123 @@
+---
+---
+
+@import "{{ site.theme }}";
+
+@font-face {
+  font-family: Comic Mono;
+  font-weight: normal;
+  src: url(../../ComicMono.ttf);
+}
+
+@font-face {
+  font-family: Comic Mono;
+  font-weight: bold;
+  src: url(../../ComicMono-Bold.ttf);
+}
+
+// Colors are based on One Dark color scheme.
+
+html, body, .markdown-body.comic-mono {
+  background-color: #252423;
+  color: #bbbbbb;
+}
+
+.markdown-body.comic-mono {
+  color: #bbbbbb;
+  border-radius: 3px;
+  font-family: Comic Mono, Cousine, monospace;
+  -webkit-font-smoothing: antialiased;
+  line-height: 1.45;
+  overflow: auto;
+  padding: 16px;
+  max-width: 700px;
+  @media (min-width: 960px) {
+    max-width: 875px;
+    font-size: 20px;
+  }
+  h1, h2, h3, p, li, pre {
+    margin: 1.5em 0;
+    padding: 0;
+    font-size: 100%;
+    line-height: 1.5em;
+    border: none;
+  }
+  ul, ol {
+    margin: 0;
+    padding: 0;
+    list-style-position: inside;
+  }
+  ul {
+    list-style: none;
+  }
+  ul > li::before {
+    content: '* ';
+  }
+  h1, h2 {
+    color: #e06c75;
+  }
+  h1::before {
+    content: '# ';
+  }
+  h2::before {
+    content: '## ';
+  }
+  a {
+    color: #61afef;
+  }
+  a::before {
+    content: '[';
+    color: #5c6370;
+  }
+  a::after {
+    content: ']';
+    color: #5c6370;
+  }
+  code, pre {
+    font: inherit;
+    padding: 0;
+    background: none;
+  }
+  .highlight {
+    background: none;
+  }
+  pre {
+    &::before, &::after {
+      content: '```';
+      display: block;
+      color: #5c6370;
+    }
+  }
+  :not(pre) > code {
+    &::before, &::after {
+      content: '`';
+    }
+  }
+  .highlight {
+    .nn, .o {
+      color: inherit;
+    }
+    .c {
+      color: #5c6370;
+    }
+    .s {
+      color: #98c379;
+    }
+    .kn, .k, .ow {
+      color: #c678dd;
+    }
+    .mi, .mf {
+      color: #d19a66;
+    }
+    .nb {
+      color: #56b6c2;
+    }
+    .nf {
+      color: #61afef;
+    }
+  }
+}
+
+.website-hidden {
+  display: none;
+}
\ No newline at end of file