From 9acca5fe988a402fec1776b7087b0d9b745401f0 Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Wed, 19 Sep 2018 19:50:41 +0200
Subject: [PATCH] fixes

---
 src/components/Layout.jsx                     |  2 +-
 src/components/molecules/LogoUnit.jsx         |  8 ++++----
 src/components/molecules/LogoUnit.module.scss |  6 +++++-
 src/components/molecules/Networks.jsx         | 10 +++++-----
 src/components/molecules/Networks.module.scss |  4 ++--
 src/components/organisms/Header.jsx           | 19 +++++++++----------
 6 files changed, 26 insertions(+), 23 deletions(-)

diff --git a/src/components/Layout.jsx b/src/components/Layout.jsx
index 34f2232..cef4a68 100644
--- a/src/components/Layout.jsx
+++ b/src/components/Layout.jsx
@@ -30,7 +30,7 @@ export default class Layout extends PureComponent {
             delay={timeout}
             delayChildren={timeout}
           >
-            <Header isHomepage={isHomepage} />
+            <Header minimal={!isHomepage} />
             <main className={styles.screen}>{children}</main>
           </RoutesContainer>
         </PoseGroup>
diff --git a/src/components/molecules/LogoUnit.jsx b/src/components/molecules/LogoUnit.jsx
index 7816d64..412c3fd 100644
--- a/src/components/molecules/LogoUnit.jsx
+++ b/src/components/molecules/LogoUnit.jsx
@@ -19,7 +19,7 @@ const query = graphql`
 const Animation = posed.div(moveInBottom)
 
 export default class LogoUnit extends PureComponent {
-  state = { minimal: false }
+  state = { isMinimal: false }
 
   static propTypes = {
     minimal: PropTypes.bool
@@ -28,7 +28,7 @@ export default class LogoUnit extends PureComponent {
   checkMinimal = () => {
     const { minimal } = this.props
 
-    this.setState({ minimal: minimal })
+    this.setState({ isMinimal: minimal })
   }
 
   componentDidMount() {
@@ -45,11 +45,11 @@ export default class LogoUnit extends PureComponent {
         query={query}
         render={data => {
           const { title, tagline } = data.dataYaml
-          const { minimal } = this.state
+          const { isMinimal } = this.state
 
           return (
             <Animation>
-              <div className={minimal ? styles.minimal : styles.logounit}>
+              <div className={isMinimal ? styles.minimal : styles.logounit}>
                 <Logo className={styles.logounit__logo} />
                 <h1 className={styles.logounit__title}>
                   {title.toLowerCase()}
diff --git a/src/components/molecules/LogoUnit.module.scss b/src/components/molecules/LogoUnit.module.scss
index 3b3248c..275e144 100644
--- a/src/components/molecules/LogoUnit.module.scss
+++ b/src/components/molecules/LogoUnit.module.scss
@@ -54,7 +54,11 @@
     // stylelint-disable no-descending-specificity
     .logounit__title,
     .logounit__description {
-        color: $text-color-light--dark;
+        color: $text-color-light;
+
+        :global(.dark) & {
+            color: $text-color-light--dark;
+        }
     }
     // stylelint-enable no-descending-specificity
 
diff --git a/src/components/molecules/Networks.jsx b/src/components/molecules/Networks.jsx
index 1dda022..d37473a 100644
--- a/src/components/molecules/Networks.jsx
+++ b/src/components/molecules/Networks.jsx
@@ -46,16 +46,16 @@ const NetworkIcon = props => {
 
 const Animation = posed.aside(moveInTop)
 
-export default class Network extends PureComponent {
+export default class Networks extends PureComponent {
+  state = {
+    classes: styles.networks
+  }
+
   static propTypes = {
     minimal: PropTypes.bool,
     hide: PropTypes.bool
   }
 
-  state = {
-    classes: styles.networks
-  }
-
   componentDidMount() {
     this.toggleClasses()
   }
diff --git a/src/components/molecules/Networks.module.scss b/src/components/molecules/Networks.module.scss
index 904be82..412a10f 100644
--- a/src/components/molecules/Networks.module.scss
+++ b/src/components/molecules/Networks.module.scss
@@ -57,8 +57,8 @@
 
     /* stylelint-disable no-descending-specificity */
     svg {
-        width: .85rem;
-        height: .85rem;
+        width: .75rem;
+        height: .75rem;
         opacity: .8;
     }
 }
diff --git a/src/components/organisms/Header.jsx b/src/components/organisms/Header.jsx
index f62a453..dbf8158 100644
--- a/src/components/organisms/Header.jsx
+++ b/src/components/organisms/Header.jsx
@@ -18,12 +18,12 @@ const query = graphql`
 `
 
 export default class Header extends PureComponent {
-  state = { minimal: false }
+  state = { isMinimal: this.props.minimal }
 
   checkMinimal = () => {
-    const { isHomepage } = this.props
+    const { minimal } = this.props
 
-    this.setState({ minimal: !isHomepage })
+    this.setState({ isMinimal: minimal })
   }
 
   componentDidMount() {
@@ -35,8 +35,7 @@ export default class Header extends PureComponent {
   }
 
   render() {
-    const { isHomepage } = this.props
-    const { minimal } = this.state
+    const { isMinimal } = this.state
 
     return (
       <StaticQuery
@@ -45,16 +44,16 @@ export default class Header extends PureComponent {
           const meta = data.dataYaml
 
           return (
-            <header className={minimal ? styles.minimal : styles.header}>
+            <header className={isMinimal ? styles.minimal : styles.header}>
               <ThemeSwitch />
 
               <Link className={styles.header__link} to={'/'}>
-                <LogoUnit minimal={!isHomepage} />
+                <LogoUnit minimal={isMinimal} />
               </Link>
 
-              <Networks hide={!isHomepage} />
+              <Networks hide={isMinimal} />
 
-              <Availability hide={!isHomepage && !meta.availability.status} />
+              <Availability hide={isMinimal && !meta.availability.status} />
             </header>
           )
         }}
@@ -64,5 +63,5 @@ export default class Header extends PureComponent {
 }
 
 Header.propTypes = {
-  isHomepage: PropTypes.bool
+  minimal: PropTypes.bool
 }