Refactor modal components

1. Split out base modal stylings from iframe modal stylings
2. Move iframe-specific stylings into a separate copmonent
3. Move width/height iframe stylings to scss
4. Change global stylings for modals to match #980
5. Update styles to use trello style guide

src/components/modal/iframe/modal.jsx

@@ -0,0 +1,47 @@
+var classNames = require('classnames');
+var React = require('react');
+
+var Modal = require('../base/modal.jsx');
+
+require('./modal.scss');
+
+Modal.setAppElement(document.getElementById('view'));
+
+var IframeModal = React.createClass({
+    propTypes: {
+        componentKey: React.PropTypes.string,
+        isOpen: React.PropTypes.bool,
+        onRequestClose: React.PropTypes.func,
+        className: React.PropTypes.string,
+        componentRef: React.PropTypes.string,
+        src: React.PropTypes.string
+    },
+    getDefaultProps: function () {
+        return {
+            className: '',
+            iframeClassName: ''
+        };
+    },
+    render: function () {
+        var iframeClasses = classNames(
+            'modal-content-iframe',
+            this.props.className
+        );
+        return (
+            <Modal
+                key={this.props.componentKey}
+                isOpen={this.props.isOpen}
+                onRequestClose={this.props.onRequestClose}
+                className={this.props.className}
+            >
+                <iframe
+                    ref={this.props.componentRef}
+                    src={this.props.src}
+                    className={iframeClasses}
+                />
+            </Modal>
+        );
+    }
+});
+
+module.exports = IframeModal;

src/components/modal/iframe/modal.scss

@@ -0,0 +1,5 @@
+@import "../../../frameless";
+
+.modal-content-iframe {
+    border: 0;
+}