Adding media and modal

src/containers/App/index.js

@@ -4,7 +4,6 @@ import { metrics } from 'react-metrics';
 import { connect } from 'react-redux';
 import { asyncConnect } from 'redux-connect';
 import Helmet from 'react-helmet';
-
 import Modal from 'react-bootstrap/lib/Modal';
 const ModalHeader = Modal.Header;
 const ModalTitle = Modal.Title;
@@ -41,23 +40,25 @@ class App extends Component {
         <Helmet {...config.app.head} />
         <FontStyles />
         {React.cloneElement(children, {footer: <Footer />})}
+
         <Modal bsSize="large" show={!!media.content} onHide={removeMedia}>
           <ModalHeader closeButton>
             <ModalTitle className="montserrat">
               {media.content && media.content.resource.name}
             </ModalTitle>
           </ModalHeader>
           <ModalBody>
-            {
-              media.content &&
-                <iframe
-                  width="100%"
-                  height="515"
-                  src={media.content.url}
-                  frameBorder="0"
-                  allowFullScreen
-                />
-            }
+            <div className="embed-responsive embed-responsive-16by9">
+              {
+                media.content &&
+                  <iframe
+                    className="embed-responsive-item"
+                    src={media.content.url}
+                    frameBorder="0"
+                    allowFullScreen
+                  />
+              }
+            </div>
           </ModalBody>
         </Modal>
       </div>