lerniri

function storemapper_after_search_result() {
  // This function is called after search results
  // are displayed in the page   
  map_recenter(Storemapper.map, Storemapper.map.getCenter(), 0, -150);
}

function map_recenter(map, latlng,offsetx,offsety) {
    var point1 = map.getProjection().fromLatLngToPoint(
        (latlng instanceof google.maps.LatLng) ? latlng : map.getCenter()
    );

lerniri

function storemapper_callback() {
   // Called immediately after Storemapper finishes loading
   document.querySelector("[data-value='category']").click();       
}

lerniri

#storemapper {
    position:relative!important;
}

#storemapper #storemapper-left {
    position:absolute!important;
    z-index:999;
    right:60px;
    top:60px;
    overflow:hidden!important;

lerniri

function storemapper_callback() {
  sortListByTier();
}

function sortListByTier() {
    let listArr = Array.from(document.querySelectorAll("#storemapper-list li"));

  listArr.sort(function(a, b) {
      if (a.className < b.className) {
          return -1;

lerniri

function zoom_in_map() {
    Storemapper.map.setZoom(16);
}

function storemapper_callback() {
    var view_btn = document.querySelectorAll('.storemapper_view a');
    view_btn.forEach(function(el) {
      el.addEventListener('click', zoom_in_map);
    });
  

lerniri

function storemapper_callback() {
      
      // Called immediately after Storemapper finishes loading

      sort_categories();
      sort_list_per_cat();

      /* Add Event Listener on List */
    var catCheckboxes = document.querySelectorAll('#storemapper-filter-drop-down a');
        for (var i = 0, len = catCheckboxes.length; i < len; i++) {

lerniri

function storemapper_callback() {
   // Called immediately after Storemapper finishes loading
   sort_categories();          
}

function storemapper_after_search_result() {
  // This function is called after search results
  // are displayed in the page
     sort_categories();
}

lerniri

#storemapper-left { float: right;}

#storemapper-list { text-align: right; }

#storemapper svg {
    right: 0;
    left: auto;
}

#storemapper:not(.hide_icons) .storemapper-address, 

lerniri

/* Below code switches layout to list on the right , map on the left.
   Copy this contence and past to Advanced settings under your Storemapper account 
   For more info on using custom CSS check this article: 
   https://www.storemapper.co/support/customizing-storemapper-with-css/
*/
#storemapper-left { float: right; padding-left: 10px; }

lerniri

<h2>Choose color theme</h2> 

<div class="form" style="width:500px;">
  <label for="primary-color">Choose primary color</label>  
<input type="color" id="primary-color">
<br>
<br>
<label for="secondary-color">Chose secondary color</label>
<input type="color" id="secondary-color">
<br>