1
0
mirror of https://github.com/yldio/copilot.git synced 2024-11-11 05:40:11 +02:00
copilot/ui/src/components/column
2016-10-25 02:15:43 +01:00
..
index.js ui grid system - grid, row and column 2016-10-24 21:58:09 +01:00
readme.md base styles based on bootstrap and normalize 2016-10-25 02:15:43 +01:00
style.css ui grid system - grid, row and column 2016-10-24 21:58:09 +01:00

<Column>

demo

const React = require('react');
const ReactDOM = require('react-dom/server');
const Base = require('../base');
const Container = require('../container');
const Row = require('../row');
const Column = require('./index');

const styles = {
  container: {
    backgroundColor: '#FFEBEE'
  },
  row: {
    backgroundColor: '#EF5350'
  },
  column: {
    backgroundColor: '#B71C1C',
    textAlign: 'center',
    color: 'white'
  }
};

nmodule.exports = ReactDOM.renderToString(
  <Container style={styles.container}>
    <Row style={styles.row} around>
      <Column style={styles.column} xs={2}>1</Column>
      <Column style={styles.column} xs={2}>2</Column>
      <Column style={styles.column} xs={2}>3</Column>
    </Row>
  </Container>
);

usage

const React = require('react');
const Container = require('ui/container');
const Row = require('ui/row');
const Column = require('ui/index');

module.exports = () => {
  return (
    <Container>
      <Row around>
        <Column xs={2}>1</Column>
        <Column xs={2}>2</Column>
        <Column xs={2}>3</Column>
      </Row>
    </Container>
  );
};