From 3cf0c3cd297b43c194d0d6820e13bcf8d8751fdc Mon Sep 17 00:00:00 2001
From: Nick Van Doorn <vandoorn.nick@gmail.com>
Date: Sat, 6 Apr 2019 14:13:32 -0700
Subject: Init commit

---
 src/demo-component.js | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 src/demo-component.js

(limited to 'src/demo-component.js')

diff --git a/src/demo-component.js b/src/demo-component.js
new file mode 100644
index 0000000..ca95e29
--- /dev/null
+++ b/src/demo-component.js
@@ -0,0 +1,36 @@
+// In production, it's worth configuring things
+// to handle the `css` prop at build time
+/** @jsx jsx */
+import { jsx } from '@emotion/core'
+import React from 'react'
+import { SunlightTheme } from './sunlight-theme'
+import { css } from '@emotion/core'
+import colormap from 'colormap'
+
+const containerStyle = ({ colours }) => css`
+  color: ${colours.main};
+`
+
+const mainRange = colormap({
+  colormap: 'autumn',
+  nshades: 11,
+  format: 'hex',
+  alpha: 1
+})
+
+const colourMiddleware = theme => {
+  return {
+    ...theme,
+    colours: {
+      main: mainRange[theme.lightLevel]
+    }
+  }
+}
+
+export const DemoComponent = ({ children }) => {
+  return (
+    <SunlightTheme middleware={[colourMiddleware]}>
+      <div css={containerStyle}>{children}</div>
+    </SunlightTheme>
+  )
+}
-- 
cgit v1.2.3