mirror of
https://github.com/a2nt/webpack-bootstrap-ui-kit.git
synced 2024-10-22 11:05:45 +02:00
Map element
This commit is contained in:
parent
4490051b3e
commit
e95892521e
56
src/html/Elements/Map.html
Normal file
56
src/html/Elements/Map.html
Normal file
@ -0,0 +1,56 @@
|
||||
<h2 class="content-element__title">Find Location</h2>
|
||||
<div
|
||||
class="mapAPI-map-container"
|
||||
data-map-zoom="12"
|
||||
data-key=""
|
||||
data-map-style="mapbox://styles/mapbox/streets-v9"
|
||||
data-geojson="{"type":"MarkerCollection","features":[{"id":4,"type":"Feature","icon":"<i class=\"fas fa-map-marker-alt\"><\/i>","properties":{"content":"<div id=\"MapPin4\" data-id=\"4\" class=\"location\">\n <div class=\"fn\">Office #1<\/div>\n <div class=\"addr\">17 Lakeside Drive<\/div>\n \n \n \n <div class=\"d-none\"> U<\/div>\n \n \n \n <div class=\"dir-link\">\n <a href=\"https:\/\/www.google.com\/maps\/dir\/Current+Location\/40.8827743,-74.4276612\" target=\"_blank\">Get Directions &raquo;<\/a>\n <\/div>\n<\/div>\n"},"geometry":{"type":"Point","coordinates":[-74.4276612,40.8827743]}},{"id":3,"type":"Feature","icon":"<i class=\"fas fa-map-marker-alt\"><\/i>","properties":{"content":"<div id=\"MapPin3\" data-id=\"3\" class=\"location\">\n <div class=\"fn\">Office #2<\/div>\n <div class=\"addr\">Flower Hill Cemetery<\/div>\n \n \n \n <div class=\"d-none\"> N<\/div>\n \n \n \n <div class=\"dir-link\">\n <a href=\"https:\/\/www.google.com\/maps\/dir\/Current+Location\/40.7884708,-74.0249253\" target=\"_blank\">Get Directions &raquo;<\/a>\n <\/div>\n<\/div>\n"},"geometry":{"type":"Point","coordinates":[-74.0249253,40.7884708]}},{"id":2,"type":"Feature","icon":"<i class=\"fas fa-map-marker-alt\"><\/i>","properties":{"content":"<div id=\"MapPin2\" data-id=\"2\" class=\"location\">\n <div class=\"fn\">Office #3<\/div>\n <div class=\"addr\">555 Phoenix Road<\/div>\n \n \n \n <div class=\"d-none\"> U<\/div>\n \n \n \n <div class=\"dir-link\">\n <a href=\"https:\/\/www.google.com\/maps\/dir\/Current+Location\/40.8527479,-78.2475576\" target=\"_blank\">Get Directions &raquo;<\/a>\n <\/div>\n<\/div>\n"},"geometry":{"type":"Point","coordinates":[-78.2475576,40.8527479]}},{"id":1,"type":"Feature","icon":"<i class=\"fas fa-map-marker-alt\"><\/i>","properties":{"content":"<div id=\"MapPin1\" data-id=\"1\" class=\"location\">\n <div class=\"fn\">Office #4<\/div>\n <div class=\"addr\">15 East Hadley Road<\/div>\n \n \n \n <div class=\"d-none\"> U<\/div>\n \n \n \n <div class=\"dir-link\">\n <a href=\"https:\/\/www.google.com\/maps\/dir\/Current+Location\/42.3297023,-72.5552186\" target=\"_blank\">Get Directions &raquo;<\/a>\n <\/div>\n<\/div>\n"},"geometry":{"type":"Point","coordinates":[-72.5552186,42.3297023]}}]}"
|
||||
data-fly-to-marker="true"
|
||||
data-fly-to-bounds="false"
|
||||
>
|
||||
<div class="mapAPI-map"></div>
|
||||
</div>
|
||||
<div class="locations">
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div id="MapPin4" data-id="4" class="location">
|
||||
<div class="fn">Office #1</div>
|
||||
<div class="addr">17 Lakeside Drive</div>
|
||||
<div class="d-none"> U</div>
|
||||
<div class="dir-link">
|
||||
<a href="https://www.google.com/maps/dir/Current+Location/40.8827743,-74.4276612" target="_blank">Get Directions »</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div id="MapPin3" data-id="3" class="location">
|
||||
<div class="fn">Office #2</div>
|
||||
<div class="addr">Flower Hill Cemetery</div>
|
||||
<div class="d-none"> N</div>
|
||||
<div class="dir-link">
|
||||
<a href="https://www.google.com/maps/dir/Current+Location/40.7884708,-74.0249253" target="_blank">Get Directions »</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div id="MapPin2" data-id="2" class="location">
|
||||
<div class="fn">Office #3</div>
|
||||
<div class="addr">555 Phoenix Road</div>
|
||||
<div class="d-none"> U</div>
|
||||
<div class="dir-link">
|
||||
<a href="https://www.google.com/maps/dir/Current+Location/40.8527479,-78.2475576" target="_blank">Get Directions »</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div id="MapPin1" data-id="1" class="location">
|
||||
<div class="fn">Office #4</div>
|
||||
<div class="addr">15 East Hadley Road</div>
|
||||
<div class="d-none"> U</div>
|
||||
<div class="dir-link">
|
||||
<a href="https://www.google.com/maps/dir/Current+Location/42.3297023,-72.5552186" target="_blank">Get Directions »</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
@ -54,6 +54,13 @@
|
||||
</div>
|
||||
</section>
|
||||
<!-- /Accordion List -->
|
||||
<!-- Map Element -->
|
||||
<section id="MapElement" class="element site__elements__mapelement">
|
||||
<div class="element-container container">
|
||||
<%= require('html-loader!./html/Elements/Map.html') %>
|
||||
</div>
|
||||
</section>
|
||||
<!-- /Map Element -->
|
||||
</main>
|
||||
</div>
|
||||
<footer id="Footer" class="footer site-footer">
|
||||
|
@ -78,8 +78,8 @@ const MultiSlider = (($) => {
|
||||
// actions
|
||||
ui.$elContainer.append(
|
||||
'<div class="slider-actions">' +
|
||||
'<a href="#" class="slider-prev"><i class="fas fa-chevron-left"></i></a>' +
|
||||
'<a href="#" class="slider-next"><i class="fas fa-chevron-right"></i></a>' +
|
||||
'<a href="#" class="slider-prev"><i class="fas fa-chevron-left"></i><b class="sr-only">Prev</b></a>' +
|
||||
'<a href="#" class="slider-next"><i class="fas fa-chevron-right"></i><b class="sr-only">Next</b></a>' +
|
||||
'</div>'
|
||||
);
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user