So, I figured out how to make a dropdown there, but i'm having trouble getting the links to work. Any idea?
[{"id":"49ea3062.e83f2","type":"ui_template","z":"e5ec21e6.2c39e","group":"fc9f45d0.c93828","name":"dropdown","order":86,"width":29,"height":1,"format":"<style>\n .active {\n background-color: green;\n color: white;\n }\n \n /* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */\n .dropdown-container {\n display: none;\n background-color: #262626;\n padding-left: 8px;\n }\n .dropdown-btn {\n padding: 6px 8px 6px 16px;\n text-decoration: none;\n font-size: 20px;\n color: #818181;\n display: block;\n border: none;\n background: none;\n width: 100%;\n text-align: left;\n cursor: pointer;\n outline: none;\n }\n</style>\n\n<script>\n $('#nr-dashboard > md-content > section > md-sidenav').append(`\n <button class=\"dropdown-btn\">Dropdown \n <i class=\"fa fa-caret-down\"></i>\n </button>\n <div class=\"dropdown-container\">\n <md-list role=\"list\"> <!-- ngRepeat: obj in main.menu --><!-- ngIf: !obj.hidden --><md-list-item ng-repeat=\"obj in main.menu\" ng-class=\"{'nr-menu-item-active':location.$$path=='/'+$index}\" role=\"listitem\" class=\"_md-button-wrap ng-scope _md\" tabindex=\"-1\" aria-disabled=\"false\" style=\"\"><div class=\"md-button md-no-style\"><!-- ngIf: !obj.hidden --><button class=\"md-no-style md-button ng-scope md-ink-ripple\" type=\"button\" ng-transclude=\"\" ng-if=\"!obj.hidden\" ng-click=\"main.open(obj, $index)\" ng-disabled=\"obj.disabled\" aria-label=\"Delta\"></button><!-- end ngIf: !obj.hidden --> <div class=\"md-list-item-inner\"> <ui-icon icon=\"fa-industry\" style=\"margin:5px\" class=\"ng-isolate-scope\"><!-- ngIf: iconType==='angular-material' --> <!-- ngIf: iconType==='fa' --><div ng-if=\"iconType==='fa'\" style=\"display:inline-block; margin:auto; line-height:initial;\" class=\"ng-scope\"><i class=\"fa fa-fw fa-industry\" ng-class=\"icon\"></i></div><!-- end ngIf: iconType==='fa' --> <!-- ngIf: iconType==='wi' --> <!-- ngIf: iconType==='mi' --> <!-- ngIf: iconType==='icofont' --> <!-- ngIf: iconType==='image' --> </ui-icon> <p class=\"ng-binding\">Delta</p> </div><div class=\"md-secondary-container\"></div></div></md-list-item><!-- end ngIf: !obj.hidden --><!-- end ngRepeat: obj in main.menu --><!-- ngIf: !obj.hidden --><md-list-item ng-repeat=\"obj in main.menu\" ng-class=\"{'nr-menu-item-active':location.$$path=='/'+$index}\" role=\"listitem\" class=\"_md-button-wrap ng-scope _md nr-menu-item-active\" tabindex=\"-1\" aria-disabled=\"false\" style=\"\"><div class=\"md-button md-no-style\"><!-- ngIf: !obj.hidden --><button class=\"md-no-style md-button ng-scope md-ink-ripple\" type=\"button\" ng-transclude=\"\" ng-if=\"!obj.hidden\" ng-click=\"main.open(obj, $index)\" ng-disabled=\"obj.disabled\" aria-label=\"Malhas Delta\"><div class=\"md-ripple-container\" style=\"\"></div></button><!-- end ngIf: !obj.hidden --> <div class=\"md-list-item-inner\"> <ui-icon icon=\"fa-microchip\" style=\"margin:5px\" class=\"ng-isolate-scope\"><!-- ngIf: iconType==='angular-material' --> <!-- ngIf: iconType==='fa' --><div ng-if=\"iconType==='fa'\" style=\"display:inline-block; margin:auto; line-height:initial;\" class=\"ng-scope\"><i class=\"fa fa-fw fa-microchip\" ng-class=\"icon\"></i></div><!-- end ngIf: iconType==='fa' --> <!-- ngIf: iconType==='wi' --> <!-- ngIf: iconType==='mi' --> <!-- ngIf: iconType==='icofont' --> <!-- ngIf: iconType==='image' --> </ui-icon> <p class=\"ng-binding\">Malhas Delta</p> </div><div class=\"md-secondary-container\"></div></div></md-list-item><!-- end ngIf: !obj.hidden --><!-- end ngRepeat: obj in main.menu --><!-- ngIf: !obj.hidden --><md-list-item ng-repeat=\"obj in main.menu\" ng-class=\"{'nr-menu-item-active':location.$$path=='/'+$index}\" role=\"listitem\" class=\"_md-button-wrap ng-scope _md\" tabindex=\"-1\" aria-disabled=\"false\"><div class=\"md-button md-no-style\"><!-- ngIf: !obj.hidden --><button class=\"md-no-style md-button ng-scope md-ink-ripple\" type=\"button\" ng-transclude=\"\" ng-if=\"!obj.hidden\" ng-click=\"main.open(obj, $index)\" ng-disabled=\"obj.disabled\" aria-label=\"Moenda Delta\"></button><!-- end ngIf: !obj.hidden --> <div class=\"md-list-item-inner\"> <ui-icon icon=\"fa-cogs\" style=\"margin:5px\" class=\"ng-isolate-scope\"><!-- ngIf: iconType==='angular-material' --> <!-- ngIf: iconType==='fa' --><div ng-if=\"iconType==='fa'\" style=\"display:inline-block; margin:auto; line-height:initial;\" class=\"ng-scope\"><i class=\"fa fa-fw fa-cogs\" ng-class=\"icon\"></i></div><!-- end ngIf: iconType==='fa' --> <!-- ngIf: iconType==='wi' --> <!-- ngIf: iconType==='mi' --> <!-- ngIf: iconType==='icofont' --> <!-- ngIf: iconType==='image' --> </ui-icon> <p class=\"ng-binding\">Moenda Delta</p> </div><div class=\"md-secondary-container\"></div></div></md-list-item><!-- end ngIf: !obj.hidden --><!-- end ngRepeat: obj in main.menu --><!-- ngIf: !obj.hidden --><md-list-item ng-repeat=\"obj in main.menu\" ng-class=\"{'nr-menu-item-active':location.$$path=='/'+$index}\" role=\"listitem\" class=\"_md-button-wrap ng-scope _md\" tabindex=\"-1\" aria-disabled=\"false\"><div class=\"md-button md-no-style\"><!-- ngIf: !obj.hidden --><button class=\"md-no-style md-button ng-scope md-ink-ripple\" type=\"button\" ng-transclude=\"\" ng-if=\"!obj.hidden\" ng-click=\"main.open(obj, $index)\" ng-disabled=\"obj.disabled\" aria-label=\"Destilaria Delta\"></button><!-- end ngIf: !obj.hidden --> <div class=\"md-list-item-inner\"> <ui-icon icon=\"fa-flask\" style=\"margin:5px\" class=\"ng-isolate-scope\"><!-- ngIf: iconType==='angular-material' --> <!-- ngIf: iconType==='fa' --><div ng-if=\"iconType==='fa'\" style=\"display:inline-block; margin:auto; line-height:initial;\" class=\"ng-scope\"><i class=\"fa fa-fw fa-flask\" ng-class=\"icon\"></i></div><!-- end ngIf: iconType==='fa' --> <!-- ngIf: iconType==='wi' --> <!-- ngIf: iconType==='mi' --> <!-- ngIf: iconType==='icofont' --> <!-- ngIf: iconType==='image' --> </ui-icon> <p class=\"ng-binding\">Destilaria Delta</p> </div><div class=\"md-secondary-container\"></div></div></md-list-item><!-- end ngIf: !obj.hidden --><!-- end ngRepeat: obj in main.menu --><!-- ngIf: !obj.hidden --><md-list-item ng-repeat=\"obj in main.menu\" ng-class=\"{'nr-menu-item-active':location.$$path=='/'+$index}\" role=\"listitem\" class=\"_md-button-wrap ng-scope _md\" tabindex=\"-1\" aria-disabled=\"false\"><div class=\"md-button md-no-style\"><!-- ngIf: !obj.hidden --><button class=\"md-no-style md-button ng-scope md-ink-ripple\" type=\"button\" ng-transclude=\"\" ng-if=\"!obj.hidden\" ng-click=\"main.open(obj, $index)\" ng-disabled=\"obj.disabled\" aria-label=\"Volta Grande\"></button><!-- end ngIf: !obj.hidden --> <div class=\"md-list-item-inner\"> <ui-icon icon=\"fa-industry\" style=\"margin:5px\" class=\"ng-isolate-scope\"><!-- ngIf: iconType==='angular-material' --> <!-- ngIf: iconType==='fa' --><div ng-if=\"iconType==='fa'\" style=\"display:inline-block; margin:auto; line-height:initial;\" class=\"ng-scope\"><i class=\"fa fa-fw fa-industry\" ng-class=\"icon\"></i></div><!-- end ngIf: iconType==='fa' --> <!-- ngIf: iconType==='wi' --> <!-- ngIf: iconType==='mi' --> <!-- ngIf: iconType==='icofont' --> <!-- ngIf: iconType==='image' --> </ui-icon> <p class=\"ng-binding\">Volta Grande</p> </div><div class=\"md-secondary-container\"></div></div></md-list-item><!-- end ngIf: !obj.hidden --><!-- end ngRepeat: obj in main.menu --><!-- ngIf: !obj.hidden --><md-list-item ng-repeat=\"obj in main.menu\" ng-class=\"{'nr-menu-item-active':location.$$path=='/'+$index}\" role=\"listitem\" class=\"_md-button-wrap ng-scope _md\" tabindex=\"-1\" aria-disabled=\"false\"><div class=\"md-button md-no-style\"><!-- ngIf: !obj.hidden --><button class=\"md-no-style md-button ng-scope md-ink-ripple\" type=\"button\" ng-transclude=\"\" ng-if=\"!obj.hidden\" ng-click=\"main.open(obj, $index)\" ng-disabled=\"obj.disabled\" aria-label=\"Malhas Volta Grande\"></button><!-- end ngIf: !obj.hidden --> <div class=\"md-list-item-inner\"> <ui-icon icon=\"fa-microchip\" style=\"margin:5px\" class=\"ng-isolate-scope\"><!-- ngIf: iconType==='angular-material' --> <!-- ngIf: iconType==='fa' --><div ng-if=\"iconType==='fa'\" style=\"display:inline-block; margin:auto; line-height:initial;\" class=\"ng-scope\"><i class=\"fa fa-fw fa-microchip\" ng-class=\"icon\"></i></div><!-- end ngIf: iconType==='fa' --> <!-- ngIf: iconType==='wi' --> <!-- ngIf: iconType==='mi' --> <!-- ngIf: iconType==='icofont' --> <!-- ngIf: iconType==='image' --> </ui-icon> <p class=\"ng-binding\">Malhas Volta Grande</p> </div><div class=\"md-secondary-container\"></div></div></md-list-item><!-- end ngIf: !obj.hidden --><!-- end ngRepeat: obj in main.menu --><!-- ngIf: !obj.hidden --><!-- end ngRepeat: obj in main.menu --><!-- ngIf: !obj.hidden --><!-- end ngRepeat: obj in main.menu --><!-- ngIf: !obj.hidden --><md-list-item ng-repeat=\"obj in main.menu\" ng-class=\"{'nr-menu-item-active':location.$$path=='/'+$index}\" role=\"listitem\" class=\"_md-button-wrap ng-scope _md\" tabindex=\"-1\" aria-disabled=\"false\"><div class=\"md-button md-no-style\"><!-- ngIf: !obj.hidden --><button class=\"md-no-style md-button ng-scope md-ink-ripple\" type=\"button\" ng-transclude=\"\" ng-if=\"!obj.hidden\" ng-click=\"main.open(obj, $index)\" ng-disabled=\"obj.disabled\" aria-label=\"Trend\"></button><!-- end ngIf: !obj.hidden --> <div class=\"md-list-item-inner\"> <ui-icon icon=\"fa-search\" style=\"margin:5px\" class=\"ng-isolate-scope\"><!-- ngIf: iconType==='angular-material' --> <!-- ngIf: iconType==='fa' --><div ng-if=\"iconType==='fa'\" style=\"display:inline-block; margin:auto; line-height:initial;\" class=\"ng-scope\"><i class=\"fa fa-fw fa-search\" ng-class=\"icon\"></i></div><!-- end ngIf: iconType==='fa' --> <!-- ngIf: iconType==='wi' --> <!-- ngIf: iconType==='mi' --> <!-- ngIf: iconType==='icofont' --> <!-- ngIf: iconType==='image' --> </ui-icon> <p class=\"ng-binding\">Trend</p> </div><div class=\"md-secondary-container\"></div></div></md-list-item><!-- end ngIf: !obj.hidden --><!-- end ngRepeat: obj in main.menu --> </md-list>\n </div>`);\n var dropdown = document.getElementsByClassName(\"dropdown-btn\");\n var i;\n \n for (i = 0; i < dropdown.length; i++) {\n dropdown[i].addEventListener(\"click\", function() {\n this.classList.toggle(\"active\");\n var dropdownContent = this.nextElementSibling;\n if (dropdownContent.style.display === \"block\") {\n dropdownContent.style.display = \"none\";\n } else {\n dropdownContent.style.display = \"block\";\n }\n });\n }\n</script>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"global","x":460,"y":125,"wires":[[]]},{"id":"fc9f45d0.c93828","type":"ui_group","z":"","name":"VG","tab":"ded1d340.aeb1e","order":1,"disp":false,"width":"29","collapse":false},{"id":"ded1d340.aeb1e","type":"ui_tab","z":"","name":"Volta Grande","icon":"fa-industry","order":5,"disabled":false,"hidden":false}]
