natew

<div>
        <Title>Buttons</Title>

        <Container>
          <Button active>Active</Button>
          <Button>Button</Button>
          <Button rounded>Round</Button>
        </Container>

        <Title>ButtonGroup</Title>

natew

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="562px"
	 height="649px" viewBox="0 0 562 649" enable-background="new 0 0 562 649" xml:space="preserve">
<g id="Polygon_2_1_" enable-background="new    ">
	<g id="Polygon_2">
		<g>
			<polygon fill="#A2BDE9" points="281.071,1 0.654,162.899 0.654,486.697 281.071,648.597 561.489,486.697 561.489,162.899 			"/>
		</g>

natew

// this is a webpack config that takes a number of options
// to let you build different style bundles
// based on the webpack react example

var fs = require('fs');
var path = require('path');
var webpack = require('webpack');
var ReactStylePlugin = require('react-style-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var joinEntry = require('./lib/joinEntry');

natew

<li class="ListItem" style="list-style:none;margin:0;padding:0;overflow:hidden;flex-flow:row;align-items:center;justify-content:space-between;min-height:44px;border-top:1px solid #c8c7cc;position:relative;padding-right:20px;" data-reactid=".0.1.1:1.2:$=10:$0.1.0.2.1:$=12:$2">
<span class="ListItem--wrapper" style="position:absolute;top:0;left:-10px;right:0;bottom:0;max-width:none;flex-flow:row;justify-content:flex-end;z-index:1;" data-reactid=".0.1.1:1.2:$=10:$0.1.0.2.1:$=12:$2.$27">
<a href="/kitchen/modals" style="position:absolute;top:0;left:-10px;right:0;bottom:0;max-width:none;flex-flow:row;justify-content:flex-end;z-index:1;" data-reactid=".0.1.1:1.2:$=10:$0.1.0.2.1:$=12:$2.$27.0">
<span style="color:#c8c7cc;width:12px;height:12px;overflow:hidden;margin:auto 8px auto 0;" class="Icon" data-reactid=".0.1.1:1.2:$=10:$0.1.0.2.1:$=12:$2.$27.0.0"><svg style="width:12px;height:12px;shape-rendering:initial;fill:currentColor;" viewBox="0 0 64 64" fill="#c8c7cc" stroke="#c8c7cc" stroke-width="8" stroke-linecap="r

natew

module.exports = Component('Icon', {
  mixins: [TweenState.Mixin],

  getInitialState() {
    return { step: 0 };
  },

  componentWillReceiveProps(nextProps) {
    if (nextProps.animation === 'ROTATE')

natew

      <ViewList initialStep={numRoutes - 2} noFakeTitleBar>
        <View>
          <DottedViewList touchStartBoundsX={{ from: 20, to: window.innerWidth - 20 }}>
            <View title="Hot Articles">
              <List dontWrapChildren styles={{ self: { borderTop: 'none' } }}>
                {articles.count() ?
                  articles.map((article, i) =>
                    <ArticleItem cursor={article} key={i} />
                  ).toArray()
                  .concat(

natew

Building a UI interface that is composed of Views.

One common interface is a split view. Similar to Mail on iPad, it contains a
side view and a main view.

1.html is my current solution, but thinking of doing 3.html.

Problem with current solution is how would Main manipulate props on Side
(necessary for parallax effect when dragging out of Main).

natew

var Component = React.createClass({
  render() {
    return (
      <Layout>
        <View title="Deeply Nested">
          <div className="content">Example of a deeply nested thing</div>

          <View title="Deeply">
            <div className="content">This is the first nested drawer</div>

natew

var data = Immutable.fromJS({
  items: [{
    name: "one",
    kids: [{
      name: "one-one",
      kids: [] //...
    }]
  }]
});

natew

javascript:jQuery('body').css({overflow:'hidden'});var urls = ["http://38.media.tumblr.com/tumblr_lwz84jsixv1r5qrimo1_500.gif", "http://38.media.tumblr.com/tumblr_m4r4mipGqq1qeumowo1_500.gif", "http://jdandrea.myweb.usf.edu/calabi-spin.gif", "http://media.giphy.com/media/dfq3YU04eBMt2/giphy.gif", "https://31.media.tumblr.com/8cfb9987f141d63d7e6ed31757cef30c/tumblr_n8hfelQaKB1tg7xcdo1_500.gif"];var i = 0;urls.forEach(function(url) {  i += 1; console.log(i); (function(ix) { setTimeout(function() { jQuery('<img src='+url+'>').css({ position: 'absolute', zIndex: ix, top: Math.random()*400, right: Math.random()*300, width: '25%', height: 'auto', opacity: 0.8 }).appendTo('body')  }, ix * 1000) })(i);});