Publish the new site theme to the correct directory

docs/scss/original/_colours.scss

@@ -0,0 +1,14 @@
+// main: theme.scss
+
+// == Side ==
+$side_back_color: #2053AB;
+$side_text_color: #fff;
+
+// == Main ==
+$main_back_color: #fff;
+$main_text_color: #323232;
+
+
+// == Code ==
+$main_code_inline_back_color: #FFF7DD;
+$main_code_block_back_color: #1d1f21;

docs/scss/original/_functions.scss

@@ -0,0 +1,89 @@
+// main: theme.scss
+
+
+// == Functions ==
+// Copied from https://css-tricks.com/snippets/sass/power-function/
+
+
+@function pow($number, $exponent) {
+  $value: 1;
+
+  @if $exponent > 0 {
+    @for $i from 1 through $exponent {
+      $value: $value * $number;
+    }
+  } @else if $exponent < 0 {
+    @for $i from 1 through -$exponent {
+      $value: $value / $number;
+    }
+  }
+
+  @return $value;
+}
+
+
+// == Fudge Values ==
+//These are all a means of globally tweaking lightness shifting. Use with caution.
+
+// A scaling factor, will generally increase contrast
+// Use sparingly and with caution
+$lshift_global_scale: 1;
+
+// A hacky integer bias factor, to scale more when near mid lightness
+$lshift_global_bias: 2;
+
+// Need not be an integer, scales the bias more when approaching 0
+$lshift_global_fudge: 0.5;
+
+@function fudge_center($value) {
+    @return ( ( 1 + $lshift_global_fudge ) / ( pow( abs( 2 * $value - 1 ), $lshift_global_bias ) + $lshift_global_fudge ) );
+}
+
+@function lshift($reference, $value, $lighten_amount, $darken_amount) {
+
+    $lshift_internal_lightness: lightness($reference);
+
+    $lshift_internal_bias: $lshift_global_scale * fudge_center(lightness($value) / 100%);
+
+    @if $lshift_internal_lightness < 50% {
+        @if abs($lighten_amount * $lshift_internal_bias) > 100 {
+            @return adjust-color($value, $lightness: 100);
+        }@else {
+            @return adjust-color($value, $lightness: $lighten_amount * $lshift_internal_bias);
+        }
+    }@else {
+        @if abs($darken_amount * $lshift_internal_bias) > 100 {
+            @return adjust-color($value, $lightness: -100);
+        }@else {
+            @return adjust-color($value, $lightness: -$darken_amount * $lshift_internal_bias);
+        }
+    }
+}
+
+$lshift_main_scale: 1;
+
+@function lshift_main($value, $lighten_amount, $darken_amount) {
+    @return lshift($main_back_color, $value, $lighten_amount * $lshift_main_scale, $darken_amount * $lshift_main_scale);
+}
+
+$lshift_side_scale: 1;
+
+@function lshift_side($value, $lighten_amount, $darken_amount) {
+    @return lshift($side_back_color, $value, $lighten_amount * $lshift_side_scale, $darken_amount * $lshift_side_scale);
+}
+
+// lshift functions take a color, then an amount to lighten by (when reference is
+// dark), then an amount to darken by (when reference is light).
+// main uses main back color as reference, side uses side back color as reference
+
+
+
+
+// == Mixins ==
+
+@mixin transition($input) {
+    -webkit-transition: $input;
+    -moz-transition: $input;
+    -ms-transition: $input;
+    transition: $input;
+}

docs/scss/original/_variables.scss

