Skip to content

U
ulakbus-ui
Commit ce11ec8c authored by Vladimir Baranov's avatar Vladimir Baranov
Browse files
Options

Merge branch 'chat-app-attachment-ui' into develop

parents 299dfc77 93e51edc
Show whitespace changes
Inline Side-by-side
Showing with 181 additions and 5 deletions
app/app.css
View file @ ce11ec8c
......@@ -2085,8 +2085,8 @@ table.dataTable thead .sorting:after {
position: fixed;
bottom: 15px;
right: 15px;
-moz-box-shadow: 0px 0px 15px rgba(0,0,0,0.3);
box-shadow: 0px 0px 15px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 45px rgba(0,0,0,0.4);
box-shadow: 0px 0px 45px rgba(0,0,0,0.4);
z-index: 10;
border-radius: 3px;
}
......@@ -2478,10 +2478,111 @@ table.dataTable thead .sorting:after {
margin-top: 4px;
}
.chat-app .conversation-section .conversation-body .conversation-block .user-message .message-content {
.chat-app .conversation-section .user-message .message-content {
font-family: 'robotomedium';
}
.chat-app .conversation-section .user-message .message-content .attachment-message {
color: #909090;
}
.chat-app .conversation-section .user-message .message-content .attachment-message span {
color: #b51533;
}
.chat-app .conversation-section .user-message .message-content .attachment-holder {
position:relative;
display: inline-block;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
-o-transition: all .2s;
transition: all .2s;
}
.chat-app .conversation-section .user-message .message-content .attachment-holder .attachment-download {
position: absolute;
right: 10px;
top: 10px;
color: #fff;
font-size: 21px;
opacity:0;
cursor:pointer;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
-o-transition: all .2s;
transition: all .2s;
}
.chat-app .conversation-section .user-message .message-content .attachment-holder:hover > .attachment-download {
opacity:0.6;
}
.chat-app .conversation-section .user-message .message-content .attachment-holder .attachment-download:hover {
opacity:1;
}
.chat-app .conversation-section .user-message .message-content .image-attached img {
width: 220px;
border-radius: 3px;
border: 1px solid #a0a0a0;
}
.chat-app .conversation-section .user-message .message-content .file-attached {
width: 100%;
border: 1px solid #ccc;
border-radius: 3px;
padding: 10px;
padding-left: 5px;
background-color:#fff;
}
.chat-app .conversation-section .user-message .message-content .file-attached img {
width: 40px;
float:left;
}
.chat-app .conversation-section .user-message .message-content .file-attached .attached-file-info {
float:left;
margin-left:10px;
}
.chat-app .conversation-section .user-message .message-content .file-attached .attached-file-info div:first-child {
color: #333;
font-size: 15px;
}
.chat-app .conversation-section .user-message .message-content .file-attached .attached-file-info div:last-child {
color: #a2a2a2;
font-size: 13px;
}
.chat-app .conversation-section .user-message .message-content .file-attached .attachment-download {
color:#333;
margin-top:10px;
}
.chat-app .conversation-section .user-message .message-content .file-attached:hover > .attachment-download {
opacity:0.6;
}
.chat-app .conversation-section .user-message .message-content .file-attached .attachment-download:hover {
opacity:1;
}
.chat-app .conversation-section .user-message .edit-text-message input {
width: 100%;
margin-bottom: 7px;
margin-top: 7px;
height: 30px;
border-radius: 3px;
border: 1px solid #ccc;
padding-left: 7px;
outline: none;
}
.chat-app .chat-popup-window {
position: absolute;
top: 0;
......
app/shared/templates/directives/messaging/detail.html
View file @ ce11ec8c
......@@ -31,7 +31,6 @@
</div>
<div class="conversation-block clearfix">
<div class="conversation-actions">
<div class="action"><span class="glyphicon glyphicon-star-empty"></span></div>
<div class="action dropdown-toggle" data-toggle="dropdown">
......@@ -46,6 +45,7 @@
<div class="user-photo">
<img src="../../../img/erkan.jpg">
</div>
<div class="user-message">
<div class="message-header clearfix">
<div class="user-name">Erkan Öğümsöğütlü</div>
......@@ -54,8 +54,83 @@
<div class="message-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer purus mauris.
</div>
<div class="edit-text-message">
<input type="text">
<button class="btn btn-default">Cancel</button>
<button class="btn btn-success">Save Changes</button>
</div>
<!-- end of edit-text-message -->
</div>
</div>
<!-- end of conversation-block -->
<div class="conversation-block clearfix">
<div class="conversation-actions">
<div class="action"><span class="glyphicon glyphicon-star-empty"></span></div>
<div class="action dropdown-toggle" data-toggle="dropdown">
<span class="glyphicon glyphicon-option-horizontal"></span>
</div>
<ul class="dropdown-menu" style="left:-86px;">
<li><a href="#">Edit</a></li>
<li><a href="#">Delete</a></li>
</ul>
</div>
<div class="user-photo">
<img src="../../../img/erkan.jpg">
</div>
<div class="user-message">
<div class="message-header clearfix">
<div class="user-name">Erkan Öğümsöğütlü</div>
<div class="message-time">13:16</div>
</div>
<div class="message-content">
<p class="attachment-message">uploaded an image: <span>sample.jpg</span></p>
<a href="#" class="attachment-holder image-attached" target="_blank">
<img src="../../../img/sample.jpg">
<span class="glyphicon glyphicon-download attachment-download"></span>
</a>
</div>
</div>
</div>
<!-- end of conversation-block -->
<div class="conversation-block clearfix">
<div class="conversation-actions">
<div class="action"><span class="glyphicon glyphicon-star-empty"></span></div>
<div class="action dropdown-toggle" data-toggle="dropdown">
<span class="glyphicon glyphicon-option-horizontal"></span>
</div>
<ul class="dropdown-menu" style="left:-86px;">
<li><a href="#">Edit</a></li>
<li><a href="#">Delete</a></li>
</ul>
</div>
<div class="user-photo">
<img src="../../../img/erkan.jpg">
</div>
<div class="user-message">
<div class="message-header clearfix">
<div class="user-name">Erkan Öğümsöğütlü</div>
<div class="message-time">13:16</div>
</div>
<div class="message-content">
<p class="attachment-message">uploaded a file</p>
<a href="#" class="attachment-holder file-attached" target="_blank">
<img src="../../../img/file-icon.png">
<div class="attached-file-info">
<div>ulakbus-pdf</div>
<div>128KB PDF</div>
</div>
<span class="glyphicon glyphicon-download attachment-download"></span>
</a>
</div>
</div>
</div>
<!-- end of conversation-block -->
</div>
</div>
......
app/shared/templates/directives/messaging/index.html
View file @ ce11ec8c
......@@ -47,7 +47,7 @@
</div>
<!-- end of create-new-message-window -->
<div class="chat-popup-window add-user-unit" style="display:block;">
<div class="chat-popup-window add-user-unit">
<div class="close-chat-popup-window"><span class="glyphicon glyphicon-remove"></span></div>
<h3>Add User/Unit</h3>
<div class="text-center">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment