Start a new discussion

To start a new discussion please visit the discussions section of the GitHub home page of the project.

Discussions on GitHub

You can also search our old self-hosted forums for any useful information below but please note that posting new content here is not possible any more.

Reply To: Change default align for toggle menu button and add MENU text

Home › Forums › Older releases › 1.0.x › Change default align for toggle menu button and add MENU text › Reply To: Change default align for toggle menu button and add MENU text

February 4, 2016 at 11:33 #3010
admin
Keymaster

Assuming you are using the sample code from here:

http://www.smartmenus.org/docs/#menu-toggle-button

for example, you could achieve it by making the following changes:

HTML:

<!-- Mobile menu toggle button (hamburger/x icon) -->
<input id="main-menu-state" type="checkbox" />
<label class="main-menu-btn" for="main-menu-state">
  <span class="main-menu-btn-icon"></span> Toggle main menu visibility
</label>

<h3 class="main-menu-heading">MENU</h3>

<!-- Sample menu definition -->
<ul id="main-menu" class="sm sm-blue"> ...

CSS:

#main-menu {
  clear: both;
}
.main-menu-heading {
  /* style the MENU text as you like here */
}
@media (min-width: 768px) {
  .main-menu-heading {
    display: none;
  }
}
.main-menu-btn {
  float: right;
  /* ... the declarations from the Docs */
}
/*... the rest of the rules from the Docs */

Hope it’s clear enough. Cheers!