Stylistic changes re: links

BurntBrunch · Nov 27, 2011 · 757807b · 757807b
1 parent 2342bb6
commit 757807b
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 27 deletions.
diff --git a/html/css/style.css b/html/css/style.css
@@ -1,8 +1,19 @@
 body {
     background: #333;
-    color: #fff;
+    color: #ccc;
     font: 300 100.1% "Helvetica Neue", Helvetica, "Arial Unicode MS", Arial, sans-serif;
 }
+a{
+    text-decoration:none;
+    border-bottom: 1px dashed #ccc;
+    color: #ccc;
+}
+a:visited{
+}
+a:hover{
+    border-bottom: 1px solid #ccc;
+    color: #ccc;
+}
 #holder {
     float: left;
     min-height: 400px;
@@ -55,28 +66,26 @@ body {
     text-transform: capitalize;
     text-align: center;
 }
-p a {
-	color: #666;
+#menu {
+    text-align: center;
 }
 
-.city_hover
-{
-	position: absolute;
-	display: none;
-	padding-left: 10px;
-	width: auto;
-	z-index: 2;
-	background-image: url(../img/arrow.gif);
-	background-repeat: no-repeat;
-	background-position: 0 10px;
-}
+    #menu ul {
+        display: inline;
+        list-style:none;
+        text-transform: lowercase;
+        padding: 0;
+        margin: 0;
+    }
 
-.city_hover .c_label
-{
-	display: block;
-	padding: 10px;
-	color: #000;
-	background-color: #fff;
-	/* IE fix */
-	overflow: hidden;
-}
+    #menu ul li{
+        display: inline;
+        background-color: #444;
+        padding: 0.5em 0 0.5em 0.5em;
+        margin: 0;
+    }
+
+
+    #menu ul .last{
+        padding-right: 0.5em;
+    }
diff --git a/html/index.html b/html/index.html
@@ -5,7 +5,6 @@
         <title>Down the silk rabbit hole</title>
         <link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
         <script src="js/raphael.js" type="text/javascript"></script>
-        <script src="js/scale.raphael.js" type="text/javascript"></script>
         <script src="js/world.js" type="text/javascript"></script>
         <script src="js/countries.js" type="text/javascript"></script>
         <script src="js/stats_countries.js" type="text/javascript"></script>
@@ -33,7 +32,7 @@
                 append_country_stats(panel, ccode);
                 panel.fadeIn('fast');
             }
-            window.onload = function () {
+            $(function () {
 				var attr = {
 					fill: "#333",
 					stroke: "#666",
@@ -108,12 +107,18 @@
 					var y = (lat * yfactor) + yoffset;
 					return y;
 				}
-			};
+			});
         </script>
     </head>
     <body>
         <div id="title">Down the silk rabbit hole</div>
-        <div class="page">
+        <div id="menu"> Type:
+            <ul>
+            <li><a href="#">Map</a> 
+            <li class="last"><a href="#">Overall</a>
+            </ul>
+        </div>
+        <div class="page map">
             <div id="holder"></div>
             <div id="panel"></div> 
         </div>