var_styles.js

// Small example to demonstrate updating / manipulate the CSS styles using JS.
class MyZoomableContainer extends React.CSSComponent {
  constructor() {
    this.state = { fontSize: 14 };
  }

  // Increase or decrease the font size. The changes will get applied later
  // when the component will rerender.
  decrFontSize() { this.setState({fontSize: this.state.fontSize - 1 }); }
  incrFontSize() { this.setState({fontSize: this.state.fontSize + 1 }); }

  render() {
    // The variable `this.state.fontSize` is used to determine the font size
    // of the container element.
    var styleMap = this.mountStyles`
      .container {
        font-size: ${this.state.fontSize}
      }`;
    return (
      <div className={styleMap.container}>
        {this.props.content}
        <button onclick={this.decrFontSize()}>Zoom Out</button>
        <button onclick={this.incrFontSize()}>Zoom In</button>
      </div>);
  }
}