alb3rtobr-test 1.0.1

data/master_middleman/source/stylesheets/all.css.scss

@@ -0,0 +1,3 @@
+@import "base";
+@import "layout-styles";
+@import "book-styles";

data/master_middleman/source/stylesheets/base.scss

@@ -0,0 +1,324 @@
+@import "font-awesome/variables";
+@import "font-awesome/core";
+@import "font-awesome/path";
+
+@import "partials/vars";
+@import "partials/mixins";
+
+@import "partials/reset";
+@import "partials/default";
+
+@import "partials/syntax-highlight";
+@import "partials/header";
+@import "partials/footer";
+@import "partials/search";
+@import "partials/sidenav";
+
+// ~LAYOUT
+// ===================================================
+.container {
+  background: #fff;
+  clear: both;
+  margin: 0 auto;
+  max-width: 1024px;
+}
+.content-layout {
+  padding: 2em 1.5em 2em 1.5em;
+  @media (min-width: $bp-wide) {
+    padding-top: 0;
+  }
+
+  @media (min-width: $bp-wide) {
+    #top:before {
+      content: '';
+      padding-bottom: 4em;
+      border: none;
+      display: block;
+    }
+  }
+}
+.has-subnav .container {
+  max-width: auto;
+  @media (min-width: $bp-wide) {
+    margin-left: $sidenav-wide;
+  }
+  @media (min-width: $bp-widest) {
+    margin-left: $sidenav-widest;
+  }
+}
+.has-subnav .content-layout {
+  @media (min-width: $bp-wide) {
+    max-width: 45em;
+    padding: 0 2em 2em;
+  }
+}
+.nav-container {
+  @media (min-width: $bp-wide) {
+    position: fixed;
+    z-index: 10;
+    top: 38px;
+    left: 0;
+    bottom: 0;
+    overflow-y: auto;
+    overflow-x: hidden;
+    -webkit-overflow-scrolling: touch;
+    width: $sidenav-wide;
+  }
+  @media (min-width: $bp-widest) {
+    width: $sidenav-widest;
+  }
+}
+
+
+// ~SIDE NAV RELATED STYLES
+// ===================================================
+.has-sidenav table {
+  border-color: $color-border;
+  border: 1px solid $color-border;
+}
+.has-sidenav th {
+  background-color: transparentize($color-accent, 0.95);
+}
+.has-sidenav table tr:nth-child(2n+1) {
+  background: none;
+}
+.has-sidenav .content tr:nth-child(2n+1) {
+  background-color: $color-border-row;
+}
+
+// ~GRID HELPER
+// ===================================================
+.span3 {
+  display: block;
+  @media (min-width: $bp-wide) {
+    // 2 col
+    float: left;
+    margin-right: 2%;
+    width: 48%;
+  }
+  @media (min-width: $bp-widest) {
+    // 3 col
+    width: 32%;
+  }
+}
+// first of 2
+.span3:nth-child(2n+1) {
+  @media (min-width: $bp-wide) and (max-width: $bp-widest) {
+    clear: left;
+  }
+}
+// last of 2
+.span3:nth-child(2n) {
+  @media (min-width: $bp-wide) and (max-width: $bp-widest) {
+    margin-right: 0;
+  }
+}
+
+// first of 3
+.span3:nth-child(3n+1) {
+  @media (min-width: $bp-widest) {
+    clear: left;
+  }
+}
+// last of 3
+.span3:nth-child(3n) {
+  @media (min-width: $bp-widest) {
+    margin-right: 0;
+  }
+}
+
+/*doc
+---
+title: Title Container
+name: title_container
+category: basics
+---
+```html_example
+<h1 class="title-container">
+  Lorem Ipsum Dolor
+</h1>
+```
+*/
+
+// Title of content
+.title-container {
+  line-height: 1.1;
+  font-weight: 600;
+  font-size: $font-size-xl;
+  margin-top: 0;
+  @media (min-width: $bp-wide) {
+    font-size: $font-size-xxl
+  }
+}
+
+// ~QUICK LINKS
+// ===================================================
+/*doc
+---
+title: Nav - Quick Links
+name: nav-quick_links
+category: basics
+---
+```html_example
+<div class="quick-links">
+  <ul>
+  <li><a href="#">quick link</a></li>
+  <li><a href="#">quick link</a></li>
+  <li><a href="#">quick link</a></li>
+  </ul>
+</div>
+```
+*/
+.quick-links {
+  background-color: $color-bg-light;
+  border-radius: 3px;
+  border: 1px solid $color-border-superlight;
+  display: inline-block;
+  padding: 1em 1.5em;
+
+  ol, ul, li {
+    margin: 0;
+  }
+
+  > ul {
+    list-style-position: inside;
+    list-style-type: disk;
+    margin-left: -1em;
+
+    &:before {
+      content: "In this topic:";
+      display: block;
+      padding-bottom: 0.25em;
+    }
+  }
+
+  ul ul {
+    padding-left: 1.8em;
+  }
+}
+
+.list-style-none .quick-links > ul {
+  list-style-type: none;
+}
+
+// ~CONTENT
+// ===================================================
+// Designate external links with an icon
+
+/*doc
+---
+title: Link External
+name: link_external
+category: basics
+---
+```html_example
+<a class="external-link" href="#">Link</a>
+```
+*/
+.content a[href^="http"]:after,
+.external-link:after {
+  @extend .fa;
+  content: $fa-var-external-link;
+  font-size: 0.75em;
+  padding-left: 0.5em;
+}
+
+.content a:hover,
+.content a:focus,
+.content a:active,
+.link:hover,
+.link:focus,
+.link:active {
+  background-color: transparentize($color-accent-bright, 0.92);
+  border-bottom-style: solid;
+}
+
+// Enlarge first paragraph of content.
+
+/*doc
+---
+title: Content Helper - Intro
+name: content_helper-intro
+category: basics
+---
+```html_example
+<p class="intro">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus totam libero facilis voluptatem aliquam incidunt ipsa officiis, dicta nihil expedita, molestiae delectus impedit hic quidem deserunt laudantium, sint debitis tenetur.</p>
+```
+*/
+
+.intro {
+  font-size: $font-size-m;
+  font-weight: 300;
+}
+
+// ~CODE EXAMPLE STYLES
+// ===================================================
+
+/*doc
+---
+title: Code Example - Terminal
+name: code_example-terminal
+category: basics
+---
+```html_example
+<pre class="terminal">$ keytool -import -alias ops-metrics-ssl -file ops-metrics.cer -keystore localhost.truststore</pre>
+```
+*/
+
+.terminal {
+  background-color: #3a3a3a;
+  border: 0;
+  color: #fefefe;
+}
+
+
+// ~BACK TO TOP
+// ===================================================
+.to-top {
+  visibility: hidden;
+  opacity: 0;
+  @include transition(all 0.2s linear);
+  a {
+    border: 0;
+    bottom: 4em;
+    position: fixed;
+    right: 4em;
+    z-index: 10;
+    &:hover {
+      background: none;
+    }
+    &:before {
+      content: $fa-var-arrow-up;
+      @extend .fa;
+      background: $color-accent-bright;
+      box-shadow: 0 0 9px rgba(153, 153, 153, 0.8);
+      color: #fff;
+      line-height: 2.5em;
+      height: 2.5em;
+      text-align: center;
+      width: 2.5em;
+    }
+  }
+  &.sticky {
+    // display: inline-block;
+    visibility: visible;
+    opacity: 1;
+  }
+  @media (max-width: $bp-wide) {
+    // Hide back to top on narrow width screens
+    display: none;
+  }
+}
+// Hide back to top on homepage
+.index .to-top {
+  display: none;
+}
+
+.partial-notice {
+  color: red;
+  font-size: $font-size-m;
+
+  ul {
+    font-size: $font-size-s;
+  }
+}

data/master_middleman/source/stylesheets/partials/_default.scss

@@ -0,0 +1,302 @@
+/*
+ * FILE: _default.scss
+======================================================================== */
+* {
+  -webkit-font-smoothing: antialiased;
+}
+html {
+  font-size: 1em;
+}
+body {
+  background-color: #fff;
+  // background-color: $color-bg;
+  font-family: $font-primary;
+  font-weight: 400;
+  line-height: 1.45;
+  color: #333;
+  margin: 0;
+  padding: 0;
+}
+
+// Paragraphs
+p {
+  margin-bottom: 1.3em;
+}
+li p {
+  margin: 0; // Hack to fix broken markdown.
+}
+
+/*doc
+---
+title: Link Default
+name: link_default
+category: basics
+---
+```html_example
+<a class="link" href="#">Link</a>
+```
+*/
+
+a, .link {
+  border-bottom: 1px dotted lighten(desaturate($color-link, 40%), 40%);
+  color: $color-link;
+  text-decoration: none;
+  @include transition(all 0.1s linear);
+}
+
+img {
+  height: auto;
+  max-width: 100%;
+}
+
+// Type Scale: Major Third 1.250
+h1, h2, h3, h4, h5, h6 {
+  margin: 60px 0 0.5em;
+  font-weight: inherit;
+  line-height: 1.2;
+}
+
+.steps-header {
+  margin-top: -0.2em;
+}
+
+/*doc
+---
+title: Headings
+name: headings
+category: basics
+---
+```html_example
+<h1>h1. heading level 1</h1>
+<h2>h2. heading level 2</h2>
+<h3>h3. heading level 3</h3>
+<h4>h4. heading level 4</h4>
+<div class="h2">this is a div with an h2 class</div>
+<h5 class="h3">this is an h5 with an h3 class</h5>
+<h2><a id='fake-anchor'></a>h2. heading with link</h2>
+<h3><a id='other-fake-anchor'></a>h3. heading with link</h3>
+```
+*/
+
+h1, .h1 {
+  margin-top: 0;
+  font-size: $font-size-xxl;
+}
+h2, .h2 {
+  font-size: $font-size-xl;
+}
+h3, .h3 {
+  font-size: $font-size-l;
+}
+h4, h5, .h4 {
+  font-size: $font-size-m;
+}
+small,
+.font_small {
+  font-size: 0.8em;
+}
+h2 > a:before, h3 > a:before {
+  @media (min-width: $bp-wide) {
+    content: "";
+    display: block;
+    height: 80px;
+    margin: -80px 0 0;
+  }
+}
+
+// Lists
+ul,
+ol {
+  margin: 0 0 1em;
+}
+ul {
+  padding: 0 0 0 1.2em;
+}
+ol {
+  padding: 0 0 0 1.4em;
+}
+ul ul,
+ol ol,
+ul ol,
+ol ul {
+  margin-top: 1em;
+  padding-bottom: 0
+}
+
+// Vertical spacing for ordered lists
+ol li {
+  margin: 0 0 1.3em;
+  padding: 0;
+}
+
+// Tight spacing for unordered lists
+ul li {
+  margin: 0 0 0.5em;
+  padding: 0;
+}
+
+// Tight spacing for nested lists
+li li {
+  margin-bottom: 0;
+}
+
+// Image spacing inside lists
+ol img,
+ul img {
+  margin: 0.5em 0;
+}
+
+// Input forms
+input {
+  background-color: #f1f1f1;
+  border: 1px solid $color-border;
+  border-radius: $radius;
+  box-shadow: $color-border 1px 1px 4px -2px inset;
+  color: $color-text;
+  display: block;
+  padding: 0.5em 1em;
+  @include transition(all 0.1s linear);
+  width: 100%;
+
+  &:hover {
+    border-color: transparentize(darken($color-accent, 10%), 0.5);
+    background-color: #fff;
+  }
+  &:focus {
+    background-color: #fff;
+    border-color: $color-accent;
+    box-shadow: $color-border 0 0 4px;
+    outline: 0;
+  }
+}
+
+// Tables
+table {
+  border-color: #b5b5b5;
+  border-collapse: collapse;
+  border-style: solid;
+  border-width: 1px;
+  color: #333333;
+  font-size: 1em;
+  margin-top: 1em;
+  padding: 0.8em 0.7rem;
+  width: 100%;
+}
+th {
+  background-color: #f8f8f8;
+  border-color: #b5b5b5;
+  color: #4b6475;
+  line-height: 1.1;
+  font-size: $font-size-s;
+  text-align: left;
+}
+tr {
+  color: #686868;
+}
+
+.content td, .content th, .content tr {
+  border: solid 1px grey;
+}
+
+.content tr:hover {
+  background-color: #fdfdfd;
+  color: #333;
+}
+
+caption {
+  font-size: $font-size-m;
+  padding: 0.5em;
+}
+
+// Code
+
+/*doc
+---
+title: Code Example - Default
+name: code_example-default
+category: basics
+---
+```html_example
+<pre><code class="highlight ruby"><span class="nb">require</span> <span class="s1">'ova_manager'</span>
+<span class="nb">require</span> <span class="s1">'vsphere_clients'</span>
+
+<span class="no">OvaManager</span><span class="o">::</span><span class="no">Deployer</span><span class="p">.</span><span class="nf">new</span><span class="p">({</span>
+  <span class="ss">host: </span><span class="s2">"172.16.74.3"</span><span class="p">,</span>
+  <span class="ss">user: </span><span class="s2">"root"</span><span class="p">,</span>
+  <span class="ss">password: </span><span class="s2">"vmware"</span>
+<span class="p">})</span>
+</code></pre>
+```
+*/
+
+pre {
+  background-color: #f0f0f0;
+  border-radius: 3px;
+  font-size: rem(13);
+  padding: 1em;
+  white-space: pre;
+  // max-width: 20em;
+  overflow: auto;
+}
+pre code {
+  background-color: transparent;
+  border: 0;
+  color: $color-text;
+  direction: ltr;
+  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  overflow: auto;
+  text-align: left;
+  margin: 0;
+  padding: 0;
+  word-spacing: normal;
+  word-break: normal;
+}
+
+/*doc
+---
+title: Code Example - Inline
+name: code_example-inline
+
+category: basics
+---
+```html_example
+<code>"mbus"=&gt;"nats://nats:nats@192.168.86.17:4222"</code>
+```
+*/
+
+code {
+  background-color: #f5f5ff;
+  border: 1px solid #e4e4e4;
+  display: inline-block;
+  font-size: rem(13);
+  line-height: 1.4;
+  margin: 0.2em 0.1em 0.1em;
+  padding: 0 0.4em 0 0.4em;
+  vertical-align: text-top;
+}
+code a {
+  color: #fefefe;
+}
+
+hr {
+  background-color: $color-border-light;
+  border: 0;
+  height: 1px;
+  float: left;
+  width: 100%;
+}
+.content pre {
+  &::-webkit-scrollbar {
+    -webkit-appearance: none;
+    width: 7px;
+    height: 7px;
+  }
+  &::-webkit-scrollbar-thumb {
+    border-radius: 4px;
+    background-color: rgba(0,0,0,.5);
+    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
+  }
+}
+.hidden {
+  display: none !important;
+}