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

add internal-border to ticket items

Browse source 
its not that beautiful yet
This commit is contained in:
Felix Niklas 2014-09-15 12:27:34 +02:00
parent 9590fedeb9
commit 340d758e92
3 changed files with 25 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -883,9 +883,9 @@ class ArticleView extends App.Controller
# runntime update
if internal
$(e.target).closest('.ticket-article-item').find('.text-bubble').addClass('internal')
$(e.target).closest('.ticket-article-item').addClass('is-internal')
else
$(e.target).closest('.ticket-article-item').find('.text-bubble').removeClass('internal')
$(e.target).closest('.ticket-article-item').removeClass('is-internal')
show_toogle: (e) ->
e.stopPropagation()

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

@ -1,5 +1,5 @@
<% for article in @articles: %>
<div class="ticket-article-item bubble-grid <%= article.sender.name.toLowerCase() %> <%= article.type.name %>" data-id="<%= article.id %>" id="article-<%= article.id %>">
<div class="ticket-article-item bubble-grid <%= article.sender.name.toLowerCase() %> <%= article.type.name %><%= ' is-internal' if article.internal is true %>" data-id="<%= article.id %>" id="article-<%= article.id %>">
<div class="article-meta-clip top">
@ -35,7 +35,9 @@
<div class="article-content zIndex-1 horizontal<%= ' reverse' if article.sender.name isnt 'Agent' %>">
<div class="avatar user-popover" data-placement="<% if article.sender.name isnt 'Agent': %>left<% else: %>right<% end %>" data-id="<%= article.created_by_id %>" style="background-image: url(<%= article.created_by.imageUrl %>)"></div>
<div class="flex bubble-gap text-bubble <%= ' internal' if article.internal is true %>"><div class="bubble-arrow"></div><%- article.html %></div>
<div class="flex bubble-gap internal-border">
<div class="text-bubble"><div class="bubble-arrow"></div><%- article.html %></div>
</div>
</div>
<div class="article-meta-clip bottom">

44
app/assets/stylesheets/zzz.css.erb
View file

@ -2605,12 +2605,12 @@ footer {
}
.bubble-gap {
margin-left: 15px;
margin-left: 15px !important;
}
.customer.ticket-article-item .bubble-gap {
margin-left: 0;
margin-right: 15px;
margin-left: 0 !important;
margin-right: 15px !important;
}
.ticket-article-item {
@ -2679,6 +2679,21 @@ footer {
color: #96969b;
}
.internal-border {
padding: 5px;
border-radius: 8px;
margin: -5px;
}
.is-internal .internal-border {
background: repeating-linear-gradient(45deg, hsl(18,79%,89%), hsl(18,79%,89%) 5px, hsl(210,17%,98%) 5px, hsl(210,17%,98%) 6px);
background-size: 8px 8px;
}
.is-internal .bubble-arrow {
display: none;
}
.text-bubble {
padding: 10px 20px;
white-space: pre-wrap;
@ -2703,16 +2718,6 @@ footer {
border-color: hsl(199,44%,85%);
}
.ticket-article-item .text-bubble.internal {
background: #f2def2;
border-color: hsl(300,43%,90%);
box-shadow: none;
}
.customer.ticket-article-item.state--folde-out .text-bubble.internal {
border-color: hsl(300,43%,84%);
}
.bubble-arrow {
position: absolute;
width: 7px;
@ -2736,7 +2741,7 @@ footer {
transform: rotate(-45deg);
}
.ticket-article-item .text-bubble.internal .bubble-arrow:after {
.ticket-article-item.is-internal .bubble-arrow:after {
background: #f2def2;
border: #eed3d7;
}
@ -2790,17 +2795,6 @@ footer {
background: white;
}
.ticket-edit .internal-border {
padding: 5px;
border-radius: 8px;
margin: -5px;
}
.ticket-edit.is-internal .internal-border {
background: repeating-linear-gradient(45deg, hsl(18,79%,89%), hsl(18,79%,89%) 5px, transparent 5px, transparent 6px);
background-size: 8px 8px;
}
.ticket-edit .avatar {
margin-bottom: 3px;
}