Materialize Design Hamburger Icon Not Displaying

Question

Я использую материализованность в качестве интерфейса пользовательского интерфейса в своем приложении rails, и все работает правильно, за исключением того, что опция меню «material-icons» не работает должным образом.

Полный код ниже, но это часть, которая не работает должным образом:

<a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a> 

Вместо того, чтобы превратиться в значок гамбургер, когда я сжать браузер, чтобы вызвать отклик, он просто отображает текстовое узловое меню. Я не могу понять, что я делаю неправильно. Все остальное работает.

Это вся нав/выпадающий структура:

<!-- Dropdown Structure --> 
    <ul id="dropdown1" class="dropdown-content"> 
    <li><a href="#!">My Profile</a></li> 
    <li><a href="#!">My Courses</a></li> 
    <li class="divider"></li> 
    <li><a href="#!">Logout</a></li> 
    </ul> 

    <!-- Dropdown Structure --> 
    <ul id="dropdown2" class="dropdown-content"> 
    <li><a href="#!">My Profile</a></li> 
    <li><a href="#!">My Courses</a></li> 
    <li class="divider"></li> 
    <li><a href="#!">Logout</a></li> 
    </ul> 

    <header> 
    <nav class="z-depth-2"> 
     <div class="container"> 
     <div class="nav-wrapper"> 
      <a href="#!" class="brand-logo">OppSim</a> 
      <a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a> 
      <ul class="right hide-on-med-and-down"> 
      <!-- web view --> 
      <li><a href="#">Courses</a></li> 
      <li><a href="#">Signup</a></li> 
      <li><a href="#">Login</a></li> 
      <!-- Dropdown Trigger --> 
      <li><a class="dropdown-button" href="#!" data-activates="dropdown1">JTB<i class="material-icons right"></i></a></li> 
      </ul> 
      <ul class="side-nav" id="mobile-demo"> 
      <!-- mobile view --> 
      <li><a href="#">Courses</a></li> 
      <li><a href="#">Signup</a></li> 
      <li><a href="#">Login</a></li> 
      <!-- Dropdown Trigger --> 
      <li><a class="dropdown-button" href="#!" data-activates="dropdown2">JTB<i class="material-icons right"></i></a></li> 
      </ul> 
     </div> 
     </div> 
    </nav> 
    </header> 

Или, может быть, я должен придерживаться гольф.

Answer 1

Чтобы использовать иконки в materalize вы должны включить этот шрифт

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 

согласно их официальной документации here