From f38437cd02824b0a03d9e01e802c19276f371676 Mon Sep 17 00:00:00 2001
From: Cihan Bebek <cihan.bebek@checkout.fi>
Date: Wed, 5 Jul 2017 12:35:34 +0300
Subject: [PATCH] add members header for yhdistys-page

---
 src/js/components/members.js |  2 +-
 src/js/main.js               |  4 ++++
 src/styles/_header.styl      | 18 ++++++++++++++++++
 src/styles/style.styl        |  4 ++--
 src/yhdistys.jade            |  4 +++-
 5 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/src/js/components/members.js b/src/js/components/members.js
index e0e4013..a907016 100644
--- a/src/js/components/members.js
+++ b/src/js/components/members.js
@@ -7,7 +7,7 @@ var _ = require('lodash');
 var api = require('../api');
 
 module.exports = React.createClass({
-  getInitialState() {
+  getInitialState() {
     return {
       members: []
     };
diff --git a/src/js/main.js b/src/js/main.js
index 0ab8ce9..6a1b0df 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -45,4 +45,8 @@ if(pathName == '/') {
   ReactDOM.render(
     email(),
     document.getElementById('email'));
+
+  ReactDOM.render(
+    members(),
+    document.getElementById('members'));
 }
diff --git a/src/styles/_header.styl b/src/styles/_header.styl
index c48cb96..62ff2af 100644
--- a/src/styles/_header.styl
+++ b/src/styles/_header.styl
@@ -94,3 +94,21 @@
   @media (min-aspect-ratio: 1/2)
     width 100%
     height auto
+
+.header__members
+  z-index -1
+  position absolute
+  top 0
+  left 0
+  height 100%
+  .member
+    margin 0
+    border-radius 0
+    width (100/18)%
+
+    @media screen and (max-width: 1200px)
+      width (100/15)%
+    @media screen and (max-width: 810px)
+      width 10%
+    @media screen and (min-width: 2000px)
+      width 5%
diff --git a/src/styles/style.styl b/src/styles/style.styl
index 1e6c2ef..e74224c 100644
--- a/src/styles/style.styl
+++ b/src/styles/style.styl
@@ -345,7 +345,7 @@ footer
     .column
       display block
 
-.neukkari-img-wrapper
+.bread-img
   background url('../images/hp3_bw.jpg')
   background-size 120%
   background-position-y 80%
@@ -355,5 +355,5 @@ footer
   height 240px
 
 @media screen and (max-width: 700px)
-  .neukkari-img-wrapper
+  .bread-img
     display none
\ No newline at end of file
diff --git a/src/yhdistys.jade b/src/yhdistys.jade
index 4407eb5..eed97a4 100644
--- a/src/yhdistys.jade
+++ b/src/yhdistys.jade
@@ -48,6 +48,8 @@ html
             .header__headline
               .header__logo
               h1.header__title Koodiklinikka ry
+          .header__members
+            #members
 
         .content
           section
@@ -62,7 +64,7 @@ html
                   p.
                     Yhdistyksen jäsenyys ei ole pakollinen Koodiklinikan käyttäjille tai meetuppeihin osallistujille.
                 .column.column1-2
-                  .neukkari-img-wrapper
+                  .bread-img
             .row
               .bread
                 .column.column1-2