introducing sidebar toggling (js); all sources moved to src folder

src/sass/components/_coderay.scss

@@ -0,0 +1,363 @@
+//
+// Syntax highlight - CodeRay
+// --------------------------------------------------
+
+.syntaxhl {
+    div {
+        display: inline;
+    }
+
+    .line-numbers {
+        margin: 0 5px 0 0;
+        padding: 2px 4px;
+        background-color: #eee;
+    }
+
+    .code pre {
+        overflow: auto;
+    }
+
+    .debug {
+        background: #00f !important;
+        color: #fff !important;
+    }
+
+    .annotation {
+        color: #007;
+    }
+
+    .attribute-name {
+        color: #b48;
+    }
+
+    .attribute-value {
+        color: #700;
+    }
+
+    .binary {
+        color: #509;
+    }
+
+    .char {
+        color: #d20;
+
+        .content {
+            color: #d20;
+        }
+
+        .delimiter {
+            color: #710;
+        }
+    }
+
+    .class {
+        color: #795da3;
+        font-weight: bold;
+    }
+
+    .class-variable {
+        color: #369;
+    }
+
+    .color {
+        color: #0a0;
+    }
+
+    .comment {
+        color: #969896;
+
+        .char,
+        .delimiter {
+            color: #969896;
+        }
+    }
+
+    .complex {
+        color: #a08;
+    }
+
+    .constant {
+        color: #795da3;
+    }
+
+    .decorator {
+        color: #b0b;
+    }
+
+    .definition {
+        color: #099;
+        font-weight: bold;
+    }
+
+    .delimiter {
+        color: #000;
+    }
+
+    .directive {
+        color: #088;
+        font-weight: bold;
+    }
+
+    .doc {
+        color: #970;
+    }
+
+    .doc-string {
+        color: #d42;
+        font-weight: bold;
+    }
+
+    .doctype {
+        color: #34b;
+    }
+
+    .entity {
+        color: #800;
+        font-weight: bold;
+    }
+
+    .error {
+        background-color: #faa;
+        color: #f00;
+    }
+
+    .escape {
+        color: #666;
+    }
+
+    .exception {
+        color: #c00;
+        font-weight: bold;
+    }
+
+    .float {
+        color: #06d;
+    }
+
+    .function {
+        color: #06b;
+        font-weight: bold;
+    }
+
+    .global-variable {
+        color: #d70;
+    }
+
+    .hex {
+        color: #02b;
+    }
+
+    .imaginary {
+        color: #f00;
+    }
+
+    .include {
+        color: #b44;
+        font-weight: bold;
+    }
+
+    .inline {
+        background-color: rgba(#000, .05);
+        color: #000;
+    }
+
+    .inline-delimiter {
+        color: #666;
+        font-weight: bold;
+    }
+
+    .instance-variable {
+        color: #33b;
+    }
+
+    .integer {
+        color: #0086b3;
+    }
+
+    .key {
+        color: #606;
+
+        .char {
+            color: #60f;
+        }
+
+        .delimiter {
+            color: #404;
+        }
+    }
+
+    .keyword {
+        color: #b3113e;
+        font-weight: bold;
+    }
+
+    .label {
+        color: #970;
+        font-weight: bold;
+    }
+
+    .local-variable {
+        color: #369;
+    }
+
+    .namespace {
+        color: #707;
+        font-weight: bold;
+    }
+
+    .octal {
+        color: #40e;
+    }
+
+    .predefined {
+        color: #b21;
+    }
+
+    .predefined-constant {
+        color: #009595;
+    }
+
+    .predefined-type {
+        color: #0a5;
+        font-weight: bold;
+    }
+
+    .preprocessor {
+        color: #579;
+    }
+
+    .pseudo-class {
+        color: #00c;
+        font-weight: bold;
+    }
+
+    .regexp {
+        background-color: hsla(300, 100%, 50%, .06);
+
+        .content {
+            color: #808;
+        }
+
+        .delimiter {
+            color: #404;
+        }
+
+        .modifier {
+            color: #c2c;
+        }
+    }
+
+    .reserved {
+        color: #080;
+        font-weight: bold;
+    }
+
+    .shell {
+        background-color: hsla(120, 100%, 50%, .06);
+
+        .content {
+            color: #2b2;
+        }
+
+        .delimiter {
+            color: #161;
+        }
+    }
+
+    .string {
+        .char,
+        .content,
+        .delimiter,
+        .modifier {
+            color: #df5000;
+        }
+    }
+
+    .symbol {
+        color: #d33;
+
+        .content,
+        .delimiter {
+            color: #d33;
+        }
+    }
+
+    .tag {
+        color: #070;
+    }
+
+    .type {
+        color: #339;
+        font-weight: bold;
+    }
+
+    .value {
+        color: #088;
+    }
+
+    .variable {
+        color: #037;
+    }
+
+    .insert {
+        background: hsla(120, 100%, 50%, .12);
+    }
+
+    .delete {
+        background: hsla(0, 100%, 50%, .12);
+    }
+
+    .change {
+        background: #007;
+        color: #bbf;
+    }
+
+    .head {
+        background: #505;
+        color: #f8f;
+
+        .filename {
+            color: #fff;
+        }
+    }
+
+    .delete .eyecatcher {
+        margin: -1px;
+        border: 1px solid hsla(0, 100%, 45%, .5);
+        border-bottom: 0 none;
+        border-top-left-radius: 5px;
+        border-top-right-radius: 5px;
+        background-color: hsla(0, 100%, 50%, .2);
+    }
+
+    .insert {
+        .eyecatcher {
+            margin: -1px;
+            border: 1px solid hsla(120, 100%, 25%, .5);
+            border-top: 0 none;
+            border-bottom-left-radius: 5px;
+            border-bottom-right-radius: 5px;
+            background-color: hsla(120, 100%, 50%, .2);
+        }
+
+        .insert {
+            background: transparent;
+            color: #0c0;
+            font-weight: bold;
+        }
+    }
+
+    .delete .delete {
+        background: transparent;
+        color: #c00;
+        font-weight: bold;
+    }
+
+    .change .change {
+        color: #88f;
+    }
+
+    .head .head {
+        color: #f4f;
+    }
+}