pure-css/pure

Site example for "Vertical Menu with Submenus" doesn't work

masoudd opened this issue · 2 comments

masoudd commented

Description

The example in
https://purecss.io/menus/#vertical-menu-with-submenus
When I click "More >", Nothing happens.

Expected behavior

A sub menu should open

Actual behavior

Nothing happens

Steps to Reproduce

  1. Go to https://purecss.io/menus/#vertical-menu-with-submenus
  2. Click on "More >"

Environment

  • Pure version: 2.0.3 i think
  • Browser name and version: Tested on android {firefox, chrome}, windows {firefox, chrome}, linux {firefox} all latest version.
redonkulus commented

@masoudd thanks for the issue, the fix is live now.

0106WeiWeiDeng commented

Hello, I just copy & paste the code of the example to the local html file. When I open it in chrome and click "More >", Nothing happens too. How to get it work? Thanks in advance! The code is:

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Pure CSS</title>
    <link rel="stylesheet" href="https://unpkg.com/purecss@2.1.0/build/pure-min.css">
    <link rel="stylesheet" href="https://unpkg.com/purecss@2.1.0/build/grids-responsive-min.css">
</head>
<body>

<div id="layout" class="pure-g">
    <div class="sidebar pure-u-1 pure-u-md-1-4">
    
      <!-- the code come from https://purecss.io/menus#vertical-menu-with-submenus -->
      <div class="pure-menu custom-restricted-width">
          <ul class="pure-menu-list">
              <li class="pure-menu-item pure-menu-selected">
                  <a href="#" class="pure-menu-link">Flickr</a>
              </li>
              <li class="pure-menu-item">
                  <a href="#" class="pure-menu-link">Messenger</a>
              </li>
              <li class="pure-menu-item">
                  <a href="#" class="pure-menu-link">Sports</a>
              </li>
              <li class="pure-menu-item">
                  <a href="#" class="pure-menu-link">Finance</a>
              </li>
              <li class="pure-menu-item pure-menu-has-children">
                  <a href="#" id="menuLink1" class="pure-menu-link">More</a>
                  <ul class="pure-menu-children">
                      <li class="pure-menu-item">
                          <a href="#" class="pure-menu-link">Autos</a>
                      </li>
                      <li class="pure-menu-item">
                          <a href="#" class="pure-menu-link">Flickr</a>
                      </li>
                      <li class="pure-menu-item pure-menu-has-children">
                          <a href="#" id="menuLink1" class="pure-menu-link">Even More</a>
                          <ul class="pure-menu-children">
                              <li class="pure-menu-item">
                                  <a href="#" class="pure-menu-link">Foo</a>
                              </li>
                              <li class="pure-menu-item">
                                  <a href="#" class="pure-menu-link">Bar</a>
                              </li>
                              <li class="pure-menu-item">
                                  <a href="#" class="pure-menu-link">Baz</a>
                              </li>
                          </ul>
                      </li>
                  </ul>
              </li>
          </ul>
      </div>
    </div>

    <div class="content pure-u-1 pure-u-md-3-4">
      <h1>something here</h1>
    </div>
</div>

</body>
</html>