@@ -0,0 +1,137 @@
+// main: main.scss
+
+// == Side ==
+// Remember:
+// active is the current page
+// focus is a group
+
+$side_link_color: $side_text_color;
+$side_link_hover_color: lshift_side($side_text_color, -12%, -12%);
+
+$side_link_extra_color: lshift_side($side_text_color, -50%, -50%);
+
+$side_shadow_color: lshift_side($side_back_color, -3.5%, 3.5%);
+$side_highlight_color: lshift_side($side_back_color, 9%, -9%);
+
+$side_focus_back_color: $side_shadow_color;
+$side_active_back_color: lshift_side($side_focus_back_color, -100%, -1.5%);
+
+$side_focus_text_color: $side_text_color;
+$side_focus_text_hover_color: lshift_side($side_link_hover_color, 1.5%, 1.5%);
+
+$side_active_text_color: lshift_side($side_focus_text_color, -50%, 10%);
+$side_active_text_hover_color: lshift_side($side_active_text_color, 7%, -7%);
+
+// == Main ==
+
+
+$main_link_color: $side_back_color;
+$main_link_hover_color: adjust-hue(lshift_main($main_link_color, 7%, -1.5%), -20);
+
+$main_shadow_color: lshift_main($main_back_color, -2%, 3%);
+$main_highlight_color: lshift_main($main_back_color, 5%, -2%);
+
+$main_title_text_color: lshift_main($main_text_color, 10%, 10%);
+$main_other_text_color: lshift_main($main_text_color, -17%, -10%);
+
+$main_block_quote_border_color: lshift_main($main_back_color, 5%, 5%);
+
+// == Code ==
+
+
+$main_code_inline_text_color: lshift_main(hsl(0, 0, lightness($main_code_inline_back_color)), -46%, 46%);
+$main_code_inline_border_color: lshift_main($main_code_inline_back_color, -6%, 6%);
+$main_code_inline_back_hover_color: desaturate(lshift_main($main_code_inline_back_color, -3%, 3%), 25%);
+
+$main_code_block_border_color: lshift_main($main_code_block_back_color, 3%, -3%);
+
+// == Table ==
+
+
+$table_title_back_color: lshift_main($main_back_color, 3.5%, 3.5%);
+$table_title_text_color: $main_text_color;
+$table_border_color: lshift_main($main_back_color, 10%, 10%);
+$table_body_text_color: $main_text_color;
+
+// == Common Theming ==
+// TODO: Make text color back dependant (color and lshift)
+
+$theme_map: (
+    "success": hsl(111 , 45%, lightness(lshift_main($main_back_color, 15%, 15%))),
+    "default": hsl(0 , 0%, lightness(lshift_main($main_back_color, 7.5%, 7.5%))),
+    "info": hsl(200 , 75%, lightness(lshift_main($main_back_color, 12.5%, 12.5%))),
+    "info_alt": hsl(28 , 85%, lightness(lshift_main($main_back_color, 9%, 9%))),
+    "note": hsl(204 , 70%, lightness(lshift_main($main_back_color, 13.5%, 13.5%))),
+    "primary": hsl(208 , 56%, lightness(lshift_main($main_text_color, -30%, -30%))),
+    "warning": hsl(50 , 75%, lightness(lshift_main($main_back_color, 10%, 10%))),
+    "error": hsl(0 , 55%, lightness(lshift_main($main_back_color, 16%, 12%))),
+);
+
+// == Notices ==
+$notice_body_back_lshift: ( -5.5%, -5.5% );
+$notice_body_back_saturate: 5%;
+$notice_header_back_lshift: ( 10%, 15% );
+$notice_header_back_saturate: -5%;
+
+$notice_text_body_color: transparentize(lshift_main($main_text_color, -10%, -10%), 0.5);
+$notice_text_title_color: $main_back_color;
+
+$notice_map: (
+    "note": note,
+    "info": info_alt,
+    "tip": success,
+    "warning": error
+);
+
+// == Panels ==
+$panel_border_lshift: 3.75%;
+$panel_back_lshift: -2.55%;
+
+$panel_body_back_color: lshift_main($main_back_color, 0%, 0%);
+$panel_body_text_color: $main_text_color;
+$panel_title_text_color: transparentize(lshift_main($main_text_color, -15%, -15%), 0.25);
+
+$panel_map: (
+    "primary": primary,
+    "info": info,
+    "success": success,
+    "warning": warning,
+    "danger": error,
+    "default": default
+);
+
+// == Alerts ==
+// TODO: Turn into maps like with notices
+$alert_border_lshift: 6.5%;
+$alert_back_lshift: -2.5%;
+
+$alert_body_text_color: transparentize(lshift_main($main_text_color, -12%, -12%), 0.25);
+
+$alert_map: (
+    "info": info,
+    "success": success,
+    "warning": warning,
+    "danger": error
+);
+
+// == Top bar ==
+
+$topbar_back_color: lshift_main($main_back_color, 7.5%, 3.2%);
+$topbar_shadow_opacity: 0.1;
+
+$topbar_toc_back_color: transparentize($topbar_back_color, 0.03);
+$topbar_toc_border_color: lshift_main($topbar_back_color, -4%, 4%);
+
+$time_short_fade: 0.15s;
+$time_long_fade: 0.35s;
+
+// == Buttons ==
+
+
+$button_text_color: desaturate(lshift_main($main_back_color, -15%, -15%), 100%);
+$button_text_hover_color: lshift_main($main_back_color, 100%, 100%);
+
+//== Options ==
+// Where link underline should expand from: 'left', 'center', or 'right'
+
+$option_link_expand: left;

