From ac992d9d8be5dd71e60c5650efe84c3f40a36e6e Mon Sep 17 00:00:00 2001
From: Arjun Roychowdhury <pliablepixels@gmail.com>
Date: Thu, 8 Oct 2015 14:13:40 -0400
Subject: badge notification count for events

---
 www/css/style.css | 35 ++++++++++++++++++++++++++++++-----
 1 file changed, 30 insertions(+), 5 deletions(-)

(limited to 'www/css')

diff --git a/www/css/style.css b/www/css/style.css
index f7e84f15..d2781e58 100644
--- a/www/css/style.css
+++ b/www/css/style.css
@@ -111,13 +111,38 @@ Credit: https://css-tricks.com/snippets/css/a-guide-to-flexbox/
     .footer  { order: 4; }
 }*/
 
-/* Not using this -eventually. Think notification badges on buttons */
+/* modified from:
+http://www.cssportal.com/tryit/index.php?file=blog/css-notification-badge */
+
+.notification-badge {
+		position:relative;
+	}
+	.notification-badge[data-badge]:after {
+		content:attr(data-badge);
+		position:absolute;
+		top:-3px;
+		left:18px;
+		font-size:9px;
+		background:crimson;
+		color:white;
+		width:22px;height:17px;
+		text-align:center;
+		line-height:17px;
+		border-radius:40%;
+        font-weight:bold;
+        
+	}
+/*
 .notification-badge{
-  position: absolute;
-  top: 3px;
-  right: 0px;
+  
+  border-radius:50%;
+  border: 1 px solid white;   
+  top: -3px;
+  left:-10px;
+  background-color: crimson;
+  color:white;
   font-size: 8px;
-}
+}*/
 
 .ptzcentered {
   position: fixed; /* or absolute */
-- 
cgit v1.2.3