Example of component with theming

I'm not sure if this is the correct/best way to do this but at least for
this simple example it works fine.

src/components/MyTable/MyTable.js

@@ -0,0 +1,31 @@
+import React from 'react'
+import theme from './MyTable.scss'
+
+const MyTable = () => (
+  <table className={theme.table}>
+    <tbody>
+      <tr>
+        <td>1</td>
+        <td>2</td>
+      </tr>
+      <tr>
+        <td>3</td>
+        <td>4</td>
+      </tr>
+      <tr>
+        <td>5</td>
+        <td>6</td>
+      </tr>
+      <tr>
+        <td>7</td>
+        <td>8</td>
+      </tr>
+      <tr>
+        <td>9</td>
+        <td>10</td>
+      </tr>
+    </tbody>
+  </table>
+)
+
+export default MyTable

src/components/MyTable/MyTable.scss

@@ -0,0 +1,19 @@
+.table {
+
+  td {
+    width: 50px;
+    padding: 10px;
+    text-align: center;
+  }
+
+  tr:nth-child(odd) {
+    td {
+      background-color: lawngreen;
+    }
+  }
+  tr:nth-child(even) {
+    td {
+      background-color: deeppink;
+    }
+  }
+}

src/components/MyTable/index.js

@@ -0,0 +1,3 @@
+import MyTable from './MyTable'
+
+export default MyTable

src/routes/Home/components/HomeView.js

@@ -3,6 +3,8 @@ import DuckImage from '../assets/Duck.jpg'
 import './HomeView.scss'
 import { Button, Chip } from 'react-toolbox'
 
+import MyTable from '../../../components/MyTable'
+
 export const HomeView = () => (
   <div>
     <h4>Welcome!</h4>
@@ -17,6 +19,8 @@ export const HomeView = () => (
     />
     <br/>
     <Chip>Test chip</Chip>
+    <br/>
+    <MyTable/>
   </div>
 )