| 1ec65f29 |
- content_for :title, t("chat.title")
- content_for :javascript, javascript_include_tag("application") |
| 333715b4 |
- content_for :javascript, javascript_include_tag("backbone-ws") |
| 1ec65f29 |
|
| f835d40d |
- if flash[:notice]
%div.alert.alert-notice
= flash[:notice]
|
| 1ec65f29 |
.container |
| eee69d20 |
.leftside.left |
| 43b171a9 |
.roster.border.no-top-border.top-border#height-setter-1 |
| 1ec65f29 |
.user |
| eee69d20 |
.avatar.bigger |
| 1ec65f29 |
%img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
%h1 Cinan Rakosnik
%h2 frontend developer |
| eee69d20 |
%h3 |
| 4b15dbcc |
%span.status.online.icon-record |
| eee69d20 |
%a{ href: "#"}
available
%span.icon-arrow-down.drop-down |
| 1ec65f29 |
.friends
%h1.group-header.active Chat group |
| eee69d20 |
%ul.active-group.border.no-left-border.left-border
%li.clear.user
.avatar
%img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
%h1
Adam Wolsky |
| 4b15dbcc |
%span.status.online.icon-record |
| eee69d20 |
%h2 co-founder |
| b9fb7338 |
%span.action
%span.icon-x-full
%span kick |
| eee69d20 |
%li.clear.user
.avatar
%img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
%h1
John Savage |
| 4b15dbcc |
%span.status.away.icon-record |
| eee69d20 |
%h2 web & ui designer |
| b9fb7338 |
%span.action
%span.icon-x-full
%span kick
%span.icon-bubbles
%span invite |
| 1ec65f29 |
%h1.group-header Friends
%ul |
| b9fb7338 |
%li.clear.user |
| eee69d20 |
.avatar
%img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
%h1
Ashley Bond |
| 4b15dbcc |
%span.status.offline.icon-record |
| eee69d20 |
%h2 sexretary |
| b9fb7338 |
%span.action
%span.icon-bubbles
%span invite |
| eee69d20 |
%li.clear.user
.avatar
%img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
%h1
Bob Awesome |
| 4b15dbcc |
%span.status.dnd.icon-record |
| eee69d20 |
%h2 sales manager |
| b9fb7338 |
%span.action
%span.icon-x-full
%span kick |
| eee69d20 |
%li.clear.user
.avatar
%img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
%h1
Bob Awesome |
| 4b15dbcc |
%span.status.dnd.icon-record |
| eee69d20 |
%h2 sales manager |
| b9fb7338 |
%span.action
%span.icon-bubble
%span chat |
| 1ec65f29 |
.toolbox |
| eee69d20 |
%input{type: "search", placeholder: "Search contact"}
%a{ href: "#"}
%span.icon-cog
.chatting-window.left.rightside |
| 43b171a9 |
.tabbar#tabbar |
| eee69d20 |
%a{ href: "#", class: "tab active top-border"}
Adam and John
%span.right.icon.icon-x
%a{ href: "#", class: "tab"}
%span.right.icon.icon-x
%a{ href: "#", class: "tab"}
%span.right.icon.icon-x
.conversation.clear.border |
| 43b171a9 |
.messages#height-setter-2{style: "overflow: auto;"} |
| eee69d20 |
%a{ href: "#", class: "event" }
Load older messages
%span.icon-arrow-up
.message-box
.user
.avatar
%img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
-#todo: user name missing in design
.date 3 hours ago
%p Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Supendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula...
.message-box
.user
.avatar
%img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
-#todo: user name missing in design
.date 3 hours ago
%p Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Supendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula...
-#%hr
%p Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Supendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula...
.event
Monday 13.2.2013
.message-box.active
.user
.avatar
%img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
-#todo: user name missing in design
.date 3 hours ago
%p Etiam ullamcorper. Supendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Lorem ipsum dolor sit amet enim.
.event
Adam left the room | 13:45
|
| 43b171a9 |
.message-writer#msg-writer |
| eee69d20 |
%input{ type: "text", placeholder: "Type your message here" }
%input{ type: "submit", value: "Send" } |