1 files changed, 411 insertions, 0 deletions
diff --git a/root/static/style/text$css.css b/root/static/style/text$css.css
new file mode 100644
index 0000000..c0dc484
--- /dev/null
+++ b/root/static/style/text$css.css
@@ -0,0 +1,411 @@
+:root {
+  --gray-bright:  #eeeeee;
+  --gray-dark:    #303336;
+  --gray-darker:  #1d1f21;
+  --gray-neutral: #b9bdc1;
+  --gray-success: #bdddc1;
+  --gray-fail:    #ddbdc1;
+  --margin-wide: 2rem; }
+  @media only screen and (max-width: 425px) {
+    :root {
+      --margin-wide: 0.5rem; } }
+
+* {
+  font-weight: inherit;
+  font-style: inherit;
+  font-family: inherit;
+  color: inherit;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale; }
+
+body, html, h1, h2, h3, h4, h5, h6 {
+  margin: 0;
+  padding: 0; }
+
+h1, h2, h3, h4, h5, h6 {
+  font-weight: bold; }
+
+input, select, button {
+  color: initial; }
+
+tt, code, kbd, samp {
+  font-family: monospace; }
+
+code {
+  font-size: 0.8em; }
+
+b, strong {
+  font-weight: bold; }
+
+em, i {
+  font-style: italic; }
+
+a {
+  font-size: 1em;
+  cursor: pointer; }
+
+hr {
+  clear: both; }
+
+ul {
+  margin: 0; }
+
+body {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  background: #ffffff;
+  font-family: sans-serif;
+  min-height: 100vh; }
+
+a {
+  display: inline-block;
+  font-weight: bold;
+  text-decoration: underline;
+  text-decoration-color: transparent;
+  transition: filter 500ms, text-decoration-color 500ms; }
+  a:hover {
+    filter: invert(40%);
+    text-decoration-color: currentColor; }
+
+::selection {
+  background: #303336;
+  color: #eeeeee;
+  padding: 1em; }
+
+/*
+
+vim-hybrid theme by w0ng (https://github.com/w0ng/vim-hybrid)
+
+*/
+/*background color*/
+.hljs {
+  background: #1d1f21;
+  border-radius: 6px;
+  padding: 0.2em 0.5em;
+  white-space: nowrap; }
+
+pre > .hljs {
+  display: block;
+  overflow-x: auto;
+  padding: 1em;
+  white-space: pre-wrap;
+  margin: 0 2em; }
+
+/*selection color*/
+.hljs::selection,
+.hljs span::selection {
+  background: #373b41; }
+
+.hljs::-moz-selection,
+.hljs span::-moz-selection {
+  background: #373b41; }
+
+/*foreground color*/
+.hljs {
+  color: #c5c8c6; }
+
+/*color: fg_yellow*/
+.hljs-title,
+.hljs-name {
+  color: #f0c674; }
+
+/*color: fg_comment*/
+.hljs-comment,
+.hljs-meta,
+.hljs-meta .hljs-keyword {
+  color: #707880; }
+
+/*color: fg_red*/
+.hljs-number,
+.hljs-symbol,
+.hljs-literal,
+.hljs-deletion,
+.hljs-link {
+  color: #cc6666; }
+
+/*color: fg_green*/
+.hljs-string,
+.hljs-doctag,
+.hljs-addition,
+.hljs-regexp,
+.hljs-selector-attr,
+.hljs-selector-pseudo {
+  color: #b5bd68; }
+
+/*color: fg_purple*/
+.hljs-attribute,
+.hljs-code,
+.hljs-selector-id {
+  color: #b294bb; }
+
+/*color: fg_blue*/
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-bullet,
+.hljs-tag {
+  color: #81a2be; }
+
+/*color: fg_aqua*/
+.hljs-subst,
+.hljs-variable,
+.hljs-template-tag,
+.hljs-template-variable {
+  color: #8abeb7; }
+
+/*color: fg_orange*/
+.hljs-type,
+.hljs-built_in,
+.hljs-builtin-name,
+.hljs-quote,
+.hljs-section,
+.hljs-selector-class {
+  color: #de935f; }
+
+.hljs-emphasis {
+  font-style: italic; }
+
+.hljs-strong {
+  font-weight: bold; }
+
+header > div {
+  font-family: 'Source Sans Pro', sans-serif;
+  padding: 1rem 2rem;
+  text-align: right;
+  color: #eeeeee;
+  background: #303336; }
+  header > div h1 {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    flex-wrap: wrap;
+    margin: 0;
+    line-height: 5rem;
+    font-size: 4rem;
+    font-weight: 200; }
+    header > div h1 > span {
+      margin-left: auto; }
+    header > div h1 .bold {
+      font-weight: 400; }
+    header > div h1 > a {
+      height: 5rem; }
+    header > div h1 .sun {
+      height: 100%;
+      stroke: currentColor;
+      fill: currentColor; }
+      header > div h1 .sun .out, header > div h1 .sun .in {
+        animation: spin 2s;
+        animation-iteration-count: 1;
+        transform: scale(1); }
+      header > div h1 .sun .in {
+        animation: size 2s; }
+      header > div h1 .sun.spin .circle {
+        animation: none; }
+
+header aside {
+  margin: 0;
+  padding: 0 2rem;
+  color: #eeeeee;
+  background: #1d1f21;
+  line-height: 3em; }
+  header aside > a {
+    margin-right: 2em; }
+
+@keyframes spin {
+  0% {
+    transform: rotate3d(0.5, 1, 0, 0turn); }
+  100% {
+    transform: rotate3d(0.5, 1, 0, 1turn); } }
+
+@keyframes size {
+  0%, 100% {
+    transform: scale(1); }
+  40%, 60% {
+    transform: scale(1.8); } }
+
+footer {
+  display: flex;
+  padding: 1rem 2rem;
+  position: sticky;
+  bottom: 0;
+  color: #eeeeee;
+  background: #303336; }
+  footer .icons {
+    flex: 1;
+    display: flex;
+    justify-content: flex-end; }
+    footer .icons .iconlink {
+      filter: invert(0.7); }
+      footer .icons .iconlink:hover {
+        filter: invert(1); }
+      footer .icons .iconlink > img {
+        height: 1em;
+        margin-left: 0.5em;
+        vertical-align: middle; }
+
+.browser {
+  display: flex;
+  flex: 1;
+  border-top: 0.2rem solid #eeeeee; }
+
+.view {
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 0;
+  min-width: 0; }
+  .view.inspector {
+    top: 0;
+    position: sticky;
+    max-height: 100vh;
+    color: #c5c8c6;
+    border-style: solid;
+    border-width: 0 0 0 0.6rem;
+    border-radius: 0 6px 6px 0;
+    border-color: #303336;
+    background: #303336; }
+    .view.inspector nav {
+      background: inherit; }
+    .view.inspector .content {
+      margin: 0;
+      padding: 0;
+      display: flex;
+      background: #1d1f21; }
+      .view.inspector .content > * {
+        display: block;
+        margin: 0;
+        padding: 1em;
+        border-radius: 0;
+        border: 0;
+        flex: 1; }
+  .view nav {
+    position: sticky;
+    top: 0;
+    display: flex;
+    flex: 0 0 auto;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    background: #eeeeee;
+    z-index: 1000; }
+    .view nav > span:first-of-type {
+      flex: 1 0 auto; }
+    .view nav > * {
+      margin: 1em;
+      white-space: nowrap; }
+    @media only screen and (max-width: 425px) {
+      .view nav > .inspect-btn {
+        display: none; } }
+  .view .error-wrap {
+    flex: 0 0 auto;
+    padding: 1em 2em;
+    overflow: hidden;
+    background: #ddbdc1; }
+    .view .error-wrap.empty {
+      display: none; }
+    .view .error-wrap > span {
+      display: inline-block;
+      margin-bottom: 0.5em;
+      font-weight: bold;
+      color: #f00; }
+    .view .error-wrap > pre {
+      margin: 0; }
+  .view .content {
+    flex: 1 1 auto;
+    overflow: auto;
+    padding: 1em 2em;
+    position: relative; }
+
+.content {
+  opacity: 1;
+  transition: opacity 150ms; }
+  body.loading .content {
+    opacity: 0; }
+
+.content img, .content video {
+  width: inherit;
+  height: inherit; }
+
+.content .markdown > img, .content .markdown > video,
+.content .markdown > p > img,
+.content .markdown > p > video,
+.content .markdown > p > a > img,
+.content .markdown > p > a > video,
+.content .markdown > a > img,
+.content .markdown > a > video {
+  display: block;
+  max-width: 100%;
+  max-height: 50vh;
+  padding: 0 2em;
+  box-sizing: border-box; }
+
+.content .embed {
+  width: inherit;
+  height: inherit; }
+  .content .embed .description {
+    text-align: center; }
+  .content .embed.inline {
+    display: inline-block; }
+  .content .embed.desc {
+    display: inline-block;
+    padding: 0.5em;
+    margin: 0.2em;
+    background: #eeeeee; }
+
+.content pre > code {
+  border-style: solid;
+  border-width: 0 0 0 0.6rem;
+  border-radius: 0 6px 6px 0;
+  border-color: #303336;
+  display: block;
+  border-radius: 6px;
+  margin: 0 var(--margin-wide);
+  padding: 1em;
+  white-space: pre-wrap;
+  overflow-x: auto;
+  background: #1d1f21;
+  color: #c5c8c6; }
+
+.content pre.dual-code {
+  display: flex;
+  justify-content: space-between;
+  padding: 0 2rem; }
+  .content pre.dual-code > code {
+    border-style: solid;
+    border-width: 0 0.3rem 0 0;
+    border-radius: 6px 0 0 6px;
+    flex: 1;
+    margin: 0; }
+  .content pre.dual-code > code + code {
+    border-style: solid;
+    border-width: 0 0 0 0.3rem;
+    border-radius: 0 6px 6px 0; }
+
+.content .example, .content .well {
+  border-style: solid;
+  border-width: 0 0 0 0.6rem;
+  border-radius: 0 6px 6px 0;
+  margin: 1rem var(--margin-wide);
+  padding: 1rem;
+  background: #eeeeee;
+  border-color: #b9bdc1; }
+
+.canvas_app {
+  position: relative;
+  display: inline-block; }
+  .canvas_app .overlay {
+    position: absolute;
+    padding: 1rem;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    opacity: 0;
+    background: rgba(0, 0, 0, 0.7);
+    transition: opacity 300ms; }
+    .canvas_app .overlay:hover {
+      opacity: 1; }
+    .canvas_app .overlay > * {
+      margin: 0.5em; }
+    .canvas_app .overlay a {
+      display: block;
+      color: #eeeeee;
+      font-family: inherit; }