There is also md-nav-bar which is by nature the correct thing to be base of the this thing here.
[{"id":"778d7358.63fecc","type":"ui_template","z":"a05ff4cd.1ae7e8","group":"19f5ed07.08a453","name":"nav-bar","order":12,"width":0,"height":0,"format":"<style>\n._md-nav-bar-list {\n flex-direction: row;\n justify-content: flex-start;\n}\nli.md-nav-item {\n width: 100%;\n}\n.md-nav-item:first-of-type {\n margin-left: 0px; \n}\nmd-nav-bar > div > nav > ul > li > button{\n width:98%;\n}\nmd-nav-bar md-nav-ink-bar {\n color: var(--nr-dashboard-groupTextColor);\n background: var(--nr-dashboard-groupTextColor);\n}\n</style>\n<div ng-cloak>\n <md-content class=\"md-padding\">\n <md-nav-bar\n md-no-ink-bar=\"disableInkBar\"\n md-selected-nav-item=\"currentNavItem\"\n nav-bar-aria-label=\"navigation links\">\n <md-nav-item md-nav-click=\"goto('page1')\" name=\"page1\">\n One\n </md-nav-item>\n <md-nav-item md-nav-click=\"goto('page2')\" name=\"page2\" ng-disabled=\"secondTabDisabled\">\n Two\n </md-nav-item>\n <md-nav-item md-nav-click=\"goto('page3')\" name=\"page3\">\n Three\n </md-nav-item>\n\n </md-nav-bar>\n \n\n </md-content>\n</div>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":230,"y":1000,"wires":[[]]},{"id":"19f5ed07.08a453","type":"ui_group","name":"Default","tab":"c71e2691.3704f8","order":1,"disp":true,"width":"6","collapse":false},{"id":"c71e2691.3704f8","type":"ui_tab","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]
Actually this could have potential to be part of the standard set of dashboard nodes? @dceejay
