<div id="sidebar">
<div class="widget">
<div class="title">Navigation menu</div>
-
+ <div class="nav-menu">
+ <ul>
+ <li><a href="index.html"><span>Home</span></a></li>
+ <li><a href="control.html"><span>Experiment control</span></a></li>
+ <li><a href="pintest.html"><span>Pin debugging</span></a></li>
+ <li class="last"><a href="#"><span>Help</span></a></li>
+ </ul>
+ </div>
</div>
<div class="widget">
<div class="title">Help</div>
<div id="sidebar">
<div class="widget">
<div class="title">Navigation menu</div>
-
+ <div class="nav-menu">
+ <ul>
+ <li><a href="index.html"><span>Home</span></a></li>
+ <li><a href="control.html"><span>Experiment control</span></a></li>
+ <li><a href="pintest.html"><span>Pin debugging</span></a></li>
+ <li class="last"><a href="#"><span>Help</span></a></li>
+ </ul>
+ </div>
</div>
<div class="widget">
<div class="title">Help</div>
<p>
To explore how this system works, hover over the elements of the
system diagram below. Clicking each element will lead to a new
- page that describes that component of the system.
+ page that briefly describes that component of the system.
+ </p>
+ <p>
+ For the full documentation, see the project wiki at:
+ <a href="https://github.com/szmoore/MCTX3420/wiki">
+ https://github.com/szmoore/MCTX3420/wiki
+ </a>
</p>
<p>
To begin a new experiment, use the left navigation pane.
<div id="content">
<div id="sidebar">
+ <div class="widget">
+ <div class="title">Navigation menu</div>
+ <div class="nav-menu">
+ <ul>
+ <li><a href="index.html"><span>Home</span></a></li>
+ <li><a href="control.html"><span>Experiment control</span></a></li>
+ <li><a href="pintest.html"><span>Pin debugging</span></a></li>
+ <li class="last"><a href="#"><span>Help</span></a></li>
+ </ul>
+ </div>
+ </div>
<div class="widget">
<div class="title">Info</div>
<p>This test page gives control over the BBB's pins.
-/*
- Document : nav-menu
- Created on : 21/09/2013, 8:33:30 PM
- Author : Jeremy Tan
- Description:
- Navigation menu styling.
- Background colour: #2A2A2A
- Highlight colour: #f2f2f2
- Normal text colour: #bbbbbb
-*/
-
-/** Easing **/
.nav-menu {
- transition: all 0.2s ease 0s;
+ list-style: none;
+ margin: 0;
+ padding: 0;
}
-/** Main menu list styling **/
.nav-menu ul {
- list-style: none outside none;
+ padding: 0;
margin: 0;
- padding-left: 0;
- text-align: right;
}
-/** Menu item styling **/
.nav-menu li {
- display: inline-block;
- position: relative;
+ margin: 0;
+ padding: 0;
+ list-style: none;
}
-/** Link styling **/
.nav-menu a {
- background-color: #2A2A2A;
- border-radius: 2px;
- border: 1px solid #444444;
- color: #BBBBBB;
- display: inline-block;
- margin: 0.1em;
- padding: 0.2em 2em;
- text-decoration: none;
- transition: all 0.2s ease 0s;
-}
-
-/** Highlight currently hovered-over item **/
-.nav-menu li:hover > a {
- background-color: #f2f2f2;
+ border-bottom: 1px solid #ccc;
color: #2a2a2a;
-}
-
-/** Display submenu when hovering over list item **/
-.nav-menu ul li:hover > ul {
display: block;
+ margin: 0;
+ padding: 8px 12px;
+ text-decoration: none;
+ font-weight: normal;
}
-/** Submenu styling **/
-.nav-menu ul ul {
- background-color: #2A2A2A;
- border-radius: 2px;
- box-shadow: 1px 1px 1px #2A2A2A;
- display: none;
- left: 0;
- padding: 0.25em 0.5em;
- position: absolute;
- text-align: left;
- z-index: 10;
-}
-
-/** Submenu link styling **/
-.nav-menu ul ul a {
- width: 11em;
- padding: 0.25em 0.5em;
+.nav-menu a:hover {
+ background: #2580a2 url('hover.gif') left center no-repeat;
+ color: #fff;
+ padding-bottom: 8px;
}
-
-/**
- Style of menu:
- <div class="nav-menu">
- <ul class="menu">
- <li><a href="#">Link 1</a></li>
- <li><a href="#">Link 2</a></li>
- <li>
- <a href="#">Link 3</a>
- <ul class="submenu">
- <li><a href="#">Sub-link 1</a></li>
- <li><a href="#">Sub-link 2</a></li>
- </ul>
- </li>
- </ul>
- </div>
-*/
\ No newline at end of file