From 880f7a3f651ec211f8a5ac5944b14de1760d0ca2 Mon Sep 17 00:00:00 2001
From: Edin Dazdarevic <edin.dazdarevic@gmail.com>
Date: Sat, 15 Apr 2017 03:01:55 +0200
Subject: [PATCH] Modal not working on iOS

---
 web/dist/main.css                    | 13 +++++++++++++
 web/src/components/ContactModal.js   |  1 -
 web/src/components/Gallery.js        |  2 +-
 web/src/components/ListingDetails.js |  4 ----
 web/src/components/Main.js           |  7 +++++++
 5 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/web/dist/main.css b/web/dist/main.css
index d6d86a9..c0a6b7c 100644
--- a/web/dist/main.css
+++ b/web/dist/main.css
@@ -956,6 +956,10 @@ h5 {
   margin-bottom: 15px;
 }
 
+.contact-form-message textarea {
+  height: 300px;
+}
+
 .contact-form-footer {
   text-align: center;
   padding-top: 20px;
@@ -1013,6 +1017,15 @@ h5 {
   .contact-form-alert {
     text-align: center;
   }
+
+  .contact-form-message textarea {
+    height: 150px;
+  }
+  .image-dot {
+    width: 7px;
+    height: 7px;
+    margin: 0 3px;
+  }
 }
 
 .noselect {
diff --git a/web/src/components/ContactModal.js b/web/src/components/ContactModal.js
index 6bffbdd..713ed6e 100644
--- a/web/src/components/ContactModal.js
+++ b/web/src/components/ContactModal.js
@@ -119,7 +119,6 @@ export default class ContactModal extends React.Component {
               <textarea
                 onChange={this.onFieldChange.bind(this, 'message')}
                 value={message}
-                rows="14"
               />
             </div>
             <div className="contact-form-alert noselect">
diff --git a/web/src/components/Gallery.js b/web/src/components/Gallery.js
index 3cfe00d..4984191 100644
--- a/web/src/components/Gallery.js
+++ b/web/src/components/Gallery.js
@@ -74,7 +74,7 @@ export default class Gallery extends React.Component {
 
             return (
               <div
-                key={img}
+                key={index}
                 onClick={this.onImageDotClick.bind(this, index)}
                 className={cls}
               />
diff --git a/web/src/components/ListingDetails.js b/web/src/components/ListingDetails.js
index ff7d7b0..3a3d13d 100644
--- a/web/src/components/ListingDetails.js
+++ b/web/src/components/ListingDetails.js
@@ -110,10 +110,6 @@ export default class ListingDetails extends React.Component {
           <div className="ld-footer" />
         </div>
 
-        {contactFormOpen ? <ContactModal
-          listingId={this.props.listing._id}
-          contact={this.props.contact}
-          dispatch={this.props.dispatch} /> : null}
       </div>
     )
   }
diff --git a/web/src/components/Main.js b/web/src/components/Main.js
index 55abdfd..64e1cde 100644
--- a/web/src/components/Main.js
+++ b/web/src/components/Main.js
@@ -2,6 +2,7 @@ import React from 'react'
 import Filters from './Filters'
 import Listings from './Listings'
 import ListingDetails from './ListingDetails'
+import ContactModal from './ContactModal'
 import {pacSelectFirst} from '../helpers/googleMaps'
 import {loadProperties, loadSeen, loadListing} from '../lib/api'
 import {handleMessage} from '../lib/handlers'
@@ -582,8 +583,14 @@ class Main extends React.Component {
       rightClass = 'right-shown'
     }
 
+    const {contactFormOpen} = this.state
+
     return (
       <div id="container">
+        {contactFormOpen ? <ContactModal
+          listingId={this.state.listing._id}
+          contact={this.state.contact}
+          dispatch={this.dispatch.bind(this)} /> : null}
         <div id="header">
           <a className="hamburger-menu">K</a>
           <span className="title">KIVI</span>