* add hr to examples and css

* add blockquote to css * Tweak calendar about text
tyraeltong · Nov 28, 2011 · 89419c0 · 89419c0
1 parent 4b460b4
commit 89419c0
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 6 deletions.
diff --git a/examples/bar.html b/examples/bar.html
@@ -109,6 +109,7 @@ <h1>Bar charts</h1>
         x-axis data is fixed. Scrolling bar charts are good for time series
         data - new data will appear on the right hand side and old will
         "drop-off" on the left.</p>
+      <hr/>
       <table width="100%">
         <tr>
           <td width="25%" align="center" valign="top">

diff --git a/examples/calendar.html b/examples/calendar.html
@@ -139,12 +139,14 @@
 	  <body>
 	    <div id="container">
 	      <h1>Calendar</h1>
-	      <p>The data used here is summarised FAA plane crash data from
-<a href='http://data.gov/'>data.gov</a> that I got from Mike Miller of
-<a href="http://blog.cloudant.com/mapreduce-from-the-basics-to-the-actually-useful/">Cloudant</a>.
-I munged it up so it's just date:number of crashes. The data is unsorted. See
-<a href="calendar.json">calendar.json</a> for the details. Days are coloured by
-the ratio of crashes to total number of crashes in the data set.</p>
+	      <p>This is a port of the <a href="http://mbostock.github.com/d3/ex/calendar.html">calendar
+	      example</a> from the d3 pages. The data used here is summarised FAA plane crash data from
+        <a href='http://data.gov/'>data.gov</a> that I got from Mike Miller of
+        <a href="http://blog.cloudant.com/mapreduce-from-the-basics-to-the-actually-useful/">Cloudant</a>.
+        I munged it up so it's just date:number of crashes. The data is unsorted. See
+        <a href="calendar.json">calendar.json</a> for the details. Days are coloured by
+        the ratio of crashes to total number of crashes in the data set.</p>
+        <hr/>
 	      <div id="calendar"></div>
 	      <div class="footer">
 		      <p><a href="index.html">Index</a></p>

diff --git a/examples/pie.html b/examples/pie.html
@@ -73,6 +73,7 @@ <h1>Pie charts</h1>
          Changing values in a collection causes the pie chart to update to the
          new ratios. Adding a value adds a new segment to the pie chart, and
          removing a value removes that segment.</p>
+      <hr/>
       <table width="100%">
         <tr>
           <td width="50%" align="center">

diff --git a/examples/style.css b/examples/style.css
@@ -79,3 +79,26 @@ h6 {
   margin: 0 auto;
   width: 700px;
 }
+hr {
+  width: 50%;
+  color: #484338;
+  background-color: #484338;
+  border: 0;
+  height: 1px;
+}
+blockquote {
+  quotes: "\201C" "\201D";
+  border: 1px dotted #cecece;
+  padding: 0.5em;
+  font-family: Helvetica Neue, Helvetica, Arial;
+  font-style:italic;
+}
+blockquote:before {
+  content: open-quote;
+  font-weight: bold;
+  font-size: 5em;
+  line-height: 1em;
+  font-family: Helvetica Neue, Helvetica, Arial;
+  float: left;
+  margin-right:0.2em;
+}