Merge pull request #309 from TomK32/master

Small improvements to make the web output valid HTML

hledger-web/Foundation.hs

@@ -124,12 +124,11 @@ instance Yesod App where
     --     hamletToRepHtml $(hamletFile "templates/default-layout-wrapper.hamlet")
 
         pc <- widgetToPageContent $ do
-            $(widgetFile "normalize")
             addStylesheet $ StaticR css_bootstrap_min_css
              -- load these things early, in HEAD:
             toWidgetHead [hamlet|
-                          <script type="text/javascript" src="@{StaticR js_jquery_min_js}"></script>
+                          <script type="text/javascript" src="@{StaticR js_jquery_min_js}">
-                          <script type="text/javascript" src="@{StaticR js_typeahead_bundle_min_js}"></script>
+                          <script type="text/javascript" src="@{StaticR js_typeahead_bundle_min_js}">
                          |]
             addScript $ StaticR js_bootstrap_min_js
             -- addScript $ StaticR js_typeahead_bundle_min_js
@@ -347,7 +346,9 @@ addform _ vd@VD{..} = [hamlet|
     ^{postingfields vd n}
   <span style="padding-left:2em;">
    <span .small>
-     Tab in last field for <a .small href="#" onclick="addformAddPosting(); return false;">more</a> (or ctrl +, ctrl -)
+     Tab in last field for
+     <a href="#" onclick="addformAddPosting(); return false;">more
+     (or ctrl +, ctrl -)
 |]
  where
   defdate = "today" :: String

hledger-web/Handler/Common.hs

