moparisthebest/kaiwa
1
0
Fork 0
mirror of https://github.com/moparisthebest/kaiwa synced 2024-11-29 12:42:16 -05:00
Code Issues Releases Wiki Activity

[ux] started on styling idle timestamp

Browse Source
This commit is contained in:
karolinaszczur 2013-09-27 09:28:18 +02:00
parent be071ec8d2
commit cc26f481e0
4 changed files with 15 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
clientapp/templates.js
View File

@ -51,7 +51,7 @@ exports.includes.contactListItem = function anonymous(locals) {
"class": "avatar" "class": "avatar"
}, { }, {
src: true src: true
}) + '/><div class="name">' + jade.escape(null == (jade.interp = contact.displayName) ? "" : jade.interp) + '</div><div class="unread">' + jade.escape(null == (jade.interp = contact.unreadCount) ? "" : jade.interp) + '</div><div class="status">' + jade.escape(null == (jade.interp = contact.status) ? "" : jade.interp) + "</div></li>"); }) + '/><div class="name">' + jade.escape(null == (jade.interp = contact.displayName) ? "" : jade.interp) + '</div><div class="unread">' + jade.escape(null == (jade.interp = contact.unreadCount) ? "" : jade.interp) + '</div><div class="status">' + jade.escape(null == (jade.interp = contact.status) ? "" : jade.interp) + '</div><div class="idleTime">' + jade.escape(null == (jade.interp = contact.idleSince) ? "" : jade.interp) + "</div></li>");
} }
return buf.join(""); return buf.join("");
}; };

1
clientapp/templates/includes/contactListItem.jade
View File

@ -3,3 +3,4 @@ li.contact
.name=contact.displayName .name=contact.displayName
.unread=contact.unreadCount .unread=contact.unreadCount
.status=contact.status .status=contact.status
.idleTime=contact.idleSince

9
public/css/app/roster.styl
View File

@ -118,15 +118,13 @@
-webkit-animation: pulsate 1.5s infinite ease-in -webkit-animation: pulsate 1.5s infinite ease-in
-moz-animation: pulsate 1.5s infinite ease-in -moz-animation: pulsate 1.5s infinite ease-in
&.paused &.paused, &.idle
&:after &:after
background: $textSecondary background: $textSecondary
&.idle &.idle
.name .name
color: red color: $textSecondary
&:after
background: red
img img
opacity: 1 opacity: 1
@ -175,6 +173,9 @@
text-align: center text-align: center
background: rgba(0, 174, 239, .8) background: rgba(0, 174, 239, .8)
.idle
font-size: 10px
@keyframes pulsate @keyframes pulsate
0% 0%
opacity: 1.0 opacity: 1.0

14
public/css/otalk.css
View File

@ -466,16 +466,14 @@ h3 {
-moz-animation: pulsate 1.5s infinite ease-in; -moz-animation: pulsate 1.5s infinite ease-in;
} }
#roster li.paused:after, #roster li.paused:after,
#bookmarks li.paused:after { #bookmarks li.paused:after,
#roster li.idle:after,
#bookmarks li.idle:after {
background: #b7b7b7; background: #b7b7b7;
} }
#roster li.idle .name, #roster li.idle .name,
#bookmarks li.idle .name { #bookmarks li.idle .name {
color: #f00; color: #b7b7b7;
}
#roster li.idle:after,
#bookmarks li.idle:after {
background: #f00;
} }
#roster li img, #roster li img,
#bookmarks li img { #bookmarks li img {
@ -547,6 +545,10 @@ h3 {
text-align: center; text-align: center;
background: rgba(0,174,239,0.8); background: rgba(0,174,239,0.8);
} }
#roster li .idle,
#bookmarks li .idle {
font-size: 10px;
}
@-moz-keyframes pulsate { @-moz-keyframes pulsate {
0% { 0% {
opacity: 1; opacity: 1;