aboutsummaryrefslogtreecommitdiffstats
path: root/scss
diff options
context:
space:
mode:
Diffstat (limited to 'scss')
-rw-r--r--scss/_browser.scss147
-rw-r--r--scss/_canvasapp.scss36
-rw-r--r--scss/_content.scss166
-rw-r--r--scss/_defs.scss49
-rw-r--r--scss/_footer.scss43
-rw-r--r--scss/_header.scss81
-rw-r--r--scss/_print.scss45
-rw-r--r--scss/_reset.scss72
-rw-r--r--scss/_sidenotes.scss73
-rw-r--r--scss/codemirror.scss73
-rw-r--r--scss/hljs.scss110
-rw-r--r--scss/main.scss11
12 files changed, 0 insertions, 906 deletions
diff --git a/scss/_browser.scss b/scss/_browser.scss
deleted file mode 100644
index 89628fd..0000000
--- a/scss/_browser.scss
+++ /dev/null
@@ -1,147 +0,0 @@
-.browser {
- display: flex;
- flex: 1;
-
- border-top: 0.2rem solid $gray-bright;
-}
-
-.view {
- display: flex;
- flex-direction: column;
-
- flex: 1 0 auto;
- min-width: 0;
- max-width: calc(100vw - 1rem);
-
- &.inspector {
- top: 0;
- position: sticky;
- max-height: calc(100vh - 3rem);
- color: #c5c8c6;
-
- @include left-border;
- border-color: $gray-dark;
- background: $gray-dark;
-
- nav {
- background: inherit;
- }
-
- .subnav {
- display: flex;
- flex: 0;
- background: $gray-darker;
- border-bottom: 2px solid $gray-dark;
- padding: 0.5em;
- }
-
- .content {
- margin: 0;
- padding: 0;
- display: flex;
- align-self: stretch;
- background: $gray-darker;
-
- > * {
- display: block;
- margin: 0;
- padding: 1em;
- border-radius: 0;
- border: 0;
- flex: 1;
- }
- }
-
- .children {
- margin: 0;
- padding: 1em;
-
- align-self: stretch;
- background: $gray-darker;
- }
- }
-
- nav {
- position: sticky;
- top: 0;
-
- @media print {
- position: relative;
- display: none;
- }
-
- display: flex;
- flex: 0 0 auto;
- flex-wrap: wrap;
- justify-content: space-between;
- background: $gray-bright;
- z-index: 1000;
-
- > span:first-of-type {
- flex: 1 0 auto;
- }
-
- > * {
- margin: 1em;
- white-space: nowrap;
- }
-
- &.thin > * {
- margin: 0.5em 1em;
- }
-
- > .inspect-btn {
- @include media-small() { display: none; }
- }
-
- .tight {
- margin-left: 0;
- }
- }
-
- .error-wrap {
- flex: 0 0 auto;
- padding: 1em 2em;
- overflow: hidden;
-
- color: $gray-darker;
- background: $gray-fail;
-
- &.empty {
- display: none;
- }
-
- > span {
- display: inline-block;
- margin-bottom: 0.5em;
-
- font-weight: bold;
- color: #f00;
- }
-
- > pre {
- margin: 0;
- }
- }
-
- .content {
- flex: 1 0 auto;
- overflow: auto;
- padding: 1em 2em;
- margin: 0 1em;
- align-self: flex-start;
- min-width: 30vw;
- background: $white;
-
- position: relative;
- }
-}
-
-.content {
- opacity: 1;
- transition: opacity 150ms;
-
- body.loading & {
- opacity: 0;
- }
-}
diff --git a/scss/_canvasapp.scss b/scss/_canvasapp.scss
deleted file mode 100644
index 2eb1a42..0000000
--- a/scss/_canvasapp.scss
+++ /dev/null
@@ -1,36 +0,0 @@
-.canvas_app {
- position: relative;
-
- display: inline-block;
-
- .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;
-
- &:hover {
- opacity: 1;
- }
-
- > * {
- margin: 0.5em;
- }
-
- a {
- display: block;
- color: $gray-bright;
- font-family: inherit;
- }
- }
-}
diff --git a/scss/_content.scss b/scss/_content.scss
deleted file mode 100644
index 937b02b..0000000
--- a/scss/_content.scss
+++ /dev/null
@@ -1,166 +0,0 @@
-.content {
- img, video {
- width: inherit;
- height: inherit;
- }
-
- ul, ol {
- break-before: avoid-page;
- break-inside: avoid-page;
- }
-
- .wide.markdown,
- .wide .markdown {
- max-width: max-content;
- }
-
- .markdown {
- position: relative;
- max-width: 640px;
- text-align: justify;
-
- > blockquote {
- @include left-border;
-
- line-height: normal;
- margin: 1rem var(--margin-wide);
- padding: 1rem;
- background: $gray-bright;
- border-color: $gray-neutral;
- }
- }
-
- p {
- orphans: 6;
- widows: 6;
- }
-
- .markdown,
- .markdown > p,
- .markdown > p > a {
-
- p, a {
- max-width: 100%;
- }
-
- > img, > video {
- display: block;
- max-width: 100%;
- max-height: 50vh;
-
- padding: 0 2em;
- box-sizing: border-box;
- }
-
- a, p {
- max-width: 100%;
- }
- }
-
- .markdown {
- h2 + p,
- h3 + p,
- h4 + p,
- h5 + p,
- h6 + p {
- margin-top: 0.2em;
- }
- }
-
- .markdown > ul {
- margin-block-end: 1em;
- text-align: none;
- }
-
- .embed {
- display: block;
- width: inherit;
- height: inherit;
- max-width: inherit;
- break-inside: avoid-page;
-
- line-height: normal;
-
- .description {
- text-align: center;
- }
-
- &.inline {
- display: inline-block;
- }
-
- &.desc {
- display: inline-block;
- padding: 0.5em;
- margin: 0.2em;
- background: $gray-bright;
- }
-
- > *:not(.description) {
- max-width: 100%;
- }
- }
-
- pre, code {
- text-align: initial;
- }
-
- pre > code {
- @include left-border;
- border-color: $gray-dark;
-
- display: block;
- margin: 0 var(--margin-wide);
- padding: 1em;
- white-space: pre-wrap;
- break-inside: avoid-page;
- overflow-x: auto;
-
- line-height: normal;
- background: #1d1f21;
- color: #c5c8c6;
- }
-
- pre.dual-code {
- display: flex;
- justify-content: space-between;
- padding: 0 2rem;
-
- > code {
- @include right-border(0.3rem);
-
- flex: 1;
- margin: 0;
- }
-
- > code + code {
- @include left-border(0.3rem);
- }
- }
-
- .example, .well {
- @include left-border;
-
- margin: 1rem var(--margin-wide);
- padding: 1rem;
- line-height: normal;
- background: $gray-bright;
- border-color: $gray-neutral;
- break-inside: avoid-page;
- }
-
- .well-warning {
- border-color: $gray-fail;
- }
-
- .spacious {
- h1, h2, h3 {
- margin-top: 1.7em;
- }
-
- h1 + h2,
- h2 + h3 {
- margin-top: 0;
- }
- }
-}
diff --git a/scss/_defs.scss b/scss/_defs.scss
deleted file mode 100644
index 40804b2..0000000
--- a/scss/_defs.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-$white: #ffffff;
-$gray-bright: #eeeeee;
-$gray-dark: #303336;
-$gray-darker: #1d1f21;
-$gray-neutral: #b9bdc1;
-$gray-success: #bdddc1;
-$gray-fail: #ddbdc1;
-
-$break-small: 425px;
-$break-large: 768px;
-
-@mixin media-small() {
- @media only screen and (max-width: $break-small) { @content; }
-}
-
-@mixin media-medium() {
- @media only screen and (min-width: $break-small + 1) and (max-width: $break-large - 1) { @content; }
-}
-
-@mixin media-large() {
- @media only screen and (min-width: $break-large) { @content; }
-}
-
-:root {
- --white: #{$white};
- --gray-bright: #{$gray-bright};
- --gray-dark: #{$gray-dark};
- --gray-darker: #{$gray-darker};
- --gray-neutral: #{$gray-neutral};
- --gray-success: #{$gray-success};
- --gray-fail: #{$gray-fail};
-
- --margin-wide: 2rem;
- @include media-small() {
- --margin-wide: 0.5rem;
- }
-}
-
-@mixin left-border($w: 0.6rem) {
- border-style: solid;
- border-width: 0 0 0 $w;
- border-radius: 0 6px 6px 0;
-}
-
-@mixin right-border($w: 0.6rem) {
- border-style: solid;
- border-width: 0 $w 0 0;
- border-radius: 6px 0 0 6px;
-}
diff --git a/scss/_footer.scss b/scss/_footer.scss
deleted file mode 100644
index 721ff12..0000000
--- a/scss/_footer.scss
+++ /dev/null
@@ -1,43 +0,0 @@
-footer {
- display: flex;
- padding: 1rem 2rem;
- height: 1rem;
-
- position: sticky;
- bottom: 0;
-
- @include media-medium() {
- position: initial;
- }
- @include media-small() {
- position: initial;
- }
-
- @media print {
- position: absolute;
- display: none;
- }
-
- color: $gray-bright;
- background: $gray-dark;
-
- .icons {
- flex: 1;
- display: flex;
- justify-content: flex-end;
-
- .iconlink {
- filter: invert(.7);
-
- &:hover {
- filter: invert(1);
- }
-
- > img {
- height: 1em;
- margin-left: 0.5em;
- vertical-align: middle;
- }
- }
- }
-}
diff --git a/scss/_header.scss b/scss/_header.scss
deleted file mode 100644
index a51457f..0000000
--- a/scss/_header.scss
+++ /dev/null
@@ -1,81 +0,0 @@
-header {
- > div {
- font-family: 'Source Sans Pro', sans-serif;
- padding: 1rem 2rem;
- text-align: right;
-
- color: $gray-bright;
- background: $gray-dark;
-
- h1 {
- display: flex;
- justify-content: flex-end;
- align-items: center;
- flex-wrap: wrap;
- margin: 0;
- line-height: 5rem;
-
- font-size: 4rem;
- font-weight: 200;
-
- > span {
- margin-left: auto;
- }
-
- .bold {
- font-weight: 400;
- }
-
- > a {
- height: 5rem;
- }
-
- @include media-small() {
- font-size: 2rem;
- line-height: 5rem
- }
-
- .sun {
- height: 100%;
- stroke: currentColor;
- fill: currentColor;
-
- .out, .in {
- animation: spin 2s;
- animation-iteration-count: 1;
- transform: scale(1);
- }
-
- .in {
- animation: size 2s;
- }
-
- &.spin .circle {
- animation: none;
- }
- }
- }
- }
-
- aside {
- margin: 0;
- padding: 0 2rem;
- color: $gray-bright;
- background: $gray-darker;
- line-height: 3em;
-
- > 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); }
-}
diff --git a/scss/_print.scss b/scss/_print.scss
deleted file mode 100644
index c221fa4..0000000
--- a/scss/_print.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-.print-only {
- display: none;
-
- @media print {
- display: block;
- }
-}
-
-.screen-only {
- @media print {
- display: none;
- }
-}
-
-@media print {
- h1, h2, h3, h4, h5 {
- break-after: avoid-page;
-
- + * {
- break-before: avoid-page;
- }
- }
-
- .view {
- flex: 1 0 auto;
-
- .content {
- flex: 1 0 auto;
- }
- }
-
- body {
- background: $white;
- }
-}
-
-.print-ownpage {
- break-before: page;
- break-after: page;
-}
-
-@page {
- size: a4;
- margin: 2.5cm 0 2.5cm;
-}
diff --git a/scss/_reset.scss b/scss/_reset.scss
deleted file mode 100644
index d157fcf..0000000
--- a/scss/_reset.scss
+++ /dev/null
@@ -1,72 +0,0 @@
-* {
- 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; }
-h1 { font-size: 1.6em; }
-h2 { font-size: 1.4em; }
-h3 { font-size: 1.17em; }
-h4, h5, h6 { font-size: 1em; }
-
-input, select, button {
- color: initial;
- &:disabled {
- color: graytext;
- }
-}
-tt, code, kbd, samp { font-family: monospace; }
-code { font-size: 0.8em; }
-b, strong { font-weight: bold; }
-em, i { font-style: italic; }
-hr { clear: both; }
-ul { margin: 0; padding-inline-start: 2em; }
-
-sup, sub {
- vertical-align: baseline;
- position: relative;
- top: -0.4em;
-}
-sub { top: 0.4em; }
-
-body {
- display: flex;
- flex-direction: column;
- justify-content: space-between;
-
- background: $gray-bright;
- font-family: sans-serif;
-
- min-height: 100vh;
-}
-
-a {
- display: inline-block;
- font-size: 1em;
- font-weight: bold;
- text-decoration: underline;
- text-decoration-color: transparent;
- cursor: pointer;
-
- &:hover {
- filter: invert(40%);
- text-decoration-color: currentColor;
- }
-
- transition: filter 500ms, text-decoration-color 500ms;
-}
-
-::selection {
- background: $gray-dark;
- color: $gray-bright;
- padding: 1em;
-}
diff --git a/scss/_sidenotes.scss b/scss/_sidenotes.scss
deleted file mode 100644
index 0b9effe..0000000
--- a/scss/_sidenotes.scss
+++ /dev/null
@@ -1,73 +0,0 @@
-$sidenote-width: 14rem;
-
-:root {
- --sidenote-width: #{$sidenote-width};
-}
-
-.sidenote-container {
- margin-right: $sidenote-width + 1rem;
-
- @include media-medium {
- margin: auto;
- }
-
- .sidenote-container & {
- margin-right: initial;
- margin: initial;
- }
-
- .sidenote {
- position: absolute;
- box-sizing: border-box;
-
- width: $sidenote-width;
- right: -$sidenote-width - 2rem;
- padding: 0 1rem;
-
- color: $gray-dark;
- border-top: 1px solid $gray-dark;
- word-break: break-word;
-
- font-size: 0.8em;
- line-height: 1.1;
- text-align: initial;
- break-inside: avoid-page;
-
- .hook {
- position: absolute;
- top: -4rem;
- width: 0;
- height: 0;
-
- @media print {
- top: 0;
- }
- }
-
- .ref {
- display: block;
- position: absolute;
-
- width: 1rem;
- margin-left: -1.2rem;
- text-align: right;
- }
-
- > .markdown > p:first-child {
- margin-top: 0;
- }
-
- a {
- display: inline;
- }
-
- @include media-medium {
- width: initial;
- position: initial;
- right: initial;
-
- border-bottom: 1px solid $gray-dark;
- margin: 0.5rem 0;
- }
- }
-}
diff --git a/scss/codemirror.scss b/scss/codemirror.scss
deleted file mode 100644
index fd50b00..0000000
--- a/scss/codemirror.scss
+++ /dev/null
@@ -1,73 +0,0 @@
-/*
- vim-hybrid theme by w0ng (https://github.com/w0ng/vim-hybrid)
-*/
-
-/*background color*/
-.CodeMirror.cm-s-hybrid {
- color: #c5c8c6;
- background: #1d1f21;
-
- height: auto;
- flex: 1;
-
- /*selection color*/
- .CodeMirror-selected,
- .CodeMirror-line::selection,
- .CodeMirror-line > span::selection,
- .CodeMirror-line > span > span::selection, {
- background: #373b41;
- }
-
- /*foreground color*/
- .CodeMirror-cursor {
- border-color: #c5c8c6;
- }
-
- /*color: fg_yellow*/
- .cm-keyword {
- color: #f0c674;
- }
-
- /*color: fg_comment*/
- .cm-comment,
- .cm-meta {
- color: #707880;
- }
-
- /*color: fg_red*/
- .cm-number,
- .cm-atom {
- color: #cc6666
- }
-
- /*color: fg_green*/
- .cm-string,
- .cm-string-2,
- .cm-operator {
- color: #b5bd68;
- }
-
- /*color: fg_purple*/
- .cm-attribute,
- .cm-propery {
- color: #b294bb;
- }
-
- /*color: fg_blue*/
- .cm-tag,
- .cm-qualifier {
- color: #81a2be;
- }
-
- /*color: fg_aqua*/
- .cm-link,
- .cm-header,
- .cm-hr {
- color: #8abeb7;
- }
-
- /*color: fg_orange*/
- .cm-builtin, {
- color: #de935f;
- }
-}
diff --git a/scss/hljs.scss b/scss/hljs.scss
deleted file mode 100644
index 0acf4a2..0000000
--- a/scss/hljs.scss
+++ /dev/null
@@ -1,110 +0,0 @@
-/*
-
-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;
-}
diff --git a/scss/main.scss b/scss/main.scss
deleted file mode 100644
index 9b6e6ce..0000000
--- a/scss/main.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-@import 'defs';
-@import 'reset';
-@import 'hljs';
-@import 'codemirror';
-@import 'header';
-@import 'footer';
-@import 'browser';
-@import 'content';
-@import 'sidenotes';
-@import 'canvasapp';
-@import 'print';