jekyll-dash 1.0.0

data/_sass/dash/_base.scss

@@ -0,0 +1,181 @@
+body {
+  font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family;
+  color: $color-foreground;
+  background-color: $color-background-darker;
+  -webkit-text-size-adjust: 100%;
+  -webkit-font-feature-settings: "kern" 1;
+     -moz-font-feature-settings: "kern" 1;
+       -o-font-feature-settings: "kern" 1;
+          font-feature-settings: "kern" 1;
+  font-kerning: normal;
+  display: flex;
+  min-height: 100vh;
+  flex-direction: column;
+}
+
+body, html {
+  margin: 0;
+  padding: 0;
+}
+
+/**
+ * Set `margin-bottom` to maintain vertical rhythm
+ */
+h1, h2, h3, h4, h5, h6,
+p, blockquote, pre,
+ul, ol, dl, figure,
+%vertical-rhythm {
+  margin-bottom: $spacing-unit / 2;
+}
+
+figure {
+  width: 100%;
+  margin: 0;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  color: $color-blue;
+}
+
+/**
+ * `main` element
+ */
+main {
+  display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */
+}
+
+/**
+ * Images
+ */
+img {
+  max-width: 100%;
+  vertical-align: middle;
+}
+
+/**
+ * Figures
+ */
+figure > img {
+  display: block;
+}
+
+figcaption {
+  font-size: $small-font-size;
+}
+
+/**
+ * Lists
+ */
+ul, ol {
+  margin-left: $spacing-unit;
+}
+
+li {
+  > ul,
+  > ol {
+    margin-bottom: 0;
+  }
+}
+
+/**
+ * Headings
+ */
+h1, h2, h3, h4, h5, h6 {
+  font-weight: $base-font-weight;
+  margin-top: 1em;
+  margin-bottom: 0.5em;
+}
+
+/**
+ * Links
+ */
+a {
+  color: $color-pink;
+  text-decoration: none;
+
+  &:hover {
+    color: $color-foreground;
+    text-decoration: underline;
+  }
+
+  .social-media-list &:hover {
+    text-decoration: none;
+
+    .username {
+      text-decoration: underline;
+    }
+  }
+}
+
+
+/**
+ * Blockquotes
+ */
+blockquote {
+  color: $color-background-dark;
+  @include relative-font-size(1.125);
+  letter-spacing: -1px;
+  font-style: italic;
+
+  > :last-child {
+    margin-bottom: 0;
+  }
+}
+
+
+
+/**
+ * Code formatting
+ */
+pre,
+code {
+  @include relative-font-size(0.9375);
+  border-radius: 3px;
+  background-color: $color-background-dark;
+}
+
+code {
+  padding: 1px 5px;
+}
+
+pre {
+  padding: 8px 12px;
+  overflow-x: auto;
+
+  > code {
+    border: 0;
+    padding-right: 0;
+    padding-left: 0;
+  }
+}
+
+/**
+ * Wrapper
+ */
+.wrapper {
+  max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit}));
+  max-width:         calc(#{$content-width} - (#{$spacing-unit}));
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: $spacing-unit / 2;
+  padding-left: $spacing-unit / 2;
+  @extend %clearfix;
+
+  @media screen and (min-width: $on-large) {
+    max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit} * 2));
+    max-width:         calc(#{$content-width} - (#{$spacing-unit} * 2));
+    padding-right: $spacing-unit;
+    padding-left: $spacing-unit;
+  }
+}
+
+
+
+/**
+ * Clearfix
+ */
+%clearfix:after {
+  content: "";
+  display: table;
+  clear: both;
+}

data/_sass/dash/_colors.scss

@@ -0,0 +1,36 @@
+$color-background-dark: #1E2227;
+$color-background-darker: #15171A;
+$color-foreground: #DAE4ED;
+$color-foreground-dark: lighten($color-background-dark, 30%);
+$color-pink: #F24784;
+$color-red: #FC4957;
+$color-orange: #EA9D53;
+$color-yellow: #FCBC28;
+$color-teal: #4BC997;
+$color-green: #50BD6A;
+$color-cyan: #4FC1E4;
+$color-blue: #637AFE;
+$color-indigo: #6775C4;
+$color-purple: #8E59D7;
+
+.color-pink { color: $color-pink; }
+.color-red { color: $color-red; }
+.color-orange { color: $color-orange; }
+.color-yellow { color: $color-yellow; }
+.color-teal { color: $color-teal; }
+.color-green { color: $color-green; }
+.color-cyan { color: $color-cyan; }
+.color-blue { color: $color-blue; }
+.color-indigo { color: $color-indigo; }
+.color-purple { color: $color-purple; }
+
+.color-pink-hover:hover { color: $color-pink; }
+.color-red-hover:hover { color: $color-red; }
+.color-orange-hover:hover { color: $color-orange; }
+.color-yellow-hover:hover { color: $color-yellow; }
+.color-teal-hover:hover { color: $color-teal; }
+.color-green-hover:hover { color: $color-green; }
+.color-cyan-hover:hover { color: $color-cyan; }
+.color-blue-hover:hover { color: $color-blue; }
+.color-indigo-hover:hover { color: $color-indigo; }
+.color-purple-hover:hover { color: $color-purple; }

