Commits

Anonymous committed 1c78008

Made the perl-for-newbies toggle control a <button />.

Also extracted the CSS into its own file.

Comments (0)

Files changed (2)

lib/perl-for-newbies.wml

 
 <page_extra_head_elements>
 <link rel="stylesheet" href="style.css" />
-<style type="text/css">
-a:hover { background-color: transparent; }
-.page-nav-bar, .bread { display: none; }
-.page-nav-bar.vis, .bread.vis { display: block; }
-</style>
+<link rel="stylesheet" href="$(ROOT)/p4n.css" />
 <script type="text/javascript" src="$(ROOT)/js/toggle-nav-controls.js"></script>
 </page_extra_head_elements>
 
-<p>
-<a id="toggle_nav_control" 
-href="javascript:toggle_nav_control()" 
-class="toggle_nav_control off">Show Navigation Controls</a>
-</p>
+<button id="toggle_nav_control" 
+onclick="javascript:toggle_nav_control()" 
+class="toggle_nav_control off">Show Navigation Controls</button>
 
 <:{
 {
+a:hover { background-color: transparent; }
+.page-nav-bar, .bread { display: none; }
+.page-nav-bar.vis, .bread.vis { display: block; }
+.toggle_nav_control, .toggle_nav_control:hover
+{
+    padding: 1em;
+    -moz-border-radius: 10px;
+    -webkit-border-radius: 10px;
+    border-radius: 10px;
+    border: 2pt solid black;
+}
+
+button.toggle_nav_control
+{
+    color: black;
+    text-decoration: none;
+}
+.toggle_nav_control
+{
+    border-color: black;
+    background-color: palegreen;
+}
+.toggle_nav_control:hover
+{
+    cursor: pointer;
+    border-color: red;
+    background-color: yellow;
+}
+