2 | -----------------------------------------------------------------------------
4 | -----------------------------------------------------------------------------
7 $maxPageWidth : 1000px;
10 $c-baseNormal : #555555;
11 $c-grayNormal : #f7f7f7;
13 $c-grayDark : darken($c-grayNormal, 5);
14 $c-baseLight : lighten($c-baseNormal, 20);
17 | -----------------------------------------------------------------------------
19 | -----------------------------------------------------------------------------
21 @import "vendor/normalize";
22 @import "helpers/mixins";
23 @import "helpers/classes";
26 | -----------------------------------------------------------------------------
27 | Resets and html + body styles
28 | -----------------------------------------------------------------------------
31 box-sizing: border-box;
34 h1, h2, h3, p, ul, blockquote, pre {
45 background: $c-grayNormal;
49 font-family: 'Merriweather', serif;
53 | -----------------------------------------------------------------------------
55 | -----------------------------------------------------------------------------
60 text-decoration: none;
61 @include transition();
69 | -----------------------------------------------------------------------------
71 | -----------------------------------------------------------------------------
81 @include translateX(0);
83 @include breakpoint(mobile) {
84 @include transition(300ms);
88 @include breakpoint(mobile) {
89 .wrapper[data-menu-visible="1"] .viewport {
90 @include translateX($sidebarWidth);
101 @include breakpoint(desktop) {
105 @include breakpoint(mobile) {
106 left: -$sidebarWidth;
112 max-width: $maxPageWidth;
114 @include breakpoint(desktop) {
115 margin-left: $sidebarWidth;
120 | -----------------------------------------------------------------------------
122 | -----------------------------------------------------------------------------
128 background-position: 50% 50%;
129 background-size: cover;
148 border: 2px solid $c-white;
149 @include border-radius(40px);
153 h1, h2, .sidebar-menu, .sidebar-links {
170 padding-bottom: 20px;
171 border-bottom: 1px solid $c-grayDark;
189 | -----------------------------------------------------------------------------
191 | -----------------------------------------------------------------------------
200 display: inline-block;
214 @include border-radius(20px);
218 @include breakpoint(desktop) {
224 | -----------------------------------------------------------------------------
226 | -----------------------------------------------------------------------------
235 | -----------------------------------------------------------------------------
237 | -----------------------------------------------------------------------------
240 background: $c-white;
241 border-left: 1px solid $c-grayDark;
243 @include breakpoint(mobile) {
247 @include breakpoint(desktop) {
249 border-right: 1px solid $c-grayDark;
253 | ---------------------------------------------------------------------------
255 | ---------------------------------------------------------------------------
259 padding-bottom: 20px;
260 border-bottom: 1px solid $c-grayDark;
268 @media (min-width: 1200px) {
272 @media (max-width: 640px) and (min-width: 600px) {
276 @media (max-width: 1199px) and (min-width: 880px) {
282 | ---------------------------------------------------------------------------
284 | ---------------------------------------------------------------------------
287 .post-header, .post-footer {
291 border-top: 1px solid $c-grayNormal;
292 border-bottom: 1px solid $c-grayNormal;
307 | ---------------------------------------------------------------------------
309 | ---------------------------------------------------------------------------
326 | ---------------------------------------------------------------------------
327 | Post content - markdown
328 | ---------------------------------------------------------------------------
335 | ---------------------------------------------------------------------------
336 | Post meta block - tags, share links, etc.
337 | ---------------------------------------------------------------------------
346 text-transform: lowercase;
379 | ---------------------------------------------------------------------------
381 | ---------------------------------------------------------------------------