data/_sass/dash/_fonts.scss

@@ -0,0 +1,15 @@
+@mixin font($font-family, $font-file) {
+  @font-face {
+    font-family: $font-family;
+    src: url($font-file+'.eot');
+    src: url($font-file+'.eot?#iefix') format('embedded-opentype'),
+         url($font-file+'.woff') format('woff'),
+         url($font-file+'.ttf') format('truetype'),
+         url($font-file+'.svg#aller') format('svg');
+    font-weight: normal;
+    font-style: normal;
+  }
+}
+
+@include font('Varela Round', '/assets/fonts/VarelaRound-Regular');
+@include font('Roboto Mono', '/assets/fonts/RobotoMono-Medium');

data/_sass/dash/_layout.scss

@@ -0,0 +1,155 @@
+.site-header {
+  min-height: $spacing-unit * 1.865;
+  line-height: $base-line-height * $base-font-size * 2.25;
+
+  // Positioning context for the mobile navigation icon
+  position: relative;
+
+  .blinking_cursor {
+    animation: blinker 1s none infinite;
+    font-size: $base-font-size;
+  }
+
+  .command_prompt {
+    color: $color-blue;
+    font-size: $base-font-size;
+  }
+}
+
+.site-title {
+  @include relative-font-size(1.625);
+  font-weight: 300;
+  margin-bottom: 0;
+  float: left;
+
+  @include media-query($on-palm) {
+    padding-right: 45px;
+  }
+
+  &,
+  &:visited,
+  &:hover {
+    color: $color-foreground;
+    text-decoration: none;
+  }
+}
+
+.wrapper {
+  text-align: justify;
+}
+
+/**
+ * Author box
+ */
+
+ .author-box {
+   margin-bottom: 1em;
+   text-align: left;
+   min-height: 72px;
+   font-style: italic;
+   & > .author-avatar {
+     float: left;
+     white-space: pre-line;
+     margin-right: 1em;
+     width: 72px;
+     height: 72px;
+   }
+ }
+
+.site-header {
+  margin-bottom: 1em;
+}
+
+
+.post-title {
+    color: $color-foreground;
+}
+
+.post {
+  .post-date {
+    margin-top: 0.5em;
+    color: $color-foreground-dark;
+  }
+}
+
+.post-link-wrapper {
+   margin-bottom: 1.5em;
+   & > .post-link {
+     font-size: $base-font-size;
+     font-size: $post-link-font-size;
+   }
+
+   & > .post-meta {
+     color: $color-foreground-dark;
+     font-size: $small-font-size;
+   }
+ }
+
+.tag {
+  color: $color-green;
+  background-color: $color-background-dark;
+  padding: 0.3em 0.6em;
+  border-radius: 0.3em;
+  &:hover {
+    text-decoration: none;
+    color: lighten($color-green, 20%);
+    background-color: lighten($color-background-dark, 5%);
+  }
+}
+
+.post-tags {
+  margin-top: 0.3em;
+  margin-bottom: 0.5em;
+}
+
+.credits {
+  font-size: 10px;
+  color: lighten($color-background-dark, 5%);
+
+  & > a {
+    color: lighten($color-background-dark, 10%);
+    text-decoration: underline;
+  }
+}
+
+.pagination {
+  font-size: $post-link-font-size;
+  margin: 2em 0;
+  & > a, & > span {
+    font-weight: normal;
+    display: inline-block;
+    min-width: 1em;
+
+    padding: 0.3em 0.6em;
+    border-radius: 0.3em;
+    text-align: center;
+
+    &:hover {
+      text-decoration: none;
+    }
+  }
+
+  & > a {
+    color: $color-green;
+    background-color: $color-background-dark;
+    &:hover {
+      color: lighten($color-green, 20%);
+      background-color: lighten($color-background-dark, 5%);
+    }
+  }
+
+  & > span {
+    color: darken($color-foreground, 20%);
+    background-color: darken($color-background-dark, 3%);
+  }
+}
+
+.social_links {
+  float: right;
+  & > a {
+    color: darken($color-foreground, 20%);
+    display: inline-block;
+    margin-left: 0.2em;
+    font-size: $post-link-font-size * 1.25;
+  }
+}

data/_sass/dash/_syntax-highlighting.scss

@@ -0,0 +1,71 @@
+/**
+ * Syntax highlighting styles
+ */
+.highlight {
+  @extend %vertical-rhythm;
+
+  font-family: $syntax-font-family;
+  line-height: $syntax-line-height;
+  font-weight: 600;
+
+  .c     { color: lighten($color-background-dark, 30%);} // Comment
+  .err   { color: #a61717; } // Error
+  .k     { color: $color-blue; } // Keyword
+  .o     { font-weight: bold } // Operator
+  .cm    { color: lighten($color-background-dark, 30%); font-style: italic } // Comment.Multiline
+  .cp    { color: lighten($color-background-dark, 30%); font-weight: bold } // Comment.Preproc
+  .c1    { color: lighten($color-background-dark, 30%); font-style: italic } // Comment.Single
+  .cs    { color: lighten($color-background-dark, 30%); font-weight: bold; font-style: italic } // Comment.Special
+  .gd    { color: $color-foreground; } // Generic.Deleted
+  .gd .x { color: $color-foreground; } // Generic.Deleted.Specific
+  .ge    { font-style: italic } // Generic.Emph
+  .gr    { color: $color-red } // Generic.Error
+  .gh    { color: $color-foreground } // Generic.Heading
+  .gi    { color: $color-foreground; } // Generic.Inserted
+  .gi .x { color: $color-foreground; } // Generic.Inserted.Specific
+  .go    { color: $color-foreground } // Generic.Output
+  .gp    { color: $color-foreground } // 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    { color: $color-blue; font-weight: bold } // Keyword.Declaration
+  .kp    { font-weight: bold } // Keyword.Pseudo
+  .kr    { font-weight: bold } // Keyword.Reserved
+  .kt    { color: $color-blue; font-weight: bold } // Keyword.Type
+  .m     { color: $color-orange } // Literal.Number
+  .s     { color: $color-green; } // Literal.String
+  .n     { color: $color-foreground; }
+  .na    { color: $color-foreground; } // Name.Attribute
+  .nb    { color: $color-foreground } // Name.Builtin
+  .nc    { color: $color-pink; } // Name.Class
+  .no    { color: $color-foreground } // Name.Constant
+  .ni    { color: #800080 } // Name.Entity
+  .ne    { color: #900; font-weight: bold } // Name.Exception
+  .nf    { color: $color-pink; } // Name.Function
+  .nn    { color: $color-foreground } // Name.Namespace
+  .nt    { color: $color-foreground } // Name.Tag
+  .nv    { color: $color-foreground } // Name.Variable
+  .ow    { font-weight: bold } // Operator.Word
+  .w     { color: #bbb } // Text.Whitespace
+  .mf    { color: $color-orange } // Literal.Number.Float
+  .mh    { color: $color-orange } // Literal.Number.Hex
+  .mi    { color: $color-orange } // Literal.Number.Integer
+  .mo    { color: $color-orange } // Literal.Number.Oct
+  .sb    { color: $color-orange } // Literal.String.Backtick
+  .sc    { color: $color-green } // Literal.String.Char
+  .sd    { color: $color-green } // Literal.String.Doc
+  .s2    { color: $color-green } // Literal.String.Double
+  .se    { color: $color-green } // Literal.String.Escape
+  .sh    { color: $color-green } // Literal.String.Heredoc
+  .si    { color: $color-green } // Literal.String.Interpol
+  .sx    { color: $color-green } // Literal.String.Other
+  .sr    { color: $color-cyan } // Literal.String.Regex
+  .s1    { color: $color-green } // Literal.String.Single
+  .ss    { color: $color-green } // Literal.String.Symbol
+  .bp    { color: #999 } // Name.Builtin.Pseudo
+  .vc    { color: $color-pink } // Name.Variable.Class
+  .vg    { color: $color-pink } // Name.Variable.Global
+  .vi    { color: $color-pink } // Name.Variable.Instance
+  .il    { color: $color-orange } // Literal.Number.Integer.Long
+}

data/_sass/dash.scss

@@ -0,0 +1,43 @@
+@charset "utf-8";
+
+
+$base-font-family: 'Varela Round', sans-serif;
+$syntax-font-family: 'Roboto Mono', monospace;
+$base-font-size:   16px !default;
+$post-link-font-size: $base-font-size * 1.25 !default;
+$base-font-weight: 500 !default;
+$small-font-size:  $base-font-size * 0.875 !default;
+$base-line-height: 1.5 !default;
+$syntax-line-height: 1.2 !default;
+
+// Width of the content area
+$content-width:    800px !default;
+
+$on-palm:          600px !default;
+$on-laptop:        800px !default;
+
+$on-medium:        $on-palm !default;
+$on-large: $on-laptop !default;
+
+$spacing-unit: 30px !default;
+
+
+@mixin media-query($device) {
+  @media screen and (max-width: $device) {
+    @content;
+  }
+}
+
+@mixin relative-font-size($ratio) {
+  font-size: $base-font-size * $ratio;
+}
+
+// Import partials.
+@import
+  "dash/fonts",
+  "dash/colors",
+  "dash/animations",
+  "dash/base",
+  "dash/layout",
+  "dash/syntax-highlighting"
+;

data/assets/css/style.scss

@@ -0,0 +1,5 @@
+---
+# Only the main Sass file needs front matter (the dashes are enough)
+---
+
+@import "dash";