jekyll-theme-morph 0.0.1

data/_sass/morph/components/_highlight.scss

@@ -0,0 +1,66 @@
+// code highlight
+@import "../variables";
+
+.highlight {
+  border-radius: 3px;
+  background: $color-primary;
+  ::-webkit-scrollbar{
+    //width: 20px;
+    height: .5rem;
+  }
+  ::-webkit-scrollbar-thumb{
+    border-radius: 1em;
+    background-color: $color-primary-light;
+  }
+  ::-webkit-scrollbar-track{
+    border-radius: 1em;
+    background-color: $color-primary-dark;
+  }
+
+  .highlighter-rouge & {
+    background: $color-primary;
+  }
+}
+
+pre, code {
+  font-family: $monospaced;
+  font-size: 0.9375em;
+  border: 1px solid $color-primary;
+  border-radius: 3px;
+  background-color: $color-primary;
+}
+code {
+  padding: 1px 5px;
+}
+pre {
+  padding: 8px 12px;
+  overflow-x: auto;
+
+  > code {
+    border: 0;
+    padding-right: 0;
+    padding-left: 0;
+  }
+}
+.rouge-gutter, .gutter {
+  $color-gl: $color-secondary-light;
+  border-right: 1px solid $color-primary-dark;
+  .lineno {
+    padding-right: 1rem;
+    color: $color-secondary-light;
+  }
+}
+.code {
+  padding: 0 1rem;
+}
+code.language-plaintext {
+  background-color: $color-primary;
+  color: $color-secondary-dark;
+  font-weight: bold;
+  padding: 2px 4px;
+  word-wrap:break-word;
+}
+
+.rouge-code pre {
+  margin-bottom: 0 !important;
+}

data/_sass/morph/components/_nano-compo.scss

@@ -0,0 +1,23 @@
+@import "../variables";
+@import "../functions";
+
+.full-mask {
+  display: none;
+  z-index: 10;
+  position: fixed;
+  top: 0; left: 0;
+  background-color: rgba(0,0,0,.5);
+  width: 100%;
+  height: 100%;
+}
+
+.component {
+  &.bread {
+    font-size: .9rem;
+
+    span {
+      padding: .3rem;
+      border-radius: 5px;
+    }
+  }
+}

data/_sass/morph/components/_paginator.scss

@@ -0,0 +1,19 @@
+@import "../variables";
+
+.pagination {
+  padding: 2rem 0;
+  a, span, em {
+    display: inline-block;
+    color: $color-secondary-light;
+    padding: .4rem .8rem;
+    background-color: $color-primary;
+    text-align: center;
+    vertical-align: middle;
+    border-radius: 4px;
+  }
+
+  em {
+    color: $color-secondary-dark;
+    font-style: normal;
+  }
+}

data/_sass/morph/components/_post-info.scss

@@ -0,0 +1,30 @@
+@import "../variables";
+
+.post-info {
+  padding: 1rem .7rem;
+  border-radius: 8px;
+  &:hover {
+    background-color: $color-primary-light;
+    a.flat {
+      background-color: $color-primary-dark;
+    }
+  }
+  &:not(:first-child) {
+    border-top: 1px dashed $color-primary-dark;
+  }
+  h3, p, .categories {
+    padding: 10px 0;
+  }
+
+  p {
+    line-height: 1.4em;
+  }
+
+  h3 {
+    font-size: 1.3rem;
+    padding-bottom: 4px;
+  }
+  time, .categories {
+    font-size: .7rem;
+  }
+}

data/_sass/morph/themes/obsidian.scss

