Link copied!

Examples

<div class="e-topnav">
  <div class="e-topnav__container">
    <div class="e-topnav__logo e-topnav__logo-b2c">
      <svg>
        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#e-logo"></use>
      </svg>
    </div>
    <input class="e-topnav__mobilemenu" id="e-topnav__mobilemenu" type="checkbox">
    <nav class="e-menu">
      <ul class="e-menu__list">
        <li class="e-menu__item">
          <a class="e-menu__name" href="#0">
            Dashboard
          </a>
        </li>
        <li class="e-menu__item e-menu__item-active">
          <span class="e-menu__name">
            Forms
          </span>
          <div class="e-menu__drop">
            <ul class="e-menu__list e-menu__list-child">
              <li class="e-menu__item e-menu__item-child">
                <a class="e-menu__name e-menu__name-child" href="#0">
                  Forms
                </a>
              </li>
              <li class="e-menu__item e-menu__item-child">
                <a class="e-menu__name e-menu__name-child" href="#0">
                  Settings
                </a>
              </li>
            </ul>
          </div>
        </li>
      </ul>
    </nav>
    <label class="e-hamburger" for="e-topnav__mobilemenu">
      <span class="e-hamburger__line"></span>
    </label>
    <div class="e-iconmenu">
      <div class="e-iconmenu__item">
        <e-dropdown data-markup-class="e-btn e-btn-customerinfo e-btn-dropdown" data-markup-content="sz_kenedi_trunk_int">
          <div class="e-dropdown__content">
            <div class="e-iconmenu__profile">
              <div class="e-iconmenu__profile__header">
                <h3>
                  <a href="#0">
                    sz_kenedi_trunk_int - admin
                  </a>
                </h3>
                <div class="e-iconmenu__profile__time">
                  <span>
                    Tuesday, November 17 12:54 (GMT+1:00)
                  </span>
                </div>
              </div>
              <a class="e-dropdown__item" href="#0">
                <e-icon icon="e-profile" type="table"></e-icon>
                 My Profile
              </a>
              <a class="e-dropdown__item" href="#0">
                <e-icon icon="template" type="table"></e-icon>
                 Switch to old UI
              </a>
              <a class="e-dropdown__item" href="#0">
                <e-icon icon="life-ring" type="table"></e-icon>
                 Online Help
              </a>
              <a class="e-dropdown__item" href="#0">
                <e-icon icon="e-signout" type="table"></e-icon>
                 Log Out
              </a>
            </div>
          </div>
        </e-dropdown>
      </div>
      <div class="e-iconmenu__item">
        <e-dropdown data-markup-class="e-iconmenu__name" data-markup-content="&lt;svg class='e-icon e-icon-search'&gt;&lt;use xlink:href='#search'&gt;&lt;/use&gt;&lt;/svg&gt;">
          <div class="e-dropdown__content">
            <div class="e-search">
              <h3>
                <label for="js-function-search-query">
                  Search
                </label>
              </h3>
              <form method="get" name="workformsearch">
                <div class="e-field">
                  <select class="e-select" name="subject">
                    <option value="1//1">
                      in contacts by first name
                    </option>
                    <option value="1//2">
                      in contacts by last name
                    </option>
                    <option value="1//3">
                      in contacts by email
                    </option>
                    <option value="2">
                      in email campaigns
                    </option>
                    <option value="3">
                      in registration forms
                    </option>
                    <option value="4">
                      in segments
                    </option>
                    <option value="5">
                      in lists
                    </option>
                    <option value="6">
                      in bounces
                    </option>
                    <option value="7">
                      in email analysis
                    </option>
                  </select>
                </div>
                <div class="e-field">
                  <input class="e-input" type="text" name="needle" placeholder="Search for..." value autofocus>
                </div>
                <button class="e-btn e-btn-primary" type="submit" title="Search">
                  <e-icon icon="search" color="white"></e-icon>
                  Search
                </button>
              </form>
            </div>
          </div>
        </e-dropdown>
      </div>
      <div class="e-iconmenu__item">
        <div class="e-iconmenu__name">
          <span class="active" id="notification-center-badge">
            <e-icon icon="bell"></e-icon>
          </span>
          <div class="active" id="notification-center-badge-status">
            6
          </div>
        </div>
      </div>
    </div>
  </div>
</div>