Contact modal for mobile fixes
This commit is contained in:
Edin Dazdarevic
4
web/dist/index.html
vendored
4
web/dist/index.html
vendored
@@ -3,7 +3,9 @@
|
||||
<head>
|
||||
<title>KIVI - Najbolji način da pronađeš svoj dom</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<!--<meta name="viewport" content="width=device-width, initial-scale=1">-->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>
|
||||
|
||||
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
|
||||
|
||||
<link href="https://fonts.googleapis.com/css?family=Arimo" rel="stylesheet">
|
||||
|
||||
89
web/dist/main.css
vendored
89
web/dist/main.css
vendored
@@ -73,7 +73,11 @@ html {
|
||||
}
|
||||
|
||||
.right-content {
|
||||
overflow-y: auto;
|
||||
/*overflow-y: auto;*/
|
||||
|
||||
overflow-y: scroll; /* has to be scroll, not auto */
|
||||
|
||||
-webkit-overflow-scrolling: touch;
|
||||
height: 100%;
|
||||
padding: 10px 10px 0;
|
||||
}
|
||||
@@ -527,7 +531,7 @@ html {
|
||||
}
|
||||
|
||||
.where-to:focus {
|
||||
/*width: 85%;*/
|
||||
width: 85%;
|
||||
}
|
||||
|
||||
.view-types {
|
||||
@@ -583,7 +587,11 @@ html {
|
||||
.map-list-view {
|
||||
width: 100%;
|
||||
border: 1px solid red;
|
||||
overflow-y: auto;
|
||||
/*overflow-y: auto;*/
|
||||
overflow-y: scroll; /* has to be scroll, not auto */
|
||||
|
||||
-webkit-overflow-scrolling: touch;
|
||||
|
||||
height: 100%;
|
||||
padding-top: 60px;
|
||||
}
|
||||
@@ -591,6 +599,7 @@ html {
|
||||
.right-content .listings {
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -671,12 +680,13 @@ html {
|
||||
}
|
||||
|
||||
.ld-image-container {
|
||||
height: 375px;
|
||||
max-height: 335px;
|
||||
width: 500px;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
}
|
||||
|
||||
.ld-image-container .prev-button {
|
||||
@@ -685,6 +695,7 @@ html {
|
||||
left: 0px;
|
||||
height: 100%;
|
||||
width: 50%;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.ld-image-container .next-button {
|
||||
@@ -693,6 +704,7 @@ html {
|
||||
right: 0px;
|
||||
height: 100%;
|
||||
width: 50%;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.ld-image-container .prev-button div,
|
||||
@@ -709,7 +721,7 @@ html {
|
||||
.ld-image-container img {
|
||||
/*width: 100%;*/
|
||||
/*height: 100%;*/
|
||||
max-height: 375px;
|
||||
max-height: 335px;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
@@ -865,6 +877,18 @@ h5 {
|
||||
|
||||
|
||||
|
||||
|
||||
@media (min-width : 768px) {
|
||||
.modal > div {
|
||||
width: 460px;
|
||||
position: relative;
|
||||
margin: 5% auto;
|
||||
padding: 5px 20px 13px 20px;
|
||||
border-radius: 10px;
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.modal {
|
||||
position: fixed;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
@@ -881,15 +905,6 @@ h5 {
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.modal > div {
|
||||
width: 460px;
|
||||
position: relative;
|
||||
margin: 5% auto;
|
||||
padding: 5px 20px 13px 20px;
|
||||
border-radius: 10px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.modal h3 {
|
||||
color: #575a60;
|
||||
font-size: 18px;
|
||||
@@ -955,11 +970,53 @@ h5 {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.contact-form-alert {
|
||||
font-size: 0.9em;
|
||||
@media (max-width: 768px) {
|
||||
.modal h3 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.modal > div {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
padding: 5px 20px 13px 20px;
|
||||
border-radius: 0;
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.contact-form input,
|
||||
.contact-form textarea {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.contact-form-email-phone input:first-child {
|
||||
width: 100%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.contact-form-email-phone input:last-child {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.contact-form-email-phone input:last-child {
|
||||
width: 100%;
|
||||
margin-top: 15px;
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
.contact-form-alert input {
|
||||
width: 20px
|
||||
}
|
||||
|
||||
.contact-form-alert {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.noselect {
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
-webkit-touch-callout: none; /* iOS Safari */
|
||||
-webkit-user-select: none; /* Safari */
|
||||
-khtml-user-select: none; /* Konqueror HTML */
|
||||
|
||||
@@ -123,14 +123,14 @@ export default class ContactModal extends React.Component {
|
||||
/>
|
||||
</div>
|
||||
<div className="contact-form-alert noselect">
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
onChange={this.onAlertToggle.bind(this)}
|
||||
checked={doAlert}
|
||||
/>
|
||||
<span onClick={this.onAlertToggle.bind(this)}>
|
||||
Obavjesti me ukoliko se slična nekretnine pojavi
|
||||
</span>
|
||||
Javi mi kada se objavi sličan oglas
|
||||
</label>
|
||||
</div>
|
||||
<div className="contact-form-footer">
|
||||
<button disabled={sending}>Pošalji poruku</button>
|
||||
|
||||
@@ -1,8 +1,11 @@
|
||||
import fetch from 'isomorphic-fetch'
|
||||
|
||||
//const BASE_URL = 'localhost';
|
||||
const BASE_URL = '192.168.0.13';
|
||||
|
||||
export const saveContactRequest = (listingId, params) => {
|
||||
|
||||
let url = `http://localhost:3001/api/contact/${listingId}`
|
||||
let url = `http://${BASE_URL}:3001/api/contact/${listingId}`
|
||||
|
||||
return fetch(url, {
|
||||
method: 'POST',
|
||||
@@ -15,7 +18,7 @@ export const saveContactRequest = (listingId, params) => {
|
||||
}
|
||||
|
||||
export const loadListing = id => {
|
||||
let url = `http://localhost:3001/api/search/listings/${id}`
|
||||
let url = `http://${BASE_URL}:3001/api/search/listings/${id}`
|
||||
|
||||
return fetch(
|
||||
url,
|
||||
@@ -47,7 +50,7 @@ export const loadProperties = (
|
||||
|
||||
// TODO: handle errors
|
||||
//return fetch(process.env.API_URL + '/api/search', {
|
||||
let url = `http://localhost:3001/api/search/listings?bounds=${bounds}&minPrice=${minPrice}&maxPrice=${maxPrice}&rooms=${allRooms}&minSize=${minSize}&maxSize=${maxSize}&category=${allCategories}&page=${page}&pins=${pins}&sort=${sort}`
|
||||
let url = `http://${BASE_URL}:3001/api/search/listings?bounds=${bounds}&minPrice=${minPrice}&maxPrice=${maxPrice}&rooms=${allRooms}&minSize=${minSize}&maxSize=${maxSize}&category=${allCategories}&page=${page}&pins=${pins}&sort=${sort}`
|
||||
|
||||
return fetch(
|
||||
url,
|
||||
|
||||
Reference in New Issue
Block a user