Sutty/trabajo-afectivo
5
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Improved css for ticket zoom.

Browse source
This commit is contained in:
Martin Edenhofer 2013-09-23 00:07:11 +02:00
parent 6163f763aa
commit bf3fe11408
4 changed files with 93 additions and 92 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/assets/javascripts/app/controllers/ticket_zoom.js.coffee
View file

@ -424,9 +424,9 @@ class Edit extends App.Controller
if !@autosaveLast || ( diff && !_.isEmpty( diff ) ) if !@autosaveLast || ( diff && !_.isEmpty( diff ) )
@autosaveLast = currentData @autosaveLast = currentData
@log 'notice', 'form hash changed', diff, currentData @log 'notice', 'form hash changed', diff, currentData
@el.find('.edit-ticket').addClass('form-changed') @el.find('.ticket-edit').addClass('form-changed')
@el.find('.edit-ticket').find('.reset-message').show() @el.find('.ticket-edit').find('.reset-message').show()
@el.find('.edit-ticket').find('.reset-message').removeClass('hide') @el.find('.ticket-edit').find('.reset-message').removeClass('hide')
App.TaskManager.update( @task_key, { 'state': currentData }) App.TaskManager.update( @task_key, { 'state': currentData })
@interval( update, 3000, 'autosave' ) @interval( update, 3000, 'autosave' )

48
app/assets/javascripts/app/views/ticket_zoom/article_view.jst.eco
View file

@ -1,16 +1,16 @@
<div class="ticket-article-view">
<% for article in @articles: %> <% for article in @articles: %>
<div class="article clearfix" data-id="<%= article.id %>" id="article-<%= article.id %>"> <div class="ticket-article ticket-article-item <% if article.internal is true: %> internal<% end %>" data-id="<%= article.id %>" id="article-<%= article.id %>">
<div class="avatar thumbnails"> <div class="avatar">
<img class="thumbnail user-popover" data-id="<%= article.created_by_id %>" src="<%= article.created_by.image %>" alt=""> <img class="thumbnail user-popover" data-id="<%= article.created_by_id %>" src="<%= article.created_by.image %>" alt="">
<ul> <ul>
<li style="font-size: 10px;"><%- @T(article.article_type.name) %></li> <li style="font-size: 10px;"><%- @T(article.article_type.name) %></li>
<% if article.article_type.name is 'email': %><li style="font-size: 10px;"><a href="<%= App.Config.get('api_path') %>/ticket_article_plain/<%= article.id %>"><%- @T( 'raw' ) %></a></li><% end %> <% if article.article_type.name is 'email': %><li style="font-size: 10px;"><a href="<%= App.Config.get('api_path') %>/ticket_article_plain/<%= article.id %>"><%- @T( 'raw' ) %></a></li><% end %>
</ul> </ul>
</div> </div>
<div class="article-message clearfix <% if article.internal is true: %> internal<% end %>"> <div class="ticket-article-message">
<div class="article-content"> <div class="ticket-article-meta">
<% if article.from: %> <% if article.from: %>
<div>
<strong title="<%- @Ti( 'From' ) %>: <%= article.from %>"><%= article.from %></strong> <strong title="<%- @Ti( 'From' ) %>: <%= article.from %>"><%= article.from %></strong>
<% if article.actions: %> <% if article.actions: %>
<% for action in article.actions: %> <% for action in article.actions: %>
@ -19,26 +19,26 @@
<% end %> <% end %>
<% end %> <% end %>
- <span class="humanTimeFromNow" data-time="<%- article.created_at %>">?</span> - <span class="humanTimeFromNow" data-time="<%- article.created_at %>">?</span>
</div>
<% end %>
<% if article.to: %>
<div title="<%- @Ti( 'To' ) %>: <%= article.to %>"><%= article.to %></div>
<% end %>
<% if article.cc: %>
<div title="<%- @Ti( 'Cc' ) %>: <%= article.cc %>"><%= article.cc %></div>
<% end %>
<% if article.subject: %>
<div title="<%- @Ti( 'Subject' ) %>: <%= article.subject %>"><%= article.subject %></div>
<% end %>
<% if article.attachments: %>
<div>
<% for attachment in article.attachments: %>
<a href="<%= App.Config.get('api_path') %>/ticket_attachment/<%= article.ticket_id %>/<%= article.id %>/<%= attachment.id %>" target="_blank" data-type="attachment" class="" title="<%= attachment.size %>"><%= attachment.filename %></a>
<% end %> <% end %>
</div> <% if article.to: %>
<% end %> <div title="<%- @Ti( 'To' ) %>: <%= article.to %>"><%= article.to %></div>
<div style="white-space:pre-wrap;" class=""><%- article.html %></div> <% end %>
<% if article.cc: %>
<div title="<%- @Ti( 'Cc' ) %>: <%= article.cc %>"><%= article.cc %></div>
<% end %>
<% if article.subject: %>
<div title="<%- @Ti( 'Subject' ) %>: <%= article.subject %>"><%= article.subject %></div>
<% end %>
<% if article.attachments: %>
<div>
<% for attachment in article.attachments: %>
<a href="<%= App.Config.get('api_path') %>/ticket_attachment/<%= article.ticket_id %>/<%= article.id %>/<%= attachment.id %>" target="_blank" data-type="attachment" class="attachment" title="<%= attachment.size %>"><%= attachment.filename %></a>
<% end %>
</div>
<% end %>
</div> </div>
<div style="white-space:pre-wrap;" class="message"><%- article.html %></div>
</div> </div>
</div> </div>
<% end %> <% end %>
</div>

