From a3e22b6d605b2a50168d1aa856e6a22c4f515526 Mon Sep 17 00:00:00 2001
From: Mike Gerwitz <mike@mikegerwitz.com>
Date: Sat, 24 Mar 2012 21:03:07 -0400
Subject: [PATCH] Added title support to dialogs

---
 index.html |  2 ++
 style.css  | 13 +++++++++++++
 2 files changed, 15 insertions(+)

diff --git a/index.html b/index.html
index c978bed..e6de3b6 100644
--- a/index.html
+++ b/index.html
@@ -8,6 +8,7 @@
     <noscript>
       <div id="noscript" class="dialog show">
         <div class="body">
+          <div class="title">Please enable JavaScript</div>
           <p>
             <strong>Oops; it looks like JavaScript is not enabled.</strong> I do
             applaud you for being a cautious user. Unfortunately, you aren't
@@ -102,6 +103,7 @@
 
     <div id="todo" class="dialog">
       <div class="body">
+        <div class="title">TODO</div>
         <p>...quite a bit. </p>
         <p>
           This dialog will ultimately contain a useful TODO list. As it stands,
diff --git a/style.css b/style.css
index 947cfa1..c2126af 100644
--- a/style.css
+++ b/style.css
@@ -186,6 +186,19 @@ body {
 
   z-index: 2001;
 }
+.dialog > .body > .title {
+  background-color: #000080;
+  background-image: -webkit-linear-gradient( left, #000080, #1084d0 );
+  background-image:    -moz-linear-gradient( left, #000080, #1084d0 );
+  background-image:     -ms-linear-gradient( left, #000080, #1084d0 );
+  background-image:      -o-linear-gradient( left, #000080, #1084d0 );
+  margin: -0.5em -0.5em 0.5em -0.5em;
+
+  font-weight: bold;
+  color: white;
+
+  padding: 0.4em;
+}
 .dialog .close {
   float: right;
   margin-top: 0.5em;