From e3bf75411ab900463c4994d26aa402f247cc4b1d Mon Sep 17 00:00:00 2001
From: Tankred Hase <tankred@whiteout.io>
Date: Tue, 3 Sep 2013 16:17:48 +0200
Subject: [PATCH] add unread marker

---
 src/ui/css/style.scss | 18 +++++++++++++++++-
 src/ui/index.html     |  1 +
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/src/ui/css/style.scss b/src/ui/css/style.scss
index 16d20bf..b738f30 100644
--- a/src/ui/css/style.scss
+++ b/src/ui/css/style.scss
@@ -31,7 +31,7 @@ body {
 
     @mixin marked {
         background-color: #00c6ff;
-        color: #ffffff;
+        color: #f9f9f9;
         .from {
             color: #ffffff;
         }
@@ -43,6 +43,17 @@ body {
         }
     }
 
+    .unread {
+        position: absolute;
+        margin-top: 1.85em;
+        margin-left: 0.5em;
+        width: 0.9em;
+        height: 0.9em;
+        border-radius: 50%;
+        background: #00c6ff;
+        box-shadow: inset 0.5px 1px 0.5px #A4A4A4;
+    }
+
     li {
         background-color: #ffffff;
         margin: 8px 0;
@@ -79,6 +90,11 @@ body {
     }
     li.selected {
         @include marked;
+
+        .unread {
+            background: #f9f9f9;
+            box-shadow: inset 1px 1px 1px #D8D8D8;
+        }
     }
 }
 
diff --git a/src/ui/index.html b/src/ui/index.html
index 9fcb941..6f51eb5 100755
--- a/src/ui/index.html
+++ b/src/ui/index.html
@@ -12,6 +12,7 @@
     <div class="message-list">      
       <ul>
         <li class="selected">
+          <div class="unread"></div>
           <p class="from">Max Mustermann</p>
           <p class="subject">Welcome Nico</p>
           <p class="text-preview">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy.</p>