38
app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco
View file

@ -1,21 +1,23 @@
<div class="article clearfix"> <div class="ticket-article-view">
<div class="avatar thumbnails"> <div class="ticket-article well ticket-edit <% if @formChanged: %>form-changed<% end %>">
<img class="thumbnail user-popover" data-id="<%= @S('id') %>" src="<%- @S('image') %>" alt=""> <div class="avatar">
</div> <img class="thumbnail user-popover" data-id="<%= @S('id') %>" src="<%- @S('image') %>" alt="">
<div class="well edit-ticket article-message <% if @formChanged: %>form-changed<% end %>"> </div>
<div class="edit-title article-content"> <div class="ticket-article-message">
<h4><%- @T('Edit') %> <div class="edit-title">
<small class="reset-message<% if !@formChanged: %> hide<% end %>"> <h4><%- @T('Edit') %>
<a href="#" data-type="reset"><%- @T('Discard your unsaved changes.') %></a> <href="#" class="glyphicon glyphicon-repeat" data-type="reset"></a> <small class="reset-message<% if !@formChanged: %> hide<% end %>">
</small> <a href="#" data-type="reset"><%- @T('Discard your unsaved changes.') %></a> <href="#" class="glyphicon glyphicon-repeat" data-type="reset"></a>
</h4> </small>
</h4>
</div>
<div class="edit-content">
<form class="form-stacked ticket-update">
<div class="form-ticket-update"></div>
<div class="form-article-update"></div>
<button type="submit" class="btn btn-primary submit"><%- @T( 'Submit' ) %></button>
</form>
<div>
</div> </div>
<div class="edit-content">
<form class="form-stacked ticket-update">
<div class="form-ticket-update"></div>
<div class="form-article-update"></div>
<button type="submit" class="btn btn-primary submit"><%- @T( 'Submit' ) %></button>
</form>
<div>
</div> </div>
</div> </div>

91
app/assets/stylesheets/zzz.css
View file

@ -602,10 +602,6 @@ form.form-inline input[type="password"] {
} }
.edit-ticket {
padding: 4px 14px 10px;
width: 720px;
}
.edit { .edit {
} }
.edit .form-group { .edit .form-group {
@ -619,15 +615,11 @@ form.form-inline input[type="password"] {
outline: 0; outline: 0;
} }
.edit-title { .edit-title {
} }
.edit-title small { .edit-title small {
font-size: 12px; font-size: 12px;
} }
.edit-content {
margin-left: 68px;
margin-right: 22px;
}
.delete { .delete {
background:url("../assets/close.png") no-repeat; background:url("../assets/close.png") no-repeat;
@ -715,16 +707,57 @@ footer {
} }
} }
.ticket-answer .avatar { .avatar {
padding-left: 6px; padding-left: 6px;
padding-top: 4px; padding-top: 4px;
width: 70px; width: 70px;
float: left; float: left;
} }
.ticket-answer .avatar ul { .avatar ul {
padding-left: 20px; padding-left: 20px;
} }
.ticket-article-view {
max-width: 750px;
}
.ticket-article {
padding: 8px 0 6px 2px;
min-height: 110px;
margin: 2px 0;
}
.ticket-article-item {
border-bottom: 1px solid #eeeeee;
}
.ticket-article-item:last-child {
border-bottom: none;
}
.ticket-article h4 {
margin-top: 2px;
margin-bottom: 6px;
}
.ticket-article.well {
padding: 4px 0 20px 2px;
margin-top: 4px;
}
.ticket-article-meta {
border-bottom: 1px solid #eeeeee;
padding-bottom: 10px;
}
.ticket-article-message {
padding-left: 6px;
padding-top: 4px;
margin-left: 70px;
}
.ticket-edit .ticket-article-message {
padding-right: 40px;
}
.message {
padding-top: 6px;
padding-bottom: 6px;
}
.ticket-update { .ticket-update {
width: 100%; width: 100%;
} }
@ -736,40 +769,6 @@ footer {
width: 160px; width: 160px;
} }
.article {
width: 100%;
margin-left: 0;
margin-top: 0;
margin-bottom: 10px;
padding-top: 0;
padding-bottom: 2px;
padding-right: 0;
border-bottom: 1px solid #eeeeee;
}
.article-content {
margin-left: 70px;
}
.article-message {
padding: 4px 2px;
/*
margin-top: 0;
margin-bottom: 6px;
margin-left: 10px;
padding-top: 10px;
padding-bottom: 8px;
padding-left: 10px;
margin-left: 70px;
min-height: 85px;
*/
}
.show_toogle { .show_toogle {
font-size: 10px; font-size: 10px;
@ -793,7 +792,7 @@ footer {
background-color: #f2dede; background-color: #f2dede;
border-color: #eed3d7; border-color: #eed3d7;
border: 1px solid #fbeed5; border: 1px solid #fbeed5;
border-radius: 2px; border-radius: 4px;
} }
.merged, .merge:hover { .merged, .merge:hover {