aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authormarijus <mario@localhost.localdomain>2014-02-09 23:52:09 +0100
committermarijus <mario@localhost.localdomain>2014-02-09 23:52:09 +0100
commit4fc0126661f2389843599a4a6829d8eb79a109e4 (patch)
tree3417c594a21e0de20b5d96a9555131f762015102
parent66e7d182d499a7a8a854f64fb4c4746c283bef4a (diff)
downloadvolse-hubzilla-4fc0126661f2389843599a4a6829d8eb79a109e4.tar.gz
volse-hubzilla-4fc0126661f2389843599a4a6829d8eb79a109e4.tar.bz2
volse-hubzilla-4fc0126661f2389843599a4a6829d8eb79a109e4.zip
theming chat a little
-rw-r--r--view/css/mod_chat.css29
-rw-r--r--view/theme/redbasic/css/style.css8
-rw-r--r--view/tpl/chat.tpl7
3 files changed, 39 insertions, 5 deletions
diff --git a/view/css/mod_chat.css b/view/css/mod_chat.css
index ce6e59af1..99bd1b154 100644
--- a/view/css/mod_chat.css
+++ b/view/css/mod_chat.css
@@ -27,5 +27,30 @@
section {
padding-bottom: 0;
}
-
- \ No newline at end of file
+
+.chat-item {
+ padding: 3px;
+}
+
+.chat-item-end {
+ clear: both;
+}
+
+.chat-item-photo {
+ float: left;
+ height: 32px;
+ width: 32px;
+}
+
+.chat-body {
+ float: left;
+ width: 80%;
+ margin-left: 15px;
+}
+
+.chat-item-text {
+ float: left;
+ background-color:#eee;
+ padding: 3px;
+ display:inline-block;
+}
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index 6164407e8..08129aabb 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -2455,8 +2455,16 @@ img.mail-list-sender-photo {
.abook-self {
background-color: #ffdddd;
}
+
.online-now {
color: red;
cursor: pointer;
}
+.chat-item-photo {
+ border-radius: $radiuspx;
+}
+
+.chat-item-text {
+ border-radius: $radiuspx;
+}
diff --git a/view/tpl/chat.tpl b/view/tpl/chat.tpl
index 7073a0a52..51aeb836e 100644
--- a/view/tpl/chat.tpl
+++ b/view/tpl/chat.tpl
@@ -1,5 +1,5 @@
<h1>{{$room_name}}</h1>
-<div id="chatContainer"">
+<div id="chatContainer">
<div id="chatTopBar">
<div id="chatLineHolder"></div>
@@ -64,7 +64,7 @@ function update_inroom(inroom) {
$.each( inroom, function(index, item) {
var newNode = document.createElement('div');
$(newNode).html('<img style="height: 32px; width: 32px;" src="' + item.img + '" alt="' + item.name + '" /> ' + item.status + '<br />' + item.name + '<br/>');
- html.appendChild(newNode);
+ html.appendChild(newNode);
});
$('#chatUsers').html(html);
}
@@ -75,7 +75,8 @@ function update_chats(chats) {
$.each( chats, function(index, item) {
last_chat = item.id;
var newNode = document.createElement('div');
- $(newNode).html('<div style="margin-bottom: 5px; clear: both;"><img style="height: 32px; width: 32px; float: left;" src="' + item.img + '" alt="' + item.name + '" /><div class="chat-body" style="float: left; width: 80%; margin-left: 15px; font-size: 14px;">' + item.name + ' <span class="autotime" title="' + item.isotime + '">' + item.localtime + '</span><br />' + item.text + '</div></div>');
+ newNode.setAttribute('class', 'chat-item');
+ $(newNode).html('<img class="chat-item-photo" src="' + item.img + '" alt="' + item.name + '" /><div class="chat-body"><span class="chat-item-name">' + item.name + ' </span><span class="autotime chat-item-time" title="' + item.isotime + '">' + item.localtime + '</span><br /><span class="chat-item-text">' + item.text + '</span></div><div class="chat-item-end"></div>');
$('#chatLineHolder').append(newNode);
$(".autotime").timeago();