Skip to content

Instantly share code, notes, and snippets.

@NickersF

NickersF/gnTemplate

Created January 4, 2015 05:26
Show Gist options
  • Save NickersF/7c6dd20ad8119def2762 to your computer and use it in GitHub Desktop.
Save NickersF/7c6dd20ad8119def2762 to your computer and use it in GitHub Desktop.
Download ZIP
building a Google Nexus Website style menu (from tutorial)
Raw
gnTemplate
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Google Nexus Website Menu</title>
<meta name="description" content="A sidebar menu as seen on the Google Nexus 7 website" />
<meta name="keywords" content="google nexus 7 menu, css transitions, sidebar, side menu, slide out menu" />
<meta name="author" content="Codrops/crAmz0r" />
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/demo.css" />
<link rel="stylesheet" type="text/css" href="css/component.css" />
<script src="js/modernizr.custom.js"></script>
</head>
<body>
<ul id="gn-menu" class="gn-menu-main">
<li class="gn-trigger">
<a class="gn-icon gn-icon-menu"><span>Menu</span></a>
<nav class="gn-menu-wrapper">
<div class="gn-scroller">
<ul class="gn-menu">
<li class="gn-search-item">
<input placeholder="Search" type="search" class="gn-search">
<a class="gn-icon gn-icon-search"><span>Search</span></a>
</li>
<li>
<a class="gn-icon gn-icon-download">Downloads</a>
<ul class="gn-submenu">
<li><a class="gn-icon gn-icon-illustator">Vector Illustrations</a></li>
<li><a class="gn-icon gn-icon-photoshop">Photoshop Files</a></li>
</ul>
</li>
<li><a class="gn-icon gn-icon-cog">Settings</a></li>
<li><!-- ... --></li>
<!-- ... -->
</ul>
</div><!-- /gn-scroller -->
</nav>
</li>
<li><a href="http://www.btsource.net/">Btsource</a></li>
<li><!-- ... --></li>
<!-- ... -->
</ul>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment