hyper mac pro post

content/posts/2017-05-16-hyper-mac-pro/index.md

@@ -0,0 +1,44 @@
+---
+type: post
+date: 2017-05-16T19:50:52.281Z
+updated: 2018-10-30T19:50:52.281Z
+
+title: Hyper Mac Pro
+image: hyper-mac-pro-teaser.png
+
+tags:
+  - goodies
+  - css
+  - hyper
+  - macos
+  - terminal
+  - apple
+---
+
+Tab style for [Hyper](https://hyper.is/) inspired by Apple's pro apps on macOS, like Final Cut Pro or Logic.
+
+If you use Hyper along with those apps, this theme is for you. It is purely a tab style theme, it won't affect the rest of your chosen theme.
+
+## Installation
+
+Install by adding `hyper-mac-pro` to the plugins property in your `~/.hyper.js`:
+
+```js
+plugins: [
+  'hyper-mac-pro'
+]
+```
+
+If you're using `hpm`, from the command line:
+
+```bash
+hpm install hyper-mac-pro
+```
+
+## Check out & contribute
+
+Head over to GitHub to take a peek into the code or report some issues.
+
+<p class="content-download">
+    <a class="icon-github btn-primary" href="https://github.com/kremalicious/hyper-mac-pro">GitHub</a>
+</p>

src/components/Post/PostMore.module.scss

@@ -1,11 +1,13 @@
 @import 'variables';
 
 .postMore {
+    display: inline-block;
     font-family: $font-family-headings;
     font-weight: $font-weight-headings;
     font-size: $font-size-base * .9;
     color: $link-color;
     text-transform: uppercase;
+    margin-top: $spacer;
 
     svg {
         display: inline-block;

src/styles/_buttons.scss

@@ -6,7 +6,6 @@ a.btn {
     text-align: center;
     display: block;
     margin-bottom: 0;
-    vertical-align: middle;
     touch-action: manipulation;
     cursor: pointer;
     background-image: none; // Reset unusual Firefox-on-Android default style

src/templates/Post.jsx

@@ -121,6 +121,7 @@ export const pageQuery = graphql`
       siteMetadata {
         siteUrl
         author {
+          name
           uri
         }
       }