<div class="settings-sidebar is-active">
  <div class="settings-sidebar-inner">
    <div class="user-block">
      <a class="close-settings-sidebar is-hidden">
        <i data-feather="x"></i>
      </a>
      <div class="avatar-wrap">
        <img
          src="https://via.placeholder.com/150x150"
          data-demo-src="assets/img/avatars/jenna.png"
          data-user-popover="0"
          alt=""
        />
        <div class="badge">
          <i data-feather="check"></i>
        </div>
      </div>
      <h4>Jenna Davis</h4>
      <p>Melbourne, AU</p>
    </div>
    <div class="user-menu">
      <div class="user-menu-inner has-slimscroll">
        <div class="menu-block">
          <ul>
            <li data-section="general" class="is-active">
              <a>
                <i data-feather="settings"></i>
                <span>General</span>
              </a>
            </li>
            <li data-section="security">
              <a>
                <i data-feather="shield"></i>
                <span>Security</span>
              </a>
            </li>
            <li data-section="personal">
              <a>
                <i data-feather="alert-triangle"></i>
                <span>Account</span>
              </a>
            </li>
          </ul>
        </div>
        <div class="separator"></div>
        <div class="menu-block">
          <ul>
            <li data-section="privacy">
              <a>
                <i data-feather="lock"></i>
                <span>Privacy</span>
              </a>
            </li>
            <li data-section="preferences">
              <a>
                <i data-feather="sliders"></i>
                <span>Preferences</span>
              </a>
            </li>
          </ul>
        </div>
        <div class="separator"></div>
        <div class="menu-block">
          <ul>
            <li data-section="notifications">
              <a>
                <i data-feather="bell"></i>
                <span>Notifications</span>
              </a>
            </li>
            <li data-section="support">
              <a>
                <i data-feather="life-buoy"></i>
                <span>Help</span>
              </a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
