diff --git a/clientapp/templates.js b/clientapp/templates.js index 0ef535c..be24648 100644 --- a/clientapp/templates.js +++ b/clientapp/templates.js @@ -131,7 +131,7 @@ exports.pages.groupchat = function anonymous(locals) { exports.pages.main = function anonymous(locals) { var buf = []; with (locals || {}) { - buf.push('

Current status

Change Avatar

Drag and drop a new avatar here

Alerts

'); + buf.push('

Current status

Change Avatar

Drag and drop a new avatar here

Alerts

'); } return buf.join(""); }; diff --git a/clientapp/templates/pages/main.jade b/clientapp/templates/pages/main.jade index 116a5e1..0e229c2 100644 --- a/clientapp/templates/pages/main.jade +++ b/clientapp/templates/pages/main.jade @@ -2,7 +2,7 @@ section.page.main div h3 Current status - span.status(contenteditable="true") + .status(contenteditable="true") div#avatarChanger h3 Change Avatar diff --git a/public/css/app/chat.styl b/public/css/app/chat.styl index eb56e17..3527654 100644 --- a/public/css/app/chat.styl +++ b/public/css/app/chat.styl @@ -109,7 +109,7 @@ content: 'edited ' &.pending - background-color: red + color: lighten($baseText, 50%) .body display: inline diff --git a/public/css/app/forms.styl b/public/css/app/forms.styl index 8a2aef6..8c111bc 100644 --- a/public/css/app/forms.styl +++ b/public/css/app/forms.styl @@ -27,7 +27,8 @@ input[type=text]:focus, input[type=email]:focus, input[type=search]:focus, input[type=password]:focus, -textarea:focus +textarea:focus, +.main .status:focus outline: none border: 1px solid lighten($activeBlue, 50%) diff --git a/public/css/app/roster.styl b/public/css/app/roster.styl index 8773cb8..d0591b9 100644 --- a/public/css/app/roster.styl +++ b/public/css/app/roster.styl @@ -66,7 +66,7 @@ &:hover background: $sidebarActive - &.hasUnread .unread + .unread:not(:empty) display: block &.online, &.chat, &.dnd, &.away, &.xa @@ -146,12 +146,13 @@ .status color: $textSecondary font-size: 10px + font-weight: 400 line-height: 12px margin: 0 - margin-left: 30px + margin-left: 40px &:not(:empty) - margin-top: -2px + margin-top: -8px .unread display: none diff --git a/public/css/app/settings.styl b/public/css/app/settings.styl index 5c146be..c5b402b 100644 --- a/public/css/app/settings.styl +++ b/public/css/app/settings.styl @@ -1,14 +1,20 @@ @import '../_variables' @import '../_mixins' -.main div +.main > div padding: 20px border-bottom: 1px solid $grayOutline &:last-of-type border: none + .status + padding: 5px + background: $grayBackground + roundall(3px) + .uploadRegion + padding: 15px font-size: $fontSmall roundall(3px) margin: 10px 0 diff --git a/public/css/otalk.css b/public/css/otalk.css index a99503a..9eb05ff 100644 --- a/public/css/otalk.css +++ b/public/css/otalk.css @@ -384,8 +384,8 @@ h3 { #bookmarks li:hover { background: #1f2d49; } -#roster li:hover.hasUnread .unread, -#bookmarks li:hover.hasUnread .unread { +#roster li:hover .unread:not(:empty), +#bookmarks li:hover .unread:not(:empty) { display: block; } #roster li.online:after, @@ -503,13 +503,14 @@ h3 { #bookmarks li .status { color: #b7b7b7; font-size: 10px; + font-weight: 400; line-height: 12px; margin: 0; - margin-left: 30px; + margin-left: 40px; } #roster li .status:not(:empty), #bookmarks li .status:not(:empty) { - margin-top: -2px; + margin-top: -8px; } #roster li .unread, #bookmarks li .unread { @@ -727,7 +728,7 @@ h3 { content: 'edited '; } .messages .message.pending { - background-color: #f00; + color: #ababab; } .messages .message .body { display: inline; @@ -781,14 +782,25 @@ h3 { border: 1px solid #efe391; color: #d2bd2d; } -.main div { +.main > div { padding: 20px; border-bottom: 1px solid #e4e4e4; } -.main div:last-of-type { +.main > div:last-of-type { border: none; } +.main > div .status { + padding: 5px; + background: #f7f7f7; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + -khtml-border-radius: 3px; + -o-border-radius: 3px; + -border-radius: 3px; + border-radius: 3px; +} .uploadRegion { + padding: 15px; font-size: 12px; -moz-border-radius: 3px; -webkit-border-radius: 3px; @@ -905,7 +917,8 @@ input[type=text]:focus, input[type=email]:focus, input[type=search]:focus, input[type=password]:focus, -textarea:focus { +textarea:focus, +.main .status:focus { outline: none; border: 1px solid #78daff; }