diff --git a/_layouts/post.html b/_layouts/post.html index 9c22c91..7515d25 100755 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -22,6 +22,9 @@ layout: default {% if forloop.last != true %}|{% endif %} {% endfor %} {% endif %} + {% if page.pdf %}
+ Print version + {% endif %} {{page.content | markdownify}} diff --git a/_posts/2017-09-03-overclassification.md b/_posts/2017-09-03-overclassification.md index 5d4354c..f712065 100644 --- a/_posts/2017-09-03-overclassification.md +++ b/_posts/2017-09-03-overclassification.md @@ -9,7 +9,7 @@ counts: words: 13794 description: A chronically neat otter's life is thrown into disarray when she takes a homeless ringtail in from the cold. -img: null +img: overclassification.jpg layout: post tags: - Sawtooth diff --git a/assets/css/sass/_media.scss b/assets/css/sass/_media.scss index d63750f..91b18d5 100644 --- a/assets/css/sass/_media.scss +++ b/assets/css/sass/_media.scss @@ -1,156 +1,169 @@ /* Small Devices, Tablets */ @media only screen and (max-width: 768px) { - .main-header { - .logo { - a { - font-size: 24px; - } + .main-header { + .logo { + a { + font-size: 24px; + } + } } - } - .post-card-box { - li { - width: 100%; - margin-bottom: 20px; - &:last-child { - margin-bottom: 0; - } + .post-card-box { + li { + width: 100%; + margin-bottom: 20px; + &:last-child { + margin-bottom: 0; + } + } } - } -.recent-box { - .recent-list { - .recent-item { - position: relative; - display: inline-block; - width: 49%; - height: 150px; - margin-left: 0.5%; - margin-bottom: 0.5%; - span { - position: absolute; - font-size: 12px; - left: 2.5%; - bottom: 10%; - color: $white; - } + .recent-box { + .recent-list { + .recent-item { + position: relative; + display: inline-block; + width: 49%; + height: 150px; + margin-left: 0.5%; + margin-bottom: 0.5%; + span { + position: absolute; + font-size: 12px; + left: 2.5%; + bottom: 10%; + color: $white; + } + } + } } - } -} } @media only screen and (max-width: 480px) { - .wrapper { - max-width: 95%; - } - - .page-content { - margin-top: -50px; - padding: 15px; - } - - .header-page { - margin-bottom: 20px; - h1 { - font-size: 27px; - margin: 0 0 10px; + .wrapper { + max-width: 95%; } - .page-date { - font-size: 14px; + + .page-content { + margin-top: -50px; + padding: 15px; } - } - .main-header { - .logo { - a { - font-size: 21px; - } - } - } - .menu-icon, - .menu-icon-close, - .search-icon, - .search-icon-close { - font-size: 16px; - } - -.page-image { - height: 380px; -} - -.recent-box { - .recent-list { - .recent-item { - position: relative; - display: inline-block; - width: 99%; - height: 150px; - margin-left: 0.5%; - margin-bottom: 0.5%; - span { - position: absolute; - font-size: 12px; - left: 2.5%; - bottom: 10%; - color: $white; - } - } - } -} - -.newsletter { - .newsletter-box { - .subscribe-btn { - width: 80px; - height: 40px; - font-size: 12px; - } - } -} - -.about-body { - .contact-list { - li { - display: inline-block; - margin-left: 5px; - &:first-child { - margin-left: 0; - } - a { - display: block; - color: $light-gray; - font-size: 16px; - text-decoration: none; - padding: 5px; - transition: all 350ms cubic-bezier(0.13, 0.43, 0.54, 1.82); - &:hover { - color: $dark-pink; - transform: scale(1.3); + .header-page { + margin-bottom: 20px; + h1 { + font-size: 27px; + margin: 0 0 10px; + } + .page-date { + font-size: 14px; + } + } + + .main-header { + .logo { + a { + font-size: 21px; + } + } + } + .menu-icon, + .menu-icon-close, + .search-icon, + .search-icon-close { + font-size: 16px; + } + + .page-image { + height: 380px; + } + + .recent-box { + .recent-list { + .recent-item { + position: relative; + display: inline-block; + width: 99%; + height: 150px; + margin-left: 0.5%; + margin-bottom: 0.5%; + span { + position: absolute; + font-size: 12px; + left: 2.5%; + bottom: 10%; + color: $white; + } + } + } + } + + .newsletter { + .newsletter-box { + .subscribe-btn { + width: 80px; + height: 40px; + font-size: 12px; + } + } + } + + .about-body { + .contact-list { + li { + display: inline-block; + margin-left: 5px; + &:first-child { + margin-left: 0; + } + a { + display: block; + color: $light-gray; + font-size: 16px; + text-decoration: none; + padding: 5px; + transition: all 350ms cubic-bezier(0.13, 0.43, 0.54, 1.82); + &:hover { + color: $dark-pink; + transform: scale(1.3); + } + } + } + } + } + + .author-box { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + .author-img { + height: 100px; + width: 100px; + margin: 0 0 10px; + } + .author-desc { + h2 { + margin: 0 0 10px; + } + p { + margin: 0 0 15px; + } } - } } - } } -.author-box { - display: flex; - flex-direction: column; - align-items: center; - text-align: center; - .author-img { - height: 100px; - width: 100px; - margin: 0 0 10px; - } - .author-desc { - h2 { - margin: 0 0 10px; +@media print { + .main-nav { + display: none; } - p { - margin: 0 0 15px; - } - } -} + html, body { + height: auto; + } + + .page-content { + box-shadow: none; + } } diff --git a/assets/css/sass/parts/post-page.scss b/assets/css/sass/parts/post-page.scss index 811397e..d4991d7 100644 --- a/assets/css/sass/parts/post-page.scss +++ b/assets/css/sass/parts/post-page.scss @@ -29,7 +29,7 @@ color: $white; } - &.with-image { + .with-image & { margin-top: -80px; border-top-left-radius: 20px; border-top-right-radius: 20px; @@ -37,9 +37,10 @@ & > p { margin: 0; - &:not(first-of-type) { - text-indent: 2em; - } + text-indent: 2em; + } + p:first-of-type, hr + p { + text-indent: 0em; } } @@ -63,6 +64,10 @@ font-size: 14px; text-transform: uppercase; font-weight: 300; + + .pdf { + text-decoration: none; + } } } diff --git a/assets/img/overclassification.jpg b/assets/img/overclassification.jpg new file mode 100644 index 0000000..7f280f9 Binary files /dev/null and b/assets/img/overclassification.jpg differ