@@ -0,0 +1,86 @@
+// scss-docs-start color-variables
+
+// skin colors
+$color-base: #464646 !default;
+
+$color-primary-light: #404040 !default;
+$color-primary: #343434 !default;
+$color-primary-dark: #282828 !default;
+
+$color-secondary-light: #eeeeee !default;
+$color-secondary: #c9c9c9 !default;
+$color-secondary-dark: #a8a8a8 !default;
+
+$color-link-light: #acd3ff !default;
+$color-link: #6da0e2 !default;
+$color-link-dark: #3b84ea !default;
+
+$color-rang1: #ffd191 !default;
+$color-rang2: #cb85d7 !default;
+$color-logo: $color-link-light !default;
+
+.highlight { background: #2b2b2b; color: #f9f7f3 }
+.highlight .hll { background-color: #3a4055 }
+.highlight .c { color: #5a647e } /* Comment */
+.highlight .err { color: #da4939 } /* Error */
+.highlight .k { color: #b6b3eb } /* Keyword */
+.highlight .l { color: #cc7833 } /* Literal */
+.highlight .n { color: #f9f7f3 } /* Name */
+.highlight .o { color: #519f50 } /* Operator */
+.highlight .p { color: #f9f7f3 } /* Punctuation */
+.highlight .cm { color: #5a647e } /* Comment.Multiline */
+.highlight .cp { color: #5a647e } /* Comment.Preproc */
+.highlight .c1 { color: #5a647e } /* Comment.Single */
+.highlight .cs { color: #5a647e } /* Comment.Special */
+.highlight .gd { color: #da4939 } /* Generic.Deleted */
+.highlight .ge { font-style: italic } /* Generic.Emph */
+.highlight .gh { color: #f9f7f3; font-weight: bold } /* Generic.Heading */
+.highlight .gi { color: #a5c261 } /* Generic.Inserted */
+.highlight .gp { color: #5a647e; font-weight: bold } /* Generic.Prompt */
+.highlight .gs { font-weight: bold } /* Generic.Strong */
+.highlight .gu { color: #519f50; font-weight: bold } /* Generic.Subheading */
+.highlight .kc { color: #b6b3eb } /* Keyword.Constant */
+.highlight .kd { color: #b6b3eb } /* Keyword.Declaration */
+.highlight .kn { color: #519f50 } /* Keyword.Namespace */
+.highlight .kp { color: #b6b3eb } /* Keyword.Pseudo */
+.highlight .kr { color: #b6b3eb } /* Keyword.Reserved */
+.highlight .kt { color: #ffc66d } /* Keyword.Type */
+.highlight .ld { color: #a5c261 } /* Literal.Date */
+.highlight .m { color: #cc7833 } /* Literal.Number */
+.highlight .s { color: #a5c261 } /* Literal.String */
+.highlight .na { color: #6d9cbe } /* Name.Attribute */
+.highlight .nb { color: #f9f7f3 } /* Name.Builtin */
+.highlight .nc { color: #ffc66d } /* Name.Class */
+.highlight .no { color: #da4939 } /* Name.Constant */
+.highlight .nd { color: #519f50 } /* Name.Decorator */
+.highlight .ni { color: #f9f7f3 } /* Name.Entity */
+.highlight .ne { color: #da4939 } /* Name.Exception */
+.highlight .nf { color: #6d9cbe } /* Name.Function */
+.highlight .nl { color: #f9f7f3 } /* Name.Label */
+.highlight .nn { color: #ffc66d } /* Name.Namespace */
+.highlight .nx { color: #6d9cbe } /* Name.Other */
+.highlight .py { color: #f9f7f3 } /* Name.Property */
+.highlight .nt { color: #519f50 } /* Name.Tag */
+.highlight .nv { color: #da4939 } /* Name.Variable */
+.highlight .ow { color: #519f50 } /* Operator.Word */
+.highlight .w { color: #f9f7f3 } /* Text.Whitespace */
+.highlight .mf { color: #cc7833 } /* Literal.Number.Float */
+.highlight .mh { color: #cc7833 } /* Literal.Number.Hex */
+.highlight .mi { color: #cc7833 } /* Literal.Number.Integer */
+.highlight .mo { color: #cc7833 } /* Literal.Number.Oct */
+.highlight .sb { color: #a5c261 } /* Literal.String.Backtick */
+.highlight .sc { color: #f9f7f3 } /* Literal.String.Char */
+.highlight .sd { color: #5a647e } /* Literal.String.Doc */
+.highlight .s2 { color: #a5c261 } /* Literal.String.Double */
+.highlight .se { color: #cc7833 } /* Literal.String.Escape */
+.highlight .sh { color: #a5c261 } /* Literal.String.Heredoc */
+.highlight .si { color: #cc7833 } /* Literal.String.Interpol */
+.highlight .sx { color: #a5c261 } /* Literal.String.Other */
+.highlight .sr { color: #a5c261 } /* Literal.String.Regex */
+.highlight .s1 { color: #a5c261 } /* Literal.String.Single */
+.highlight .ss { color: #a5c261 } /* Literal.String.Symbol */
+.highlight .bp { color: #f9f7f3 } /* Name.Builtin.Pseudo */
+.highlight .vc { color: #da4939 } /* Name.Variable.Class */
+.highlight .vg { color: #da4939 } /* Name.Variable.Global */
+.highlight .vi { color: #da4939 } /* Name.Variable.Instance */
+.highlight .il { color: #cc7833 } /* Literal.Number.Integer.Long */

data/_sass/morph/themes/silver.scss

@@ -0,0 +1,79 @@
+// Build colors
+
+$colors: (
+  "base": white,
+  "primary-light": #f8f8f8,
+  "primary": #f4f4f4,
+  "primary-dark": #e5e5e5,
+  "secondary-light": #7a7a7a,
+  "secondary": #515151,
+  "secondary-dark": #303030,
+  "link-light": #729fcf,
+  "link": #3465a4,
+  "link-dark": #204a87,
+  "rang1": #e9b96e,
+  "rang2": #75507b,
+  "logo": #204a87
+) !default;
+
+.highlight {
+  .c     { color: #998; font-style: italic } // Comment
+  .err   { color: #a61717; background-color: #e3d2d2 } // Error
+  .k     { font-weight: bold } // Keyword
+  .o     { font-weight: bold } // Operator
+  .cm    { color: #998; font-style: italic } // Comment.Multiline
+  .cp    { color: #999; font-weight: bold } // Comment.Preproc
+  .c1    { color: #998; font-style: italic } // Comment.Single
+  .cs    { color: #999; font-weight: bold; font-style: italic } // Comment.Special
+  .gd    { color: #000; background-color: #fdd } // Generic.Deleted
+  .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific
+  .ge    { font-style: italic } // Generic.Emph
+  .gr    { color: #a00 } // Generic.Error
+  .gh    { color: #999 } // Generic.Heading
+  .gi    { color: #000; background-color: #dfd } // Generic.Inserted
+  .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific
+  .go    { color: #888 } // Generic.Output
+  .gp    { color: #555 } // Generic.Prompt
+  .gs    { font-weight: bold } // Generic.Strong
+  .gu    { color: #aaa } // Generic.Subheading
+  .gt    { color: #a00 } // Generic.Traceback
+  .kc    { font-weight: bold } // Keyword.Constant
+  .kd    { font-weight: bold } // Keyword.Declaration
+  .kp    { font-weight: bold } // Keyword.Pseudo
+  .kr    { font-weight: bold } // Keyword.Reserved
+  .kt    { color: #458; font-weight: bold } // Keyword.Type
+  .m     { color: #099 } // Literal.Number
+  .s     { color: #d14 } // Literal.String
+  .na    { color: #008080 } // Name.Attribute
+  .nb    { color: #0086B3 } // Name.Builtin
+  .nc    { color: #458; font-weight: bold } // Name.Class
+  .no    { color: #008080 } // Name.Constant
+  .ni    { color: #800080 } // Name.Entity
+  .ne    { color: #900; font-weight: bold } // Name.Exception
+  .nf    { color: #900; font-weight: bold } // Name.Function
+  .nn    { color: #555 } // Name.Namespace
+  .nt    { color: #000080 } // Name.Tag
+  .nv    { color: #008080 } // Name.Variable
+  .ow    { font-weight: bold } // Operator.Word
+  .w     { color: #bbb } // Text.Whitespace
+  .mf    { color: #099 } // Literal.Number.Float
+  .mh    { color: #099 } // Literal.Number.Hex
+  .mi    { color: #099 } // Literal.Number.Integer
+  .mo    { color: #099 } // Literal.Number.Oct
+  .sb    { color: #d14 } // Literal.String.Backtick
+  .sc    { color: #d14 } // Literal.String.Char
+  .sd    { color: #d14 } // Literal.String.Doc
+  .s2    { color: #d14 } // Literal.String.Double
+  .se    { color: #d14 } // Literal.String.Escape
+  .sh    { color: #d14 } // Literal.String.Heredoc
+  .si    { color: #d14 } // Literal.String.Interpol
+  .sx    { color: #d14 } // Literal.String.Other
+  .sr    { color: #009926 } // Literal.String.Regex
+  .s1    { color: #d14 } // Literal.String.Single
+  .ss    { color: #990073 } // Literal.String.Symbol
+  .bp    { color: #999 } // Name.Builtin.Pseudo
+  .vc    { color: #008080 } // Name.Variable.Class
+  .vg    { color: #008080 } // Name.Variable.Global
+  .vi    { color: #008080 } // Name.Variable.Instance
+  .il    { color: #099 } // Literal.Number.Integer.Long
+}

data/_sass/post.scss

@@ -0,0 +1,194 @@
+@import "morph/variables";
+@import "morph/colors";
+@import "morph/functions";
+@import "morph/components/highlight";
+@import "morph/components/catalogue";
+
+.page-post {
+  .content {
+    .position-sticky-top {
+      position: sticky;
+      top: 0;
+    }
+
+    .status-bar {
+      @include media-sm() {
+        top: 0;
+      }
+      height: 3rem;
+
+      .structure-menu {
+        height: 100%;
+
+        button {
+          display: none;
+          padding: .4rem .6rem;
+          border-radius: 100%;
+          border: 1px solid $color-primary;
+          @include media-sm() {
+            display: inline;
+          }
+        }
+      }
+    }
+
+    // left area
+    .left {
+      padding: 2rem 0;
+      color: $color-secondary;
+      width: 70%;
+      @include media-sm() {
+        width: 100%;
+      }
+
+      header {
+        padding: 0 0 2.5rem 0;
+        .title {
+          font-size: 2.5rem;
+          padding: .5rem 0;
+          @include media-sm() {
+            font-size: 2rem;
+          }
+        }
+      }
+    }
+
+    // right area
+    .right {
+      margin-left: 2rem;
+      padding: 2rem 0;
+      width: 30%;
+
+      #scroll-top-lg {
+        display: none;
+        position: fixed;
+        bottom: 7rem;
+        width: 3rem;
+        height: 2.5rem;
+        border-radius: 8px;
+        line-height: 2.5rem;
+        border: 1px solid $color-primary-dark;
+        font-size: 2rem;
+        margin-left: 3em;
+        &:hover {
+          background-color: $color-secondary-dark;
+          color: $color-primary-dark;
+        }
+      }
+
+      h2 {
+        padding: 0 0 1rem 1rem;
+        border-left: 2px solid $color-primary-dark;
+        border-bottom: 2px solid $color-primary-dark;
+      }
+    }
+
+    // article area
+    article.text {
+      color: map-get($colors, 'secondary-light');
+      font-size: 16px;
+      line-height: 1.5;
+
+      h1, h2, h3, h4, h5, h6,
+      p, blockquote, pre,
+      ul, ol, dl, figure,
+      %vertical-rhythm {
+        margin-bottom: .8rem;
+      }
+
+      ul, ol {
+        margin-left: 1.5rem;
+      }
+
+      li {
+        &::marker {
+          color: $color-secondary-dark;
+        }
+        > ul,
+        > ol {
+          margin-bottom: 0;
+        }
+      }
+
+      hr {
+        margin-top: 1rem;
+        margin-bottom: 1rem;
+      }
+
+      figure > img {
+        display: block;
+      }
+
+      a {
+        &:hover {
+          text-decoration: underline;
+        }
+      }
+
+      blockquote {
+        p {
+          color: $color-secondary;
+        }
+        border-left: 4px solid $color-rang1;
+        padding-left: .5em;
+        font-style: italic;
+
+        i, em {
+          font-style: normal;
+        }
+      }
+
+      // header style and anchor animations
+      h1, h2, h3, h4, h5, h6 {
+        font-weight: normal;
+        color: $color-secondary-dark;
+        margin-top: 2.5rem;
+        //padding: 1rem 0 .5rem 0;
+        .header-anchor {
+          display: none;
+          margin-left: 5px;
+          font-size: .7em;
+        }
+
+        &:hover .header-anchor {
+          display: inline-block;
+          animation: fade-in .5s;
+          -webkit-animation: fade-in .5s;
+        }
+      }
+
+      // table
+      table:not(.rouge-table) {
+        margin-bottom: 1rem;
+        width: 100%;
+        text-align: left;
+        color: $color-secondary;
+        border-collapse: collapse;
+        border: 1px solid $color-primary-dark;
+        tr {
+          &:nth-child(even) {
+            background-color: $color-primary;
+          }
+        }
+        th, td {
+          padding: (2rem / 3) (2rem / 2);
+        }
+        th {
+          background-color: $color-primary-dark;
+          border: 1px solid $color-primary-dark;
+        }
+        td {
+          border: 1px solid $color-primary-dark;
+        }
+
+        @include media-sm() {
+          display: block;
+          overflow-x: auto;
+          -webkit-overflow-scrolling: touch;
+          -ms-overflow-style: -ms-autohiding-scrollbar;
+        }
+      }
+
+    }
+  }
+}