moq-ui/src/app-canvas.jsx

Simple, customizable UI components built with React

var React = require('react');
var StylePropable = require('./mixins/style-propable');

var AppCanvas = React.createClass({

  mixins: [StylePropable],

  contextTypes: {
    uiTheme: React.PropTypes.object
  },
  
  render: function() {

    var styles = {
      backgroundColor: this.context.uiTheme.palette.canvasColor,
      color: this.context.uiTheme.palette.textColor,
      fontFamily: this.context.uiTheme.fontFamily,
      WebkitFontSmoothing: 'antialiased'
    };

    if (this.props.fitScreen === true) {
      styles = this.mergeStyles(styles, {
        position: 'absolute',
        top: 0,
        left: 0,
        right: 0,
        bottom: 0
      });
    }

    return (
      <div {...this.props} style={styles}>
        {this.props.children}
      </div>
    );
  }

});

module.exports = AppCanvas;