From 0bb0341698e0edef9fc73dbaa6ec79c956152e89 Mon Sep 17 00:00:00 2001
From: steven dale <sdale0@media.mit.edu>
Date: Wed, 10 May 2017 18:07:31 -0400
Subject: [PATCH] Full height/width modal for libraries

---
 src/components/library/library.jsx |  2 +-
 src/components/modal/modal.css     | 19 +++++++++++++++++++
 src/components/modal/modal.jsx     |  2 +-
 3 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/src/components/library/library.jsx b/src/components/library/library.jsx
index 16327c10c..8800025bd 100644
--- a/src/components/library/library.jsx
+++ b/src/components/library/library.jsx
@@ -33,7 +33,7 @@ class LibraryComponent extends React.Component {
                 visible={this.props.visible}
                 onRequestClose={this.props.onRequestClose}
             >
-                <h1 className={styles.modalHeader}>{this.props.title}</h1>
+                // <h1 className={styles.modalHeader}>{this.props.title}</h1>
                 <div className={styles.libraryScrollGrid}>
                     {this.props.data.map((dataItem, itemId) => {
                         const scratchURL = dataItem.md5 ?
diff --git a/src/components/modal/modal.css b/src/components/modal/modal.css
index 25a134f5e..044a914b3 100644
--- a/src/components/modal/modal.css
+++ b/src/components/modal/modal.css
@@ -40,3 +40,22 @@
     right: 1rem;
     z-index: 2;
 }
+
+.full-modal-content {
+    // same as .modal-children
+    position: absolute;
+    outline: none;
+    overflow-y: scroll;
+    -webkit-overflow-scrolling: 'touch';
+    border: 1px solid #ccc;
+    padding: 0;
+    user-select: none;
+
+    // different from .modal-children
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    border-radius: 0;
+
+}
diff --git a/src/components/modal/modal.jsx b/src/components/modal/modal.jsx
index 3a3fc25db..7d8582d1b 100644
--- a/src/components/modal/modal.jsx
+++ b/src/components/modal/modal.jsx
@@ -11,7 +11,7 @@ class ModalComponent extends React.Component {
     render () {
         return (
             <ReactModal
-                className={styles.modalContent}
+                className={styles.fullModalContent}
                 contentLabel={this.props.contentLabel}
                 isOpen={this.props.visible}
                 overlayClassName={styles.modalOverlay}