Little unecessary tweaks

tristen · Apr 5, 2012 · cde0e92 · cde0e92
1 parent 0748237
commit cde0e92
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 28 deletions.
diff --git a/index.html b/index.html
@@ -4,31 +4,11 @@
 <meta charset=utf-8 />
 <title>Modal component for wax.mm.js</title>
 <link rel='stylesheet' href='site.css'>
-<script src='wax/modestmaps.min.js'></script>
-<script src='wax/wax.mm.min.js'></script>
-<script src='wax/modal.js'></script>
-<script>
-  var mm = com.modestmaps;
-  var url = 'http://api.tiles.mapbox.com/v3/mapbox.mapbox-streets.jsonp';
-  wax.tilejson(url, function(tilejson) {
-      m = new mm.Map('map',
-          new wax.mm.connector(tilejson), null, [
-              new mm.MouseHandler(),
-              new mm.TouchHandler()
-          ]
-      );
-      var form = document.getElementById('modal-content').innerHTML;
-      wax.mm.modal(m, form, {
-        linkTitle: 'Click me'
-        }).appendTo(m.parent);
-      m.setCenterZoom(new mm.Location(43.6478,280.6421),13);
-  });
-</script>
 </head>
 <body>
   <div class='heading'>
-    <h1>wax.mm.modal demo</h1>
-    <p>Click the link at the bottom right-hand corner. <br />Fork or clone to improve or use the little script <a href='https://github.com/tristen/wax.mm.modal/blob/gh-pages/wax/modal.js'>here</a></p>
+    <h1>wax.mm.modal</h1>
+    <p><a href='http://mapbox.com/wax'>Wax</a> plugin for markers with <a href='http://modestmaps.com'>Modest Maps</a>. Click anywhere. <br />Fork to improve or use the little script <a href='https://github.com/tristen/wax.mm.marker/blob/gh-pages/wax.mm.modal.js'>here</a>.</p>
   </div>
   <div id='map'></div>
   <div id='modal-content'>
@@ -67,5 +47,26 @@ <h2>Usage</h2>
 });</code></pre>
       </div>
     </div>
+
+<script src='wax/modestmaps.min.js'></script>
+<script src='wax/wax.mm.min.js'></script>
+<script src='wax.mm.modal.js'></script>
+<script>
+  var mm = com.modestmaps;
+  var url = 'http://api.tiles.mapbox.com/v3/mapbox.mapbox-streets.jsonp';
+  wax.tilejson(url, function(tilejson) {
+      m = new mm.Map('map',
+          new wax.mm.connector(tilejson), null, [
+              new mm.MouseHandler(),
+              new mm.TouchHandler()
+          ]
+      );
+      var form = document.getElementById('modal-content').innerHTML;
+      wax.mm.modal(m, form, {
+        linkTitle: 'Click me'
+        }).appendTo(m.parent);
+      m.setCenterZoom(new mm.Location(43.6478,280.6421),13);
+  });
+</script>
 </body>
 </html>
diff --git a/site.css b/site.css
@@ -40,6 +40,7 @@ table { border-collapse: collapse; border-spacing: 0; }
 :focus { outline: 0; }
 
 body {
+  background: #f5f5f5;
   font: normal 13px/18px 'Helvetica Neue',Helvetica,Verdana,Arial,sans-serif;
   color: #404040;
   margin: 0;
@@ -55,7 +56,7 @@ h1 {
 h2 {
   font-size: 18px;
   margin: 10px 0;
-  font-weight: 400;
+  font-weight: bold;
   }
 h3 {
   font-size: 16px;
@@ -71,8 +72,8 @@ pre code {
   font-family: 'Menlo Regular',Consolas,monospace;
   }
 pre {
-  background: #EBF5FF;
-  font-size: 12px;
+  background: #feffe8;
+  font-size: 13px;
   margin: 10px 0;
   overflow: auto;
   padding: 10px;
@@ -97,14 +98,17 @@ ul {
     }
 
 .heading {
-  background: #fff;
-  border: 1px solid #ccc;
+  background: rgba(255,255,255,0.95);
+  border: 1px solid #999;
+  text-shadow: 0 1px 0 #fff;
+  -moz-box-shadow: rgba(0,0,0,0.25) 0 0 8px;
+  box-shadow: rgba(0,0,0,0.25) 0 0 8px;
   position: absolute;
   top: 20px;
   left: 20px;
   padding: 20px;
   z-index: 100;
-  width: 320px;
+  width: 358px;
   }
 #map {
   position: absolute;

diff --git a/wax/modal.js → wax.mm.modal.js b/wax/modal.js → wax.mm.modal.js