docs/scss/original/fonts.scss

@@ -0,0 +1,23 @@
+// main: theme.scss
+
+@font-face {
+    font-family: 'Novacento Sans Wide';
+    src: url("../fonts/Novecentosanswide-UltraLight-webfont.eot");
+    src: url("../fonts/Novecentosanswide-UltraLight-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/Novecentosanswide-UltraLight-webfont.woff2") format("woff2"), url("../fonts/Novecentosanswide-UltraLight-webfont.woff") format("woff"), url("../fonts/Novecentosanswide-UltraLight-webfont.ttf") format("truetype"), url("../fonts/Novecentosanswide-UltraLight-webfont.svg#novecento_sans_wideultralight") format("svg");
+    font-style: normal;
+    font-weight: 200;
+}
+
+@font-face{
+    font-family:"Lato";
+    font-style:normal;
+    font-weight:400;
+    src:local("Lato Regular"),local("Lato-Regular"), url(../fonts/Lato-Regular.woff2) format("woff2"), url(../fonts/Lato-Regular.ttf) format("truetype");
+}
+
+@font-face{
+    font-family:"Lato";
+    font-style:normal;
+    font-weight:700;
+    src:local("Lato Bold"),local("Lato-Bold"), url(../fonts/Lato-Bold.woff2) format("woff2"), url(../fonts/Lato-Bold.ttf) format("truetype");
+}

docs/scss/original/print.scss

@@ -0,0 +1,29 @@
+// main: theme.scss
+
+@media print {
+    #sidebar, #navigation, #top-bar, .anchor, #sidebar-toggle-span, .copy-to-clipboard {
+        display:none;
+    }
+    #navigation * {
+        display:none;
+        visibility: hidden;
+    }
+    #body-inner {
+        margin-bottom: 0px;
+    }
+    #footer, .footline{
+        margin-top: 1px;
+    }
+    body, a {
+        font-size: 120%;
+        color: black !important;
+        background: white !important
+    }
+    h1, h2, h3, h4, h5, h6 {
+        color: black !important;
+        background: white !important
+    }
+    #body{
+        margin-left: 0px;
+    }
+}

docs/scss/original/responsive.scss

@@ -0,0 +1,124 @@
+// main: theme.scss
+
+@media only all and (min-width: 48em) and (max-width: 59.938em) {
+    body #chapter h1 {
+        font-size: 3rem;
+    }
+}
+
+@media only all and (max-width: 47.938em) {
+    body #chapter h1 {
+        font-size: 2rem;
+    }
+}
+
+
+
+@media only all and (max-width: 47.938em) {
+    #sidebar-toggle-span {
+        display: inline;
+    }
+}
+
+
+
+@media only all and (max-width: 59.938em) {
+    #body .padding {
+        position: static;
+        padding: 15px 3rem;
+    }
+}
+
+@media only all and (max-width: 47.938em) {
+    #body .padding {
+        padding: 5px 1rem;
+    }
+}
+
+
+@media only all and (max-width: 59.938em) {
+    #body #navigation {
+        position: static;
+        margin-right: 0 !important;
+        width: 100%;
+        display: table;
+    }
+}
+
+
+@media only all and (max-width: 59.938em) {
+    #body .nav {
+        display: table-cell;
+        position: static;
+        top: auto;
+        width: 50%;
+        text-align: center;
+        height: 100px;
+        line-height: 100px;
+        padding-top: 0;
+    }
+    #body .nav > i {
+        display: inline-block;
+    }
+}
+
+
+
+@media only all and (max-width: 47.938em) {
+    .two-column-bullet {
+        width: 100%;
+    }
+}
+@media only all and (max-width: 47.938em) {
+    .three-column-bullet {
+        width: 100%;
+    }
+}
+@media only all and (max-width: 47.938em) {
+    .four-column-bullet {
+        width: 100%;
+    }
+}
+
+
+
+
+@media only all and (max-width: 59.938em) {
+    #sidebar {
+        width: 230px;
+    }
+    #body {
+        margin-left: 230px;
+    }
+}
+
+@media only all and (max-width: 47.938em) {
+    #sidebar {
+        width: 230px;
+        left: -230px;
+    }
+    #body {
+        margin-left: 0;
+        width: 100%;
+    }
+    .sidebar-hidden {
+        overflow: hidden;
+    }
+    .sidebar-hidden #sidebar {
+        left: 0;
+    }
+    .sidebar-hidden #body {
+        margin-left: 230px;
+        overflow: hidden;
+    }
+    .sidebar-hidden #overlay {
+        position: absolute;
+        left: 0;
+        right: 0;
+        top: 0;
+        bottom: 0;
+        z-index: 10;
+        background: rgba(255, 255, 255, 0.5);
+        cursor: pointer;
+    }
+}

docs/scss/original/shortcodes.scss

@@ -0,0 +1,32 @@
+// main: theme.scss
+/*
+	Here lives CSS required for shortcodes
+*/
+
+// == Children shortcode ==
+
+.children p {
+    font-size: small;
+    margin-top: 0px;
+    padding-top: 0px;
+    margin-bottom:  0px;
+    padding-bottom: 0px;
+}
+
+.children-li p {
+    font-size: small;
+    font-style: italic;
+}
+
+.children-h2 p, .children-h3 p {
+    font-size: small;
+    margin-top: 0px;
+    padding-top: 0px;
+    margin-bottom:  0px;
+    padding-bottom: 0px;
+}
+
+.children h3,.children h2 {
+    margin-bottom: 0px;
+    margin-top: 5px;
+}

docs/scss/original/sidebar.scss

@@ -0,0 +1,276 @@
+// main: theme.scss
+#sidebar-toggle-span {
+    display: none;
+}
+
+#sidebar-toggle-span {
+    border-right: thin solid #DAD8D8 !important;
+    padding-right: 0.5rem !important;
+    margin-right: 1rem !important;
+}
+
+// responsive
+#sidebar {
+
+    background-color: $side_back_color;
+    position: fixed;
+    top: 0;
+    width: 300px;
+    bottom: 0;
+    left: 0;
+    font-weight: normal;
+    font-size: 90%;
+    line-height: 27px;
+    -webkit-font-smoothing: antialiased;
+
+    a {
+        color: $side_link_color;
+        @include transition(color $time_short_fade ease);
+    }
+
+    a:hover {
+        color: $side_link_hover_color;
+        @include transition(color $time_short_fade ease);
+    }
+
+    a.subtitle {
+        color: rgba(204, 204, 204, 0.6);
+    }
+
+    hr {
+        border-bottom: 1px solid #2a232f;
+    }
+
+    a.padding {
+        padding: 0 1rem;
+    }
+
+    h5 {
+        margin: 2rem 0 0;
+        position: relative;
+        line-height: 2;
+    }
+
+    h5 a {
+        display: block;
+        margin-left: 0;
+        margin-right: 0;
+        padding-left: 1rem;
+        padding-right: 0rem;
+    }
+
+    h5 i {
+        color: rgba(204, 204, 204, 0.6);
+        position: absolute;
+        right: 0.6rem;
+        top: 0.7rem;
+        font-size: 80%;
+    }
+
+    .parent li,
+    .active li {
+        border-left: 1px solid $side_link_extra_color;
+    }
+
+    h5.parent a {
+        background: #201b24;
+        color: #d9d9d9 !important;
+    }
+
+    h5.active a {
+        background: #fff;
+        color: #777 !important;
+    }
+
+    h5.active i {
+        color: #777 !important;
+    }
+
+    h5+ul.topics {
+        display: none;
+        margin-top: 0;
+    }
+
+    h5.parent+ul.topics,
+    h5.active+ul.topics {
+        display: block;
+    }
+
+    ul {
+        list-style: none;
+        padding: 0;
+        margin: 0;
+
+        &.searched a {
+            color: #999999;
+        }
+
+        &.searched .search-match a {
+            color: #e6e6e6;
+        }
+
+        &.searched .search-match a:hover {
+            color: $side_text_color;
+        }
+
+
+        &.topics {
+            margin: 0 0 0 1rem;
+        }
+
+        
+
+        &.topics.searched ul {
+            display: block;
+        }
+
+        &.topics ul {
+            display: none;
+            padding-bottom: 1rem;
+        }
+
+        &.topics ul ul {
+            padding-bottom: 0;
+        }
+
+        &.topics li.parent>ul,
+        &.topics li.alwaysopen>ul,
+        li.active>ul {
+            display: block;
+        }
+
+        &.topics>li>span>a {
+            /*line-height: 2rem;
+		    font-size: 1.1rem*/
+            ;
+        }
+
+        &.topics>li>span>a b {
+            opacity: 0.5;
+            font-weight: normal;
+        }
+
+
+        li .category-icon {
+            color: $side_link_extra_color;
+        }
+
+        &.topics>li.parent a,
+        &.topics>li.active a {
+            color: $side_focus_text_color;
+            @include transition(color $time_short_fade ease);
+        }
+
+        &.topics>li.parent a:hover,
+        &.topics>li.active a:hover {
+            color: $side_focus_text_hover_color;
+            @include transition(color $time_short_fade ease);
+        }
+
+        &.topics>li.parent,
+        &.topics>li.active {
+
+            background: $side_focus_back_color;
+            margin-left: -1rem;
+            margin-right: 0rem;
+            padding-left: 1rem;
+            padding-right: 0rem;
+        }
+
+        li.active>div>a {
+            background: $side_active_back_color;
+            color: $side_active_text_color !important;
+            // margin-left: -1rem;
+            // margin-right: -1rem;
+            padding-left: 1rem;
+            padding-right: 0rem;
+        }
+
+        li.active>div>a:hover {
+            color: $side_active_text_hover_color !important;
+            @include transition(color $time_short_fade ease);
+        }
+
+        li {
+            padding: 0;
+        }
+
+        li.visited+div {
+            margin-right: 16px;
+        }
+
+        li a {
+            display: block;
+            padding: 2px 0;
+        }
+
+        li div a {
+            text-overflow: ellipsis;
+            overflow: hidden;
+            white-space: nowrap;
+            display: block;
+            width: calc(100% - 20px);
+        }
+
+        li>div>a {
+            padding: 2px 0;
+            position: relative;
+        }
+
+        li li {
+            padding-left: 1rem;
+            text-indent: 0.2rem;
+        }
+
+		li .read-icon {
+            display: none;
+            font-size: xx-small;
+            color: $side_link_extra_color;
+            position: absolute;
+            float: left;
+            margin: 0 ;
+            margin-left: -17px;
+            margin-top: -18px;
+        }
+
+        li.visited>div>.read-icon {
+            display: block;
+        }
+
+        li.visited.active>div>.read-icon {
+            margin-left: 0px;
+        }
+
+        li .category-icon {
+            display: block;
+            float: right;
+            position: absolute;
+            right: 15px;
+            margin: 0px ;
+            // padding-left: 20px !important;
+            margin-top: -20px;
+            // top: 9px;
+        }
+
+        li.active>div .category-icon {
+            right: 15px;
+        }
+
+        
+    }
+
+    &.showVisitedLinks ul li a {
+        width: 100%;
+    }
+
+    #shortcuts {
+        label {
+            display: inline;
+            font-weight: 100;
+        }
+        h3 {
+            font-family: 'Novacento Sans Wide', 'Helvetica', 'Tahoma', 'Geneva', 'Arial', sans-serif;
+            color: $side_text_color;
+        }
+    }
+}

docs/scss/original/style.scss

@@ -0,0 +1,16 @@
+// compileNested: ../css/$1.css, sourceMap: true
+ /*
+	Built with SCSS.
+	If you would like to explore this CSS,
+	use source map feature of your browser.
+ */
+
+@import "functions";
+@import "colours";
+@import "fonts";
+@import "variables";
+@import "main";
+@import "sidebar";
+@import "shortcodes";
+@import "responsive";
+@import "print";