.footer-text
  a.text.btn.bgm-white.c-gray onclick='toggle_menu()' Menu

.actions-menu.hidden
  -for item in menu
    -idx = menu.index(item) + 1
    -if item[:type] == 'link'
      a.text.btn.bgm-white.c-gray type="button" href="#{item[:link]}" target="#{item[:target]}" style="bottom:#{50+idx*45}px;animation-duration: #{(idx.to_f/10.0).round(2)}s" #{item[:text]}
    -if item[:type] == 'modal'
      a.text.btn.bgm-white.c-gray type="button" data-toggle="modal" data-target="#{item[:link]}" style="bottom:#{50+idx*45}px;animation-duration: #{(idx.to_f/10.0).round(2)}s" #{item[:text]}

.footer-btn
  a.btn.btn-float.bgm-blue.m-btn.waves-effect.waves-circle.waves-float onclick='toggle_menu()'
    i.zmdi.zmdi-menu

.actions-menu.hidden
  -for item in menu
    -idx = menu.index(item) + 1
    -if item[:type] == 'link'
      a.btn.btn-float.bgm-blue.m-btn.waves-effect.waves-circle.waves-float type="button" href="#{item[:link]}" target="#{item[:target]}" style="bottom:#{50+idx*45}px;animation-duration: #{(idx.to_f/10.0).round(2)}s"
        i.zmdi class="zmdi-#{item[:icon]}"

    -if item[:type] == 'modal'
      a.btn.btn-float.bgm-blue.m-btn.waves-effect.waves-circle.waves-float type="button" data-toggle="modal" data-target="#{item[:link]}" style="bottom:#{50+idx*45}px;animation-duration: #{(idx.to_f/10.0).round(2)}s"
        i.zmdi class="zmdi-#{item[:icon]}"


css:
  .actions-menu .btn-float {
    width: 40px;
    height: 40px;
    line-height : 30px !Important;
    margin-right: 5px;
  }

  .actions-menu .btn-float i {
    font-size: 17px;
  }

  .actions-menu .text {
    position: fixed;
    right: 100px;
    margin-bottom: 6px;
    border-radius: 20px;
    font-size: 8pt;
    z-index: 9;
  }

javascript:
  function toggle_menu() {
    if ($(".actions-menu.hidden")[0]) {
      show_menu();
    } else {
      hide_menu();
    }
  }
  function hide_menu() {
    $(".actions-menu a" ).removeClass('animated fadeInUp')
    $(".actions-menu a" ).addClass('animated fadeOutDown');
    setTimeout(function(){
      $(".actions-menu" ).addClass("hidden");
    }, 300);
  }
  function show_menu() {
    $(".actions-menu a" ).removeClass('animated fadeOutDown')
    $(".actions-menu a" ).addClass('animated fadeInUp');
    $(".actions-menu" ).removeClass("hidden");
  }