Moved

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "modules/react-material-design"]
+	path = modules/react-material-design
+	url = https://github.com/casesandberg/react-material-design

LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2015 case
+Copyright (c) 2015 Case Sandberg
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -19,4 +19,3 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
-

docs/components/common/Code.cjsx

@@ -0,0 +1,85 @@
+'use strict'
+
+React = require('react')
+ReactCSS = require('reactcss')
+Remarkable = require('remarkable')
+hljs = require('highlight.js')
+md = new Remarkable
+  highlight: (str) ->
+    try
+      return hljs.highlightAuto(str).value
+    catch err
+      console.log err
+_ = require('lodash')
+
+require('../../../node_modules/highlight.js/styles/kimbie.dark.css')
+
+
+
+
+{ Raised, Tabs, Tile } = require('react-material-design')
+
+
+
+module.exports = class Code extends ReactCSS.Component
+
+  @propTypes =
+    files: React.PropTypes.array
+
+  classes: ->
+    'default':
+      code:
+        background: '#fff'
+
+      head:
+        borderRadius: '2px 2px 0 0'
+        background: '#fafafa'
+
+      files:
+        display: 'inline-block'
+
+      Files:
+        align: 'none'
+        color: '#666'
+
+      center:
+        fontFamily: 'Monaco'
+        fontSize: '14px'
+        lineHeight: '19px'
+        color: 'rgba(0,0,0,.77)'
+
+      numbers:
+        fontSize: '14px'
+        lineHeight: '19px'
+        display: 'inline-block'
+        textAlign: 'right'
+        color: 'rgba(0,0,0,.20)'
+
+  render: ->
+    rendered = md.render("```\n#{ @props.files[0].js }```").trim()
+    lines = rendered.split('\n').length
+    <Raised is="code">
+      { if @props.files[0].fileName
+          <div is="head">
+            <div is="files">
+              <Tabs is="Files" tabs={[ @props.files[0].fileName ]} />
+            </div>
+          </div> }
+      <Tile>
+        <div is="numbers">
+          { for line in [1 ... lines]
+              <div key={ line } is="line">{ line }</div> }
+        </div>
+        <div is="center">
+          <style>{"
+            .rendered pre{
+              margin: 0;
+            }
+            .rendered p{
+              margin: 0;
+            }
+          "}</style>
+          <div className="rendered" dangerouslySetInnerHTML={ __html: _.unescape(rendered) } />
+        </div>
+      </Tile>
+    </Raised>

docs/components/common/Markdown.cjsx

@@ -0,0 +1,45 @@
+'use strict'
+
+React = require('react')
+ReactCSS = require('reactcss')
+Remarkable = require('remarkable')
+md = new Remarkable()
+
+Code = require('./Code')
+
+
+
+module.exports = class Markdown extends ReactCSS.Component
+
+  classes: ->
+    'default':
+      markdown: {}
+
+  render: ->
+    markdown = md.render(@props.children)
+    lines = markdown
+
+    codes = []
+    count = 0
+
+    reg = new RegExp(/<pre><code(.*)>([\s\S]*?)<\/code><\/pre>/g)
+
+    while match = reg.exec(markdown)
+      filename = undefined
+      if match[1]
+        filename = /file[nN]ame:(.+?)"/.exec(match[1])[1]
+
+      lines = lines.replace("<pre><code#{ match[1] }>#{ match[2].toString() }</code></pre>", "|Code:#{ count }|")
+      codes[count] = <Code files={[{ js: match[2], fileName: filename }]} />
+      count++
+
+    <div>
+      { for line, i in lines.split('\n')
+          if line.indexOf('|Code:') > -1
+            place = /\|Code:(.+?)\|/.exec(line)[1]
+
+            codes[place]
+          else
+            <div key={ i } is="markdown" dangerouslySetInnerHTML={ __html: line } /> }
+
+    </div>

docs/components/common/Test.cjsx

@@ -0,0 +1,17 @@
+'use strict'
+
+React = require('react')
+ReactCSS = require('reactcss')
+
+
+
+module.exports = class Test extends ReactCSS.Component
+
+  classes: ->
+    'default':
+      body:
+        background: '#aeee00'
+        color: '#333'
+
+  render: ->
+    <div is="body">Test!</div>

docs/components/docs/DocsBody.cjsx

@@ -0,0 +1,58 @@
+'use strict'
+
+React = require('react')
+ReactCSS = require('reactcss')
+
+Container = require('../layout/Container')
+Grid = require('../layout/Grid')
+Code = require('../common/Code')
+{ Tile } = require('react-material-design')
+Markdown = require('../common/Markdown')
+
+docs = require('../../docs')
+Remarkable = require('remarkable')
+md = new Remarkable()
+
+
+
+module.exports = class DocsBody extends ReactCSS.Component
+
+  classes: ->
+    'default':
+      docsBody: {}
+
+      sidebar:
+        width: '200px'
+
+      content:
+        width: '640px'
+        fontSize: '17px'
+        lineHeight: '24px'
+        color: 'rgba(0,0,0,.57)'
+
+      inner:
+        padding: '16px'
+
+  render: ->
+    <div is="docsBody">
+      <Container>
+        <Grid uneven>
+
+          <div is="sidebar">
+            { for fileName, file of docs
+                <Tile key={ fileName }>
+                  <div></div>
+
+                  <div>{ /title: (.+)/.exec(file)[1] }</div>
+                </Tile> }
+          </div>
+
+          <div is="content">
+            { for fileName, file of docs
+                <Markdown key={ fileName }>{ /---[\s\S]*?---([\s\S]*)/.exec(file)[1] }</Markdown> }
+          </div>
+
+        </Grid>
+
+      </Container>
+    </div>

docs/components/docs/DocsFeature.cjsx

@@ -0,0 +1,31 @@
+'use strict'
+
+React = require('react')
+ReactCSS = require('reactcss')
+
+Container = require('../layout/Container')
+
+
+
+module.exports = class DocsFeature extends ReactCSS.Component
+
+  classes: ->
+    'default':
+      docsFeature:
+        background: '#49535B'
+        height: '100%'
+
+      title:
+        paddingTop: '120px'
+        fontSize: '34px'
+        color: 'rgba(255, 255, 255, .87)'
+        WebkitFontSmoothing: 'antialiased'
+
+  render: ->
+    <div is="docsFeature">
+      <Container>
+
+        <div is="title">Documentation</div>
+
+      </Container>
+    </div>