css-responsive-menu/index.html at master · datchung/css-responsive-menu · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>css-responsive-menu</title>
    <meta name="description" content="">
    <meta name="author" content="css-responsive-menu">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <link rel="stylesheet" href="vendor/skeleton/css/normalize.css" />
    <link rel="stylesheet" href="vendor/skeleton/css/skeleton.css" />
    <link rel="stylesheet" href="dist/css-responsive-menu.css" />
    <link rel="stylesheet" href="css/home.css" />
  </head>
  <body>
    <!--To fill the full browser width behind the menu-->
    <div class="menu-filler">

      <!--For skeleton-->
      <div class="container">
        <div class="row">
          <div class="twelve columns" id="page-top">

            <!--For css responsive menu-->
            <div class="css-responsive-menu">
              <label for="hidden-checkbox1" class="expand-control button">Menu</label>
              <input type="checkbox" id="hidden-checkbox1" class="expand-control">

              <ul class="navigation-list">
                <li><a href="getting-started.html">Getting Started</a></li>
                <li><a href="contribute.html">Contribute</a></li>
              </ul>
            </div>

          </div>
        </div>
      </div>

    </div>

    <div class="container">
      <div class="row">
        <div class="twelve columns topOfPage wrap-center">
          <h1><a href="index.html">css-responsive-menu</a></h1>
          <a class="button button-primary" href="https://github.com/datchung/css-responsive-menu/blob/master/dist/css-responsive-menu.zip?raw=true">Download</a>
          <p><a href="https://github.com/datchung/css-responsive-menu">GitHub</a></p>
        </div>
      </div>

      <div class="row">
        <div class="twelve columns">
          <h2>What is it?</h2>
          <p>
            A responsive navigation menu written in CSS, no JavaScript used. The styles are pretty barebones, only the required ones are implemented, which keeps things light. You can use your own styles on top of what is here to make it look how you want it to.
          </p>
          <p>
            In larger browser windows, the menu items are shown horizontally. In smaller browser windows, menu items are hidden until the 'Menu' is clicked. To see this in action, try resizing the width of your browser and observe the topmost menu bar.
          </p>

          <h2>Why?</h2>
          <p>
            While there are other responsive navigation menus available, most of them require JavaScript to function. This one doesn't.
          </p>
        </div>
      </div>

      <div class="row">
        <div class="twelve columns">
          Copyright 2014-2015 By Dat Chung
        </div>
      </div>
    </div>
  </body>
</html>