starting to implement a docking nav?

This commit is contained in:
Dave Gamache
2014-12-01 20:05:29 -08:00
parent 4f8392275a
commit a4ab5f6f4e
3 changed files with 156 additions and 83 deletions

View File

@ -48,25 +48,63 @@
<div class="four columns offset-by-two value-prop">
<img class="value-img" src="images/feather.svg">
Light as a feather at less than a kb &amp; built with mobile in mind.
<!-- Attr: http://thenounproject.com/term/feather/22073/ -->
</div>
<div class="four columns value-prop">
<img class="value-img" src="images/pens.svg">
<!-- Attr: bottom pen - http://thenounproject.com/term/pen/32847/ -->
<!-- Attr: top pen - http://thenounproject.com/term/pen/21163/ -->
Styles designed to be a starting point, not a UI framework.
</div>
<div class="four columns value-prop">
<img class="value-img" src="images/watch.svg">
<!-- Attr: http://thenounproject.com/term/watch/48012/ -->
Quick to start with zero compiling or installing necessary.
</div>
</div>
</section>
<div class="social-bar">
</div>
<div class="navbar-spacer"></div>
<nav class="navbar">
<div class="container">
<ul class="navbar-list">
<li class="navbar-item"><a class="navbar-link" href="#">Intro</a></li>
<li class="navbar-item">
<a class="navbar-link" href="#" data-popover-id="codeNavPopover">Code</a>
<div id="codeNavPopover" class="popover">
<ul class="popover-list">
<li class="popover-item">
<a class="popover-link" href="#">Grid</a>
</li>
<li class="popover-item">
<a class="popover-link" href="#">Typography</a>
</li>
<li class="popover-item">
<a class="popover-link" href="#">Buttons</a>
</li>
<li class="popover-item">
<a class="popover-link" href="#">Forms</a>
</li>
<li class="popover-item">
<a class="popover-link" href="#">Lists</a>
</li>
<li class="popover-item">
<a class="popover-link" href="#">Code</a>
</li>
<li class="popover-item">
<a class="popover-link" href="#">Tables</a>
</li>
<li class="popover-item">
<a class="popover-link" href="#">Queries</a>
</li>
<li class="popover-item">
<a class="popover-link" href="#">Utilities</a>
</li>
</ul>
</div>
</li>
<li class="navbar-item"><a class="navbar-link" href="#">Examples</a></li>
<li class="navbar-item"><a class="navbar-link" href="#">License</a></li>
<li class="navbar-item"><a class="navbar-link" href="#">Colophon</a></li>
</ul>
</div>
</nav>
<!-- Why use Skeleton -->
<div class="docs-section">
@ -592,15 +630,6 @@
<p>Skeleton was built using <a href="http://www.sublimetext.com/3">Sublime Text 3</a> and designed with <a href="http://bohemiancoding.com/sketch/">Sketch</a>. The typeface <a href="http://www.google.com/fonts/specimen/Raleway">Raleway</a> was created by <a href="http://matt.cc/">Matt McInerney</a> and <a href="http://www.impallari.com/">Pablo Impallari</a>. Code highlighting by Google's Prettify library. Icons in the header are all derivative work of icon from <a href="thenounproject.com">The Noun Project</a>.<a href="http://thenounproject.com/term/feather/22073/"> Feather</a> by Zach VanDeHey, <a href="http://thenounproject.com/term/pen/21163/">Pen</a> (with cap) by Ed Harrison, <a href="http://thenounproject.com/term/pen/32847/">Pen</a> (with clicker) by Matthew Hall, and <a href="http://thenounproject.com/term/watch/48015/">Watch</a> by Julien Deveaux.</p>
</div>
<div class="code-toggler">
<span class="code-toggle"></span>
<span class="code-label">
Code
<span class="code-label-show">hidden</span>
<span class="code-label-hide">visible</span>
</span>
</div>
</div>
<!-- End Document