diff options
| author | Arjun Roychowdhury <pliablepixels@gmail.com> | 2015-10-08 14:13:40 -0400 |
|---|---|---|
| committer | Arjun Roychowdhury <pliablepixels@gmail.com> | 2015-10-08 14:13:40 -0400 |
| commit | ac992d9d8be5dd71e60c5650efe84c3f40a36e6e (patch) | |
| tree | b2acdabc5c773a61dffb8425e3c789e79b06d1bd /www/css | |
| parent | a5e032c1d38152644ffabead6536dd14b0433119 (diff) | |
badge notification count for events
Diffstat (limited to 'www/css')
| -rw-r--r-- | www/css/style.css | 35 |
1 files changed, 30 insertions, 5 deletions
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 */ |