Review the event page for a better map rendering

Author: lordkada

_includes/css/style.css

@@ -431,7 +431,7 @@ img::-moz-selection {
 }
 
 #event_map_container {
-    height: 240px;
+    height: 400px;
 }
 
 .map_dojo_name {

_layouts/event.html

@@ -1,36 +1,29 @@
 ---
 layout: default
 ---
+{% if page.registration_url contains "eventbrite.it/" %}
+    {% assign eventbrite_id = page.registration_url | split:"-" | last %}
+{% endif %}
 <div class="container mtb">
     <div class="row">
         <div class="col-lg-12">
             <h1>{{ page.title }}</h1>
         </div>
     </div>
     <div class="row">
-        <div class="col-lg-6">
+        <div class="col-lg-8">
             <h4>Data/Ora</h4>
             <p>{{ page.date | date: "%d/%m/%Y %H:%M" }}</p>
-            <h4>Luogo</h4>{%for location in site.event_locations%}{%if location.id == page.location%}
-            <p>{{ location.name }}</p>
-            <p>{{ location.addr }}</p>
-            {%endif%}{%endfor%}
-        </div>
-        <div class="col-lg-6">
-            <div id="event_map_container"></div>
-        </div>
-    </div>
-    {% if page.registration_url contains "eventbrite.it/" %}
-        {% assign eventbrite_id = page.registration_url | split:"-" | last %}
-        {% assign layout_width = "col-lg-6" %}
-    {% else %}
-        {% assign layout_width = "col-lg-12" %}
-    {% endif %}
-    <div class="row">
-        <div class="{{layout_width}}" style="margin-top:30px;">
-            {{content}}
+            <h4>Luogo</h4>
+            {%for location in site.event_locations%}
+              {%if location.id == page.location%}
+              <p>{{ location.name }}</p>
+              <p>{{ location.addr }}</p>
+              {%endif%}
+            {%endfor%}
+
             <h3>Istruzioni</h3>
-            <p>Per partecipare all'evento è necessario registrarsi {%if page.registration_url %}({%if eventbrite_id %}vedi il RIQUADRO oppure {% endif %}<a href="{{page.registration_url}}" target="_blank">CLICCA QUI</a>){% else %}(<b>le informazioni per la registrazione non sono ancora disponibili</b>){% endif %}</p>
+            <p>Per partecipare all'evento è necessario registrarsi {%if page.registration_url %}({%if eventbrite_id %}vedi il RIQUADRO oppure {% endif %}<a href="{{page.registration_url}}" target="_blank">CLICCA QUI</a>){% else %}(<b>le informazioni per la registrazione non sono ancora disponibili</b>){% endif %}.</p>
             <p>Vi invitiamo a richiedere un ticket per ogni partecipante: la procedura consentirà di richiedere più ticket contemporaneamente.</p>
             <p>Una volta effettuata la registrazione riceverete una mail di conferma: nel caso non la riceveste vi invitiamo a rivedere la vostra registrazione</p>
             <p>A causa dei posti limitati non potremo consentire a chi è sprovvisto di registrazione di partecipare all’evento, *senza alcuna eccezione*</p>
@@ -41,13 +34,16 @@ <h3>Ricordate di portare</h3>
                 <li>una merenda</li>
             </ul>
             <p></p>
-           {% include informazioni_generali_eventi.html %}
 
-        </div>
+            {% include informazioni_generali_eventi.html %}
 
-        {%if eventbrite_id %}
-            <div class="col-lg-6" style="text-align:left; margin-top:30px;"><iframe src="//eventbrite.it/tickets-external?eid={{eventbrite_id}}&ref=etckt" frameborder="0" height="550" width="100%" vspace="0" hspace="0" marginheight="5" marginwidth="5" scrolling="auto" allowtransparency="true"></iframe><div style="font-family:Helvetica, Arial; font-size:12px; padding:10px 0 5px; margin:2px; width:100%; text-align:left;" ></div></div>
-        {% endif %}
+        </div>
+        <div class="col-lg-4">
+            <div id="event_map_container"></div>
+            {%if eventbrite_id %}
+                <div style="text-align:left; margin-top:30px;"><iframe src="//eventbrite.it/tickets-external?eid={{eventbrite_id}}&ref=etckt" frameborder="0" height="550" width="100%" vspace="0" hspace="0" marginheight="5" marginwidth="5" scrolling="auto" allowtransparency="true"></iframe><div style="font-family:Helvetica, Arial; font-size:12px; padding:10px 0 5px; margin:2px; width:100%; text-align:left;" ></div></div>
+            {% endif %}
+        </div>
     </div>
 </div>
 <script type="text/javascript">var event_location = '{{page.location}}'</script>

assets/js/map.js

@@ -44,9 +44,9 @@ function setMarker(map, dojo, popupOpen) {
     iconUrl: '/assets/img/marker_cdmi.png',
     iconSize:     [64, 64], // size of the icon
     shadowSize:   [0, 0], // size of the shadow
-    iconAnchor:   [32, 64], // point of the icon which will correspond to marker's location
+    iconAnchor:   [32, 0], // point of the icon which will correspond to marker's location
     shadowAnchor: [0, 0],  // the same for the shadow
-    popupAnchor:  [32, -64] // point from which the popup should open relative to the iconAnchor
+    popupAnchor:  [0, 0] // point from which the popup should open relative to the iconAnchor
   });
   var popup_html = "<div><img src='/assets/img/" + dojo.logo + "'></img></div><div class='map_dojo_name'><a href='" + dojo.url + "' target='_new'>" + dojo.name + "</a></div><div class='map_dojo_addr'>" + dojo.addr + "</div>"
   var marker = L.marker([dojo.lat, dojo.lon], {icon: cdmiMarkerIcon}).addTo(map).bindPopup(popup_html);