-
Notifications
You must be signed in to change notification settings - Fork 6
/
Copy pathcontact.html
64 lines (55 loc) · 3.27 KB
/
contact.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
---
title: Contact
description: Send us a message to find out more!
map:
latitude: -31.38199042981805
longitude: -64.27197730170761
address: "Lote 10 Manzana 126, Barrio Natania 19, X5021FPJ Córdoba, Argentina"
zoom: 15
image: /images/sara-hero.png
---
<section class="hero" style="background-image: url({% include relative-src.html src=page.image %})">
<div class="inner-hero text-container">
<div class="hero-text-container">
<h1 class="editable">{% t pages.contact_title %}</h1>
<p class="subtext editable">{% t pages.contact_subtitle %}</p>
</div>
</div>
</section>
<section class="pad">
<div class="text-container contact-box">
<div class="contact-details">
<h3>{% t pages.contact_address %}</h3>
<address><a target="_blank" href="https://www.google.com/maps/place/{{ page.map.address | url_encode }}">{{ page.map.address | replace: ", ", ", <br>" }}</a></address>
<h3>Email</h3>
<p class="editable"><a href="mailto:[email protected]">[email protected]</a></p>
</div>
</div>
</section>
<div class="map" id="map"></div>
<script>
window.mapData = {{ page.map | jsonify }};
function initMap() {
var myOptions = {
scrollwheel: false,
draggable: false,
panControl: false,
disableDefaultUI: true,
styles: [{"featureType":"landscape.man_made","elementType":"geometry","stylers":[{"color":"#f7f1df"}]},{"featureType":"landscape.natural","elementType":"geometry","stylers":[{"color":"#d0e3b4"}]},{"featureType":"landscape.natural.terrain","elementType":"geometry","stylers":[{"visibility":"off"}]},{"featureType":"poi","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"poi.business","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"poi.medical","elementType":"geometry","stylers":[{"color":"#fbd3da"}]},{"featureType":"poi.park","elementType":"geometry","stylers":[{"color":"#bde6ab"}]},{"featureType":"road","elementType":"geometry.stroke","stylers":[{"visibility":"off"}]},{"featureType":"road","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#ffe15f"}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"color":"#efd151"}]},{"featureType":"road.arterial","elementType":"geometry.fill","stylers":[{"color":"#ffffff"}]},{"featureType":"road.local","elementType":"geometry.fill","stylers":[{"color":"black"}]},{"featureType":"transit.station.airport","elementType":"geometry.fill","stylers":[{"color":"#cfb2db"}]},{"featureType":"water","elementType":"geometry","stylers":[{"color":"#a2daf2"}]}],
zoom: window.mapData.zoom,
maxZoom: window.mapData.zoom,
minZoom: window.mapData.zoom,
center: new google.maps.LatLng(window.mapData.latitude, window.mapData.longitude),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map'), myOptions);
var marker = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(window.mapData.latitude, window.mapData.longitude)
});
google.maps.event.addDomListener(window, 'resize', function() {
map.setCenter(myOptions.center);
});
}
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key={{ site.google_maps_javascript_api_key }}&callback=initMap"></script>