chat to ticket layout ref: style attachment

This commit is contained in:
Felix Niklas 2016-01-14 22:40:53 +01:00
parent 1d5a539abd
commit 5e667eb264
3 changed files with 21 additions and 30 deletions

View file

@ -1,7 +1,7 @@
<div class="newTicket newTicket--chatTicket">
<div class="box chatHistory">
<div class="page-header">
<h1>Chat History</h1>
<h1>Chat</h1>
</div>
<!-- Hallo Martin. Achtung chat-body-holder--standalone klasse is wichtig -->
<div class="page-content chat-body-holder chat-body-holder--standalone js-scrollHolder">
@ -85,32 +85,13 @@
</div>
<div class="controls"><div class="richtext form-control">
<div contenteditable="true" id="TicketArticle_204825_body" data-name="body" class=""></div><div class="shortcut dropdown"><ul class="dropdown-menu" style="width: 360px; max-height: 200px;"><li><a>-</a></li></ul></div>
<div class="attachments"></div>
<div class="article-attachment">
<div class="attachmentPlaceholder">
<span class="attachmentPlaceholder-inputHolder fileUpload">
select attachment..
<input multiple="multiple" type="file" name="file" style="">
</span>
</div>
<div class="attachmentUpload hide">
<div class="horizontal">
<div class="u-highlight">
Uploading (<span class="js-percentage">0</span>%) ...
</div>
<div class="attachmentUpload-cancel js-cancel">
<svg class="icon icon-diagonal-cross "><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="assets/images/icons.svg#icon-diagonal-cross"></use></svg></div>Cancel Upload
</div>
</div>
<div class="attachmentUpload-progressBar" style="width: 0%"></div>
<div class="attachments attachments--list">
<%- @Icon('paperclip') %>
<div class="attachments-title">1 Attached File</div>
<div class="attachment">
<div class="attachment-name u-highlight">Chat</div>
</div>
</div>
<div class="fit dropArea">
<div class="dropArea-inner">
Drop Files here
</div>
</div></div>
<span class="help-inline"></span>
<span class="help-block"></span>
</div>
</div></fieldset></div>
<div class="formset-inset">

View file

@ -47,7 +47,7 @@
</div>
</div>
<% if !_.isEmpty( @article.attachments ): %>
<div class="attachments">
<div class="attachments attachments--list">
<%- @Icon('paperclip') %>
<div class="attachments-title"><%- @article.attachments.length %> <%- @T('Attached Files') %></div>
<% for attachment in @article.attachments: %>

View file

@ -1456,6 +1456,15 @@ input.time.time--12 {
background: none;
}
.richtext.form-control .attachments.attachments--list:not(:empty) {
border-top: 1px solid rgba(0,0,0,.04);
white-space: normal;
margin: 0 -12px -14px;
padding: 25px 20px 7px 72px;
position: relative;
line-height: 1;
}
textarea.form-control {
height: 118px;
}
@ -4311,7 +4320,7 @@ footer {
box-shadow: none;
}
.ticket-article-item .attachments:not(:empty) {
.attachments.attachments--list:not(:empty) {
border-top: 1px solid rgba(0,0,0,.04);
white-space: normal;
margin: 0 -20px;
@ -4319,7 +4328,7 @@ footer {
position: relative;
}
.ticket-article-item .attachments .attachments-title {
.attachments.attachments--list .attachments-title {
font-size: 13px;
color: hsl(60,1%,34%);
font-weight: bold;
@ -4327,7 +4336,7 @@ footer {
margin: 0 0 4px;
}
.attachments .icon-paperclip {
.attachments .icon {
position: absolute;
left: 33px;
top: 27px;
@ -5073,6 +5082,7 @@ footer {
.box h1 {
margin-top: 10px;
margin-bottom: 12px;
color: hsl(60,1%,34%);
flex: 1;
}