@@ -138,7 +138,7 @@ searchform VD{..} = [hamlet|
 --   <tr#addbuttonrow>
 --    <td>
 --     <span.help>^{formathelp}
---    <td align=right>
+--    <td>
 --     <span.help>
 --      Are you sure ? This will overwrite the journal. #
 --     <input type=hidden name=action value=edit>
@@ -193,7 +193,7 @@ balanceReportAsHtml _ vd@VD{..} (items',total) =
    <td colspan=2>
   <tr>
    <td>
-   <td.balance align=right>#{mixedAmountAsHtml total}
+   <td.balance>#{mixedAmountAsHtml total}
 |]
  where
    l = ledgerFromJournal Any j
@@ -210,11 +210,11 @@ balanceReportAsHtml _ vd@VD{..} (items',total) =
      &nbsp;
      <a href="@?{acctonlyquery}" title="Show transactions affecting this account but not subaccounts">only
 
- <td.balance align=right>#{mixedAmountAsHtml abal}
+ <td.balance>#{mixedAmountAsHtml abal}
 |]
      where
        hassubs = not $ maybe False (null.asubs) $ ledgerAccount l acct
- -- <td.numpostings align=right title="#{numpostings} transactions in this account">(#{numpostings})
+ -- <td.numpostings title="#{numpostings} transactions in this account">(#{numpostings})
        -- numpostings = maybe 0 (length.apostings) $ ledgerAccount l acct
        depthclass = "depth"++show aindent
        inacctclass = case inacctmatcher of

hledger-web/Handler/JournalR.hs

@@ -35,7 +35,7 @@ getJournalR = do
   hledgerLayout vd "journal" [hamlet|
        <h2#contenttitle>#{title}
        <!-- p>Journal entries record movements of commodities between accounts. -->
-       <a#addformlink role="button" style="cursor:pointer;" onClick="addformReset(true);" data-toggle="modal" data-target="#addmodal"  title="Add a new transaction to the journal" style="margin-top:1em;">Add a transaction
+       <a#addformlink role="button" style="cursor:pointer; margin-top:1em;" onClick="addformReset(true);" data-toggle="modal" data-target="#addmodal"  itle="Add a new transaction to the journal" >Add a transaction
        ^{maincontent}
      |]
 
@@ -59,26 +59,27 @@ journalTransactionsReportAsHtml _ vd (_,items) = [hamlet|
  where
 -- .#{datetransition}
    itemAsHtml :: ViewData -> (Int, Bool, Bool, Bool, TransactionsReportItem) -> HtmlUrl AppRoute
-   itemAsHtml VD{..} (n, _, _, _, (t, _, split, _, amt, _)) = [hamlet|
+   itemAsHtml VD{..} (n, _, _, _, (torig, _, split, _, amt, _)) = [hamlet|
-<tr ##{date} .item.#{evenodd}.#{firstposting} style="vertical-align:top;" title="#{show t}">
+<tbody ##{tindex torig}>
- <td.date>#{date}
+  <tr .item.#{evenodd}.#{firstposting} style="vertical-align:top;" title="#{show torig}">
- <td.description colspan=2>#{elideRight 60 desc}
+   <td.date>#{date}
- <td.amount style="text-align:right;">
+   <td.description colspan=2>#{elideRight 60 desc}
-  $if showamt
+   <td.amount style="text-align:right;">
-   \#{mixedAmountAsHtml amt}
+    $if showamt
-$forall p' <- tpostings t
+     \#{mixedAmountAsHtml amt}
- <tr .item.#{evenodd}.posting title="#{show t}">
+  $forall p' <- tpostings torig
-  <td.date>
+   <tr .item.#{evenodd}.posting title="#{show torig}">
-  <td.description>
+    <td.date>
-  <td.account>
+    <td.description>
-   &nbsp;
+    <td.account>
-   <a href="@?{acctlink (paccount p')}##{date}" title="#{paccount p'}">#{elideAccountName 40 $ paccount p'}
+     &nbsp;
-  <td.amount style="text-align:right;">#{mixedAmountAsHtml $ pamount p'}
+     <a href="@?{acctlink (paccount p')}##{tindex torig}" title="#{paccount p'}">#{elideAccountName 40 $ paccount p'}
-<tr.#{evenodd}>
+    <td.amount style="text-align:right;">#{mixedAmountAsHtml $ pamount p'}
- <td>&nbsp;
+  <tr.#{evenodd}>
- <td>
+   <td>&nbsp;
- <td>
+   <td>
- <td>
+   <td>
+   <td>
 |]
      where
        acctlink a = (RegisterR, [("q", pack $ accountQuery a)])
@@ -86,7 +87,7 @@ $forall p' <- tpostings t
        -- datetransition | newm = "newmonth"
        --                | newd = "newday"
        --                | otherwise = "" :: String
-       (firstposting, date, desc) = (False, show $ tdate t, tdescription t)
+       (firstposting, date, desc) = (False, show $ tdate torig, tdescription torig)
        -- acctquery = (here, [("q", pack $ accountQuery acct)])
        showamt = not split || not (isZeroMixedAmount amt)
 

hledger-web/Handler/RegisterR.hs

@@ -73,8 +73,9 @@ registerItemsHtml _ vd (balancelabel,items) = [hamlet|
    itemAsHtml :: ViewData -> (Int, Bool, Bool, Bool, TransactionsReportItem) -> HtmlUrl AppRoute
    itemAsHtml VD{..} (n, newd, newm, _, (torig, tacct, split, acct, amt, bal)) = [hamlet|
 
-<tr ##{date} .item.#{evenodd}.#{firstposting}.#{datetransition} title="#{show torig}" style="vertical-align:top;">
+<tr ##{tindex torig} .item.#{evenodd}.#{firstposting}.#{datetransition} title="#{show torig}" style="vertical-align:top;">
- <td.date><a href="@{JournalR}##{date}">#{date}
+ <td.date>
+  <a href="@{JournalR}##{tindex torig}">#{date}
  <td.description title="#{show torig}">#{elideRight 30 desc}
  <td.account>#{elideRight 40 acct}
  <td.amount style="text-align:right; white-space:nowrap;">
@@ -119,7 +120,7 @@ registerChartHtml percommoditytxnreports =
           $forall i <- reverse items
            [
             #{dayToJsTimestamp $ triDate i},
-            #{simpleMixedAmountQuantity $ triCommodityBalance c i},
+            #{simpleMixedAmountQuantity $ triCommodityBalance c i}
            ],
           /* [] */
         ],
@@ -145,6 +146,7 @@ registerChartHtml percommoditytxnreports =
             '#{showMixedAmountWithZeroCommodity $ triCommodityAmount c i}',
             '#{showMixedAmountWithZeroCommodity $ triCommodityBalance c i}',
             '#{concat $ intersperse "\\n" $ lines  $ show $ triOrigTransaction i}',
+            #{tindex $ triOrigTransaction i}
            ],
           /* [] */
         ],

hledger-web/hledger-web.cabal

@@ -92,10 +92,6 @@ extra-source-files:
       static/js/typeahead.bundle.min.js
       templates/default-layout-wrapper.hamlet
       templates/default-layout.hamlet
-      templates/homepage.hamlet
-      templates/homepage.julius
-      templates/homepage.lucius
-      templates/normalize.lucius
 
 source-repository head
     type: git

hledger-web/package.yaml

@@ -98,10 +98,6 @@ extra-source-files:
   - static/js/typeahead.bundle.min.js
   - templates/default-layout-wrapper.hamlet
   - templates/default-layout.hamlet
-  - templates/homepage.hamlet
-  - templates/homepage.julius
-  - templates/homepage.lucius
-  - templates/normalize.lucius
 
 # XXX not supported
 # flag threaded

hledger-web/static/hledger.css

@@ -8,7 +8,7 @@ body                                                                 { backgroun
 .registerreport .odd                                                 { background-color:#ded; }
 /* .transactionsreport .odd                                             { background-color:#eee; } */
 .filtering                                                           { background-color:#e0e0e0; }
-a:link, a:visited { color:#00e; }
+a:link, a:visited { color:#00e !important; }
 /* a:link:hover, a:visited:hover { color:red; } */
 /* #main                                                                { border-color:#e0e0e0; } see below */
 /* .journalreport td                                                    { border-color:thin solid #e0e0e0; } see below */
@@ -25,6 +25,9 @@ a:link, a:visited { color:#00e; }
 #editform textarea                                                   { background-color:#eee; }
 .negative                                                            { color:#800; }
 .help                                                                {  }
+.highlighted {
+  background-color: #F4F466 !important;
+}
 
 #sidebar .hoverlinks { visibility:hidden; }
 /* #sidebar .mouseover { background-color:rgba(208,208,208,0.5); } */
@@ -119,10 +122,15 @@ body                        { margin:0; }
 .description                { padding-left:1em; white-space:normal; }
 .account                    { padding-left:1em; white-space:normal; }
 .amount                     { padding-left:1em; white-space:nowrap; }
-.balance                    { padding-left:1em; padding-right:0.3em; white-space:nowrap; }
+.balance                    { padding-left:1em; white-space:nowrap; }
+tr td:last-child { padding-right:0.3em; }
+tr td:first-child { padding-left:0.3em; }
 .amount, .balance { width:2em; }  /* minimise width */
 .positive                   { }
 
+td.balance, td.numpostings {
+  text-align: right;
+}
 /* table.transactionsreport         { border-spacing: 0; } */
 /* .transactionsreport td           {  } */
 /* .transactionsreport pre          { margin-top:0; } */
@@ -259,4 +267,9 @@ tr.firstposting td          { }
 
 .twitter-typeahead {
   width:100%;
-}
+}
+
+code {
+  font-weight: bold;
+  color: black;
+}

hledger-web/static/hledger.js

@@ -26,6 +26,15 @@ $(document).ready(function() {
   $('body, #addform input, #addform select').bind('keydown', 'ctrl+-',       addformDeletePosting);
   $('#addform tr.posting:last > td:first input').bind('keydown', 'tab', addformAddPostingWithTab);
 
+
+  // highlight the entry from the url hash
+  if (window.location.hash && $(window.location.hash)[0]) {
+    $(window.location.hash).addClass('highlighted');
+  }
+  $(window).on('hashchange', function(event) {
+    $('.highlighted').removeClass('highlighted');
+    $(window.location.hash).addClass('highlighted');
+  });
 });
 
 //----------------------------------------------------------------------
@@ -36,58 +45,39 @@ function registerChart($container, series) {
   return $container.plot(
     series,
     { /* general chart options */
-      // series: {
-      // },
-      // yaxis: {
-      //   /* ticks: 6, */
-      // },
       xaxis: {
         mode: "time",
         timeformat: "%Y/%m/%d"
-        /* ticks: 6, */
+      },
+      legend: {
+        position: 'sw'
       },
       grid: {
         markings:
          function (axes) {
           var now = Date.now();
           var markings = [
-            // {
-            //   xaxis: { to: now },        // past
-            //   yaxis: { from: 0, to: 0 }, // =0
-            //  color: '#d88',
-            //  lineWidth:1
-            // },
             {
               xaxis: { to: now }, // past
               yaxis: { to: 0 },   // <0
               color: '#ffdddd',
             },
-
-            // {
-            //   xaxis: { from: now, to: now }, // now
-            //  color: '#bbb',
-            // },
-
             {
               xaxis: { from: now }, // future
               yaxis: { from: 0 },   // >0
-              // color: '#dddddd',
               color: '#e0e0e0',
             },
             {
               xaxis: { from: now }, // future
               yaxis: { to: 0 },     // <0
-              // color: '#ddbbbb',
               color: '#e8c8c8',
             },
             {
-              // xaxis: { from: now },      // future
               yaxis: { from: 0, to: 0 }, // =0
               color: '#bb0000',
               lineWidth:1
             },
           ];
-          // console.log(markings);
           return markings;
         },
         hoverable: true,
@@ -113,13 +103,14 @@ function registerChart($container, series) {
 
 function registerChartClick(ev, pos, item) {
   if (item) {
-    var date = $.plot.dateGenerator(item.datapoint[0], {});
+    targetselector = '#'+item.series.data[item.dataIndex][5];
-    var dateid = $.plot.formatDate(date, '%Y-%m-%d');
+    $target = $(targetselector);
-    $target = $('#'+dateid);
+    if ($target.length) {
-    if ($target.length)
+      window.location.hash = targetselector;
       $('html, body').animate({
         scrollTop: $target.offset().top
       }, 1000);
+    }
   }
 }
 
@@ -254,33 +245,20 @@ function addformDeletePosting() {
 // SIDEBAR
 
 function sidebarToggle() {
-  //console.log('sidebarToggle');
   var visible = $('#sidebar').is(':visible');
-  //console.log('sidebar visibility was',visible);
   // if opening sidebar, start an ajax fetch of its content
   if (!visible) {
-    //console.log('getting sidebar content');
     $.get("sidebar"
          ,null
          ,function(data) {
-            //console.log( "success" );
             $("#sidebar-body" ).html(data);
           })
-          .done(function() {
-            //console.log( "success 2" );
-          })
           .fail(function() {
-            //console.log( "error" );
+            alert("Loading the sidebar did fail");
           });
   }
-  // localStorage.setItem('sidebarVisible', !visible);
   // set a cookie to communicate the new sidebar state to the server
   $.cookie('showsidebar', visible ? '0' : '1');
-  // horizontally slide the sidebar in or out
-  // how to make it smooth, without delayed content pop-in ?
-  //$('#sidebar').animate({'width': 'toggle'});
-  //$('#sidebar').animate({'width': visible ? 'hide' : '+=20m'});
-  //$('#sidebar-spacer').width(200);
   $('#sidebar').animate({'width': visible ? 'hide' : 'show'});
 }
 

hledger-web/templates/default-layout-wrapper.hamlet

@@ -61,11 +61,11 @@ $newline never
                     <p>
                       <b>Keyboard shortcuts
                       <ul>
-                        <li> <b><tt>h</tt></b> or maybe <b><tt>?</tt></b> - view this help (escape or click to exit)
+                        <li> <code>h</code> or maybe <code>?</code> - view this help (escape or click to exit)
-                        <li> <b><tt>j</tt></b> - go to the Journal view (home)
+                        <li> <code>j</code> - go to the Journal view (home)
-                        <li> <b><tt>a</tt></b> - add a transaction (escape to cancel)
+                        <li> <code>a</code> - add a transaction (escape to cancel)
-                        <li> <b><tt>s</tt></b> - toggle sidebar
+                        <li> <code>s</code> - toggle sidebar
-                        <li> <b><tt>f</tt></b> - focus search form ("find")
+                        <li> <code>f</code> - focus search form ("find")
                     <p>
                       <b>General
                       <ul>
@@ -79,19 +79,19 @@ $newline never
                     <p>
                       <b>Search
                       <ul>
-                        <li> <b><tt>acct:REGEXP</tt></b> - filter on to/from account
+                        <li> <code>acct:REGEXP</code> - filter on to/from account
-                        <li> <b><tt>desc:REGEXP</tt></b> - filter on description
+                        <li> <code>desc:REGEXP</code> - filter on description
-                        <li> <b><tt>date:PERIODEXP</tt></b>, <b><tt>date2:PERIODEXP</tt></b> - filter on date or secondary date
+                        <li> <code>date:PERIODEXP</code>, <code>date2:PERIODEXP</code> - filter on date or secondary date
-                        <li> <b><tt>code:REGEXP</tt></b> - filter on transaction's code (eg check number)
+                        <li> <code>code:REGEXP</code> - filter on transaction's code (eg check number)
-                        <li> <b><tt>status:*</tt></b>, <b><tt>status:!</tt></b>, <b><tt>status:</tt></b> - filter on transaction's cleared status (cleared, pending, uncleared)
+                        <li> <code>status:*</code>, <code>status:!</code>, <code>status:</code> - filter on transaction's cleared status (cleared, pending, uncleared)
-                        <!-- <li> <b><tt>empty:BOOL</tt></b> - filter on whether amount is zero -->
+                        <!-- <li> <code>empty:BOOL</code> - filter on whether amount is zero -->
-                        <li> <b><tt>amt:N</tt></b>, <b><tt>amt:&lt;N</tt></b>, <b><tt>amt:&gt;N</tt></b> - filter on the unsigned amount magnitude. Or with a sign before N, filter on the signed value. (Single-commodity amounts only.)
+                        <li> <code>amt:N</code>, <code>amt:&lt;N</code>, <code>amt:&gt;N</code> - filter on the unsigned amount magnitude. Or with a sign before N, filter on the signed value. (Single-commodity amounts only.)
-                        <li> <b><tt>cur:REGEXP</tt></b> - filter on the currency/commodity symbol (must match all of it). Dollar sign must be written as <tt>\$</tt>
+                        <li> <code>cur:REGEXP</code> - filter on the currency/commodity symbol (must match all of it). Dollar sign must be written as <code>\$</code>
-                        <li> <b><tt>tag:NAME</tt></b>, <b><tt>tag:NAME=REGEX</tt></b> - filter on tag name, or tag name and value
+                        <li> <code>tag:NAME</code>, <code>tag:NAME=REGEX</code> - filter on tag name, or tag name and value
-                        <!-- <li> <b><tt>depth:N</tt></b> - filter out accounts below this depth -->
+                        <!-- <li> <code>depth:N</code> - filter out accounts below this depth -->
-                        <li> <b><tt>real:BOOL</tt></b> - filter on postings' real/virtual-ness
+                        <li> <code>real:BOOL</code> - filter on postings' real/virtual-ness
                         <li> Enclose search patterns containing spaces in single or double quotes
-                        <li> Prepend <b><tt>not:</tt></b> to negate a search term
+                        <li> Prepend <code>not:</code> to negate a search term
                         <li> Multiple search terms on different fields are AND'ed, multiple search terms on the same field are OR'ed
                         <li> These search terms also work with command-line hledger
 

hledger-web/templates/homepage.hamlet

@@ -1,38 +0,0 @@
-<h1>_{MsgHello}
-
-<ol>
-  <li>Now that you have a working project you should use the #
-    \<a href="http://www.yesodweb.com/book/">Yesod book</a> to learn more. #
-    You can also use this scaffolded site to explore some basic concepts.
-
-  <li> This page was generated by the #{handlerName} handler in #
-    \<em>Handler/Home.hs</em>.
-
-  <li> The #{handlerName} handler is set to generate your site's home screen in Routes file #
-    <em>config/routes
-
-  <li> The HTML you are seeing now is actually composed by a number of <em>widgets</em>, #
-    most of them are brought together by the <em>defaultLayout</em> function which #
-    is defined in the <em>Foundation.hs</em> module, and used by <em>#{handlerName}</em>. #
-    All the files for templates and wigdets are in <em>templates</em>.
-
-  <li>
-    A Widget's Html, Css and Javascript are separated in three files with the #
-    \<em>.hamlet</em>, <em>.lucius</em> and <em>.julius</em> extensions. 
-
-  <li ##{aDomId}>If you had javascript enabled then you wouldn't be seeing this.
-    
-  <li #form>
-    This is an example trivial Form. Read the #
-    \<a href="http://www.yesodweb.com/book/forms">Forms chapter</a> #
-    on the yesod book to learn more about them.
-    $maybe (info,con) <- submission
-      <div .message>
-        Your file's type was <em>#{fileContentType info}</em>. You say it has: <em>#{con}</em>
-    <form method=post action=@{HomeR}#form enctype=#{formEnctype}>
-      ^{formWidget}
-      <input type="submit" value="Send it!">
-
-  <li> And last but not least, Testing. In <em>tests/main.hs</em> you will find a #
-    test suite that performs tests on this page. #
-    You can run your tests by doing: <pre>yesod test</pre>

hledger-web/templates/homepage.julius

@@ -1 +0,0 @@
-document.getElementById("#{aDomId}").innerHTML = "This text was added by the Javascript part of the homepage widget.";

hledger-web/templates/homepage.lucius

@@ -1,6 +0,0 @@
-h1 {
-    text-align: center
-}
-h2##{aDomId} {
-    color: #990
-}

hledger-web/templates/normalize.lucius

@@ -1,439 +0,0 @@
-/*! normalize.css 2011-08-12T17:28 UTC · http://github.com/necolas/normalize.css */
-
-/* =============================================================================
-   HTML5 display definitions
-   ========================================================================== */
-
-/*
- * Corrects block display not defined in IE6/7/8/9 & FF3
- */
-
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-nav,
-section {
-    display: block;
-}
-
-/*
- * Corrects inline-block display not defined in IE6/7/8/9 & FF3
- */
-
-audio,
-canvas,
-video {
-    display: inline-block;
-    *display: inline;
-    *zoom: 1;
-}
-
-/*
- * Prevents modern browsers from displaying 'audio' without controls
- */
-
-audio:not([controls]) {
-    display: none;
-}
-
-/*
- * Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4
- * Known issue: no IE6 support
- */
-
-[hidden] {
-    display: none;
-}
-
-
-/* =============================================================================
-   Base
-   ========================================================================== */
-
-/*
- * 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
- *    http://clagnut.com/blog/348/#c790
- * 2. Keeps page centred in all browsers regardless of content height
- * 3. Prevents iOS text size adjust after orientation change, without disabling user zoom
- *    www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
- */
-
-html {
-    font-size: 100%; /* 1 */
-    overflow-y: scroll; /* 2 */
-    -webkit-text-size-adjust: 100%; /* 3 */
-    -ms-text-size-adjust: 100%; /* 3 */
-}
-
-/*
- * Addresses margins handled incorrectly in IE6/7
- */
-
-body {
-    margin: 0;
-}
-
-/* 
- * Addresses font-family inconsistency between 'textarea' and other form elements.
- */
-
-body,
-button,
-input,
-select,
-textarea {
-    font-family: sans-serif;
-}
-
-
-/* =============================================================================
-   Links
-   ========================================================================== */
-
-a {
-    color: #00e;
-}
-
-a:visited {
-    color: #551a8b;
-}
-
-/*
- * Addresses outline displayed oddly in Chrome
- */
-
-a:focus {
-    outline: thin dotted;
-}
-
-/*
- * Improves readability when focused and also mouse hovered in all browsers
- * people.opera.com/patrickl/experiments/keyboard/test
- */
-
-a:hover,
-a:active {
-    outline: 0;
-}
-
-
-/* =============================================================================
-   Typography
-   ========================================================================== */
-
-/*
- * Addresses styling not present in IE7/8/9, S5, Chrome
- */
-
-abbr[title] {
-    border-bottom: 1px dotted;
-}
-
-/*
- * Addresses style set to 'bolder' in FF3/4, S4/5, Chrome
-*/
-
-b, 
-strong { 
-    font-weight: bold; 
-}
-
-blockquote {
-    margin: 1em 40px;
-}
-
-/*
- * Addresses styling not present in S5, Chrome
- */
-
-dfn {
-    font-style: italic;
-}
-
-/*
- * Addresses styling not present in IE6/7/8/9
- */
-
-mark {
-    background: #ff0;
-    color: #000;
-}
-
-/*
- * Corrects font family set oddly in IE6, S4/5, Chrome
- * en.wikipedia.org/wiki/User:Davidgothberg/Test59
- */
-
-pre,
-code,
-kbd,
-samp {
-    font-family: monospace, serif;
-    _font-family: 'courier new', monospace;
-    font-size: 1em;
-}
-
-/*
- * Improves readability of pre-formatted text in all browsers
- */
-
-pre {
-    white-space: pre;
-    white-space: pre-wrap;
-    word-wrap: break-word;
-}
-
-/*
- * 1. Addresses CSS quotes not supported in IE6/7
- * 2. Addresses quote property not supported in S4
- */
-
-/* 1 */
-
-q {
-    quotes: none;
-}
-
-/* 2 */
-
-q:before,
-q:after {
-    content: '';
-    content: none;
-}
-
-small {
-    font-size: 75%;
-}
-
-/*
- * Prevents sub and sup affecting line-height in all browsers
- * gist.github.com/413930
- */
-
-sub,
-sup {
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
-}
-
-sup {
-    top: -0.5em;
-}
-
-sub {
-    bottom: -0.25em;
-}
-
-
-/* =============================================================================
-   Lists
-   ========================================================================== */
-
-ul,
-ol {
-    margin: 1em 0;
-    padding: 0 0 0 40px;
-}
-
-dd {
-    margin: 0 0 0 40px;
-}
-
-nav ul,
-nav ol {
-    list-style: none;
-    list-style-image: none;
-}
-
-
-/* =============================================================================
-   Embedded content
-   ========================================================================== */
-
-/*
- * 1. Removes border when inside 'a' element in IE6/7/8/9
- * 2. Improves image quality when scaled in IE7
- *    code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
- */
-
-img {
-    border: 0; /* 1 */
-    -ms-interpolation-mode: bicubic; /* 2 */
-}
-
-/*
- * Corrects overflow displayed oddly in IE9 
- */
-
-svg:not(:root) {
-    overflow: hidden;
-}
-
-
-/* =============================================================================
-   Figures
-   ========================================================================== */
-
-/*
- * Addresses margin not present in IE6/7/8/9, S5, O11
- */
-
-figure {
-    margin: 0;
-}
-
-
-/* =============================================================================
-   Forms
-   ========================================================================== */
-
-/*
- * Corrects margin displayed oddly in IE6/7
- */
-
-form {
-    margin: 0;
-}
-
-/*
- * Define consistent margin and padding
- */
-
-fieldset {
-    margin: 0 2px;
-    padding: 0.35em 0.625em 0.75em;
-}
-
-/*
- * 1. Corrects color not being inherited in IE6/7/8/9
- * 2. Corrects alignment displayed oddly in IE6/7
- */
-
-legend {
-    border: 0; /* 1 */
-    *margin-left: -7px; /* 2 */
-}
-
-/*
- * 1. Corrects font size not being inherited in all browsers
- * 2. Addresses margins set differently in IE6/7, F3/4, S5, Chrome
- * 3. Improves appearance and consistency in all browsers
- */
-
-button,
-input,
-select,
-textarea {
-    font-size: 100%; /* 1 */
-    margin: 0; /* 2 */
-    vertical-align: baseline; /* 3 */
-    *vertical-align: middle; /* 3 */
-}
-
-/*
- * 1. Addresses FF3/4 setting line-height using !important in the UA stylesheet
- * 2. Corrects inner spacing displayed oddly in IE6/7
- */
-
-button,
-input {
-    line-height: normal; /* 1 */
-    *overflow: visible;  /* 2 */
-}
-
-/*
- * Corrects overlap and whitespace issue for buttons and inputs in IE6/7
- * Known issue: reintroduces inner spacing
- */
-
-table button,
-table input {
-    *overflow: auto;
-}
-
-/*
- * 1. Improves usability and consistency of cursor style between image-type 'input' and others
- * 2. Corrects inability to style clickable 'input' types in iOS
- */
-
-button,
-html input[type="button"], 
-input[type="reset"], 
-input[type="submit"] {
-    cursor: pointer; /* 1 */
-    -webkit-appearance: button; /* 2 */
-}
-
-/*
- * 1. Addresses box sizing set to content-box in IE8/9
- * 2. Addresses excess padding in IE8/9
- */
-
-input[type="checkbox"],
-input[type="radio"] {
-    box-sizing: border-box; /* 1 */
-    padding: 0; /* 2 */
-}
-
-/*
- * 1. Addresses appearance set to searchfield in S5, Chrome
- * 2. Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof)
- */
-
-input[type="search"] {
-    -webkit-appearance: textfield; /* 1 */
-    -moz-box-sizing: content-box;
-    -webkit-box-sizing: content-box; /* 2 */
-    box-sizing: content-box;
-}
-
-/*
- * Corrects inner padding displayed oddly in S5, Chrome on OSX
- */
-
-input[type="search"]::-webkit-search-decoration {
-    -webkit-appearance: none;
-}
-
-/*
- * Corrects inner padding and border displayed oddly in FF3/4
- * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
- */
-
-button::-moz-focus-inner,
-input::-moz-focus-inner {
-    border: 0;
-    padding: 0;
-}
-
-/*
- * 1. Removes default vertical scrollbar in IE6/7/8/9
- * 2. Improves readability and alignment in all browsers
- */
-
-textarea {
-    overflow: auto; /* 1 */
-    vertical-align: top; /* 2 */
-}
-
-
-/* =============================================================================
-   Tables
-   ========================================================================== */
-
-/* 
- * Remove most spacing between table cells
- */
-
-table {
-    border-collapse: collapse;
-    border-spacing: 0;
-}