old-techblog/assets/main.scss

---
---

$content-width:    750px;
$sidebar-width:    300px;
$on-xl:            1100px;

@import 'minima';
@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700|Archivo+Black|Tenor+Sans|Ubuntu+Mono');


html, body, div, p {
  font-family: 'Tenor';
  letter-spacing: -0.05px;
}

body {
  font-size: 18px;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Archivo Black';
}

pre, code {
  font-family: 'Ubuntu Mono';
  background-color: #efefef;
}

a, a:active, a:visited {
  color: #2d753a;
}

body > header.site-header {
  background-color: #000;
  border-bottom: none;
  border-top: none;
  box-shadow: 0px 5px 8px rgba(20, 20, 20, 0.5);
  z-index: 1;

  .site-title, .site-title:visited {
    font-family: 'Roboto';
    font-weight: 700;
    color: #fff;
    letter-spacing: 2px;
  }

  .site-nav {
    z-index: 1;

    .page-link, .page-link:visited {
      font-family: 'Roboto';
      font-weight: 500;
      letter-spacing: 1px;
      color: #fff;

      @include media-query($on-palm) {
        color: #000;
      }
    }
  }
}

.page-content {
  background: #f6f7f4;
  padding-top: 0px;
}

.outer-wrapper {
  box-shadow: 5px 2px 15px -4px rgba(0, 0, 0, 0.1);
  min-height: 700px;
}

.inner-wrapper {
  border-left: 1px solid #ccc;
}

.page-content > .wrapper {
  padding-top: 30px;
  background: #fff;
}

.post-list h3 a {
  font-size: 30px;
}

.post-content p {
  line-height: 2em;
}

img.profile {
  width: 300px;
}

.sidebar {
  line-height: 1.3em;
  background: linear-gradient(#eeefed, #fff);
  text-align: center;
  overflow: auto;

  img.me {
    width: 140px;
    border-radius: 180px;
    display: block;
    margin: 0px auto 30px auto;
  }

  a[href*=twitter] img {
    width: 120px;
    display: block;
    margin: 25px auto;
  }

  p {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5em;
    letter-spacing: 0.06px;

    strong {
      font-weight: 500;
    }
  }
}

.share_buttons {
  line-height: 1em;
  padding: 30px 0px 20px 0px !important;

  > p {
    margin-bottom: 0px;
    line-height: 1.5em;
  }

  > ul {
    margin-left: 0px;
    margin-bottom: 0px;

    > li > a > div.button {
      font-family: Roboto, Helvetica, Arial, sans-serif;
      font-weight: 500;
    }
  }
}