Handle sub-submenus with BookingSync generated websites

_menu.liquid

Replace:

``` liquid
<li><a href="{{ subitem.url }}">{{ subitem.title }}</a></li>
```

By:

``` liquid
{% assign has_subsubmenu = (subitem.submenu and subitem.submenu.items.size > 0) %}
<li class="{% if has_subsubmenu %}subsubmenu dropdown-submenu{% endif %} {{ subitem.url | active: current_page.url }} {{ subitem.url | active: current_page.path }}">
  {% if has_subsubmenu %}
    {% if subitem.url %}
      <a href="{{ subitem.url }}">{{ subitem.title }}</a>
      <a href="#" class="dropdown-toggle inline" data-toggle="dropdown">
        <span class="caret"></span></a>
    {% else %}
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">
        {{ subitem.title }} <span class="caret"></span></a>
    {% endif %}
    <ul class="dropdown-menu" role="menu">
      {% for subsubitem in subitem.submenu.items %}
        <li><a href="{{ subsubitem.url }}">{{ subsubitem.title }}</a></li>
      {% endfor %}
    </ul>
  {% elsif subitem.url %}
    <a href="{{ subitem.url }}">{{ subitem.title }}</a>
  {% else %}
    <span>{{ subitem.title }}</span>
  {% endif %}
</li>
```

sub-submenu.js.coffee

# Make sure to load this file from your application.js.coffee
$ ->
  $(document).on 'click', '.dropdown-submenu a', (event) ->
    $(this).parents('.submenu').addClass('open')

sub-submenu.scss

// Make sure to load this file from your application.scss
.dropdown-submenu {
  position: relative;

  .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
    margin-left: -1px;
    border-radius: 0 $border-radius-base $border-radius-base $border-radius-base;
  }
}

@media (max-width: $grid-float-breakpoint-max) {
  .navbar-nav .open .dropdown-submenu .dropdown-menu > li  > a,
  .navbar-nav .open .dropdown-submenu .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 35px;
  }
}