hilarion hilarion - 16 days ago 7
AngularJS Question

How to make a horizontal navbar for angular material

It's my first time using Angular Material and I'm just asking if you guys can help me on adding an horizontal nav bar for my project using Angular Material? I'm having some trouble looking for one. Thank you in advance! Stay awesome :)

Answer

Look at this example:

<div layout="row" layout-padding class="bg-dark-blue nav-dark" layout-align="space-between center">
<div>
    <md-button>Home</md-button>
    <md-button>Item 1</md-button>
    <md-button>Item 2</md-button>
    <md-menu>
        <md-button md-menu-origin ng-click="$mdOpenMenu()">Help</md-button>
        <md-menu-content width="2">
            <md-menu-item>
                <md-button>Help</md-button>
            </md-menu-item>
            <md-menu-item>
                <md-button>About</md-button>
            </md-menu-item>
        </md-menu-content>
    </md-menu>
</div>
<div class="nav-buttons">
    <md-button class="md-raised md-accent">My profile</md-button>
    <md-button class="md-raised md-warn">Log Out</md-button>
</div>

Some of it's classes are just for colorizing the content,don't pay attention to much to them :)