style ticket links

This commit is contained in:
Felix Niklas 2015-05-28 16:21:31 +02:00
parent 7f297a977c
commit 407231f5d7
4 changed files with 56 additions and 32 deletions

View file

@ -1,7 +1,7 @@
class App.WidgetLink extends App.Controller class App.WidgetLink extends App.Controller
events: events:
'click [data-type=add]': 'add', 'click .js-add': 'add',
'click [data-type=remove]': 'remove', 'click .js-remove': 'remove',
constructor: -> constructor: ->
super super

View file

@ -1,10 +1,19 @@
<label><%- @T('Links') %></label> <label><%- @T('Links') %></label>
<% for type of @links: %> <% for type of @links: %>
<label><%- @T( type ) %></label> <div class="ticketLinks">
<ul> <div class="sidebar-list-title"><%- @T( type ) %></div>
<ul class="sidebar-list">
<% for item in @links[type]: %> <% for item in @links[type]: %>
<li><a href="#ticket/zoom/<%= item.id %>" data-type="" title="<%= item.title %>" class="<%= item.css %>">T:<%= item.number %> <%= item.title %></a> <a href="" data-object="Ticket" data-object-id="<%= item.id %>" data-link-type="<%= type %>" data-type="remove" class="glyphicon glyphicon-remove" title="<%- @Ti('remove') %>"></a></li> <li class="sidebar-list-item">
<div class="sidebar-list-item-name">
<a href="#ticket/zoom/<%= item.id %>" data-type="" title="<%= item.title %>" class="<%= item.css %>"><span class="ticket-id">T:<%= item.number %></span> <%= item.title %></a>
</div>
<!--<span>3</span>-->
<div class="sidebar-list-item-delete js-delete" data-object="Ticket" data-object-id="<%= item.id %>" data-link-type="<%= type %>" data-type="remove">
<svg class="icon icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
</div>
<% end %> <% end %>
</ul> </ul>
</div>
<% end %> <% end %>
<div class="text-muted js-newTagLabel u-clickable" data-type="add">+ <%- @T('Add Link') %></div> <div class="text-muted u-clickable js-add">+ <%- @T('Add Link') %></div>

View file

@ -1,17 +1,15 @@
<div class=""> <label><%- @T( 'Tags' ) %></label>
<label><%- @T( 'Tags' ) %></label> <ul class="sidebar-list">
<ul class="tagList"> <% for tag in @tags: %>
<% for tag in @tags: %> <li class="sidebar-list-item">
<li class="tag"> <div class="sidebar-list-item-name"><%= tag %></div>
<div class="tag-name"><%= tag %></div> <!--<span>3</span>-->
<!--<span>3</span>--> <div class="sidebar-list-item-delete js-delete">
<div class="tag-delete js-delete "> <svg class="icon icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
<svg class="icon icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg> </div>
</div> <% end %>
<% end %> </ul>
</ul> <div class="text-muted js-newTagLabel u-clickable">+ <%- @T('Add Tag') %></div>
<div class="text-muted js-newTagLabel u-clickable">+ <%- @T('Add Tag') %></div> <form>
<form> <input type="text" name="new_tag" class="hide js-newTagInput" autocomplete="off">
<input type="text" name="new_tag" class="hide js-newTagInput" autocomplete="off"> </form>
</form>
</div>

View file

@ -718,7 +718,7 @@ fieldset > *:not(.form-group) .form-control {
.formGroup-label { .formGroup-label {
padding: 0 2px; padding: 0 2px;
margin-bottom: 3px; margin-bottom: 6px;
position: relative; position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
@ -3590,28 +3590,36 @@ footer {
} }
} }
.tags { .tags,
margin: 15px 0 20px; .links {
margin: 20px 0;
} }
.tagList { .sidebar-list {
padding: 0; padding: 0;
margin-bottom: 5px; margin-bottom: 5px;
} }
.tagList .tag { .sidebar-list-title {
color: hsl(206,7%,28%);
text-transform: capitalize;
margin-top: 7px;
}
.sidebar-list-item {
padding: 4px 1px;
display: flex; display: flex;
align-items: center; align-items: center;
color: hsl(206,7%,28%); color: hsl(206,7%,28%);
border-bottom: 1px solid hsl(240,4%,95%); border-bottom: 1px solid hsl(240,4%,95%);
} }
.tagList .tag-name { .sidebar-list-item-name {
flex: 1; flex: 1;
} }
.tagList .tag-delete { .sidebar-list-item-delete {
height: 29px; height: 100%;
padding: 0 10px; padding: 0 10px;
margin-right: -4px; margin-right: -4px;
display: flex; display: flex;
@ -3626,10 +3634,19 @@ footer {
} }
} }
.tagList .tag-delete:hover .icon { .sidebar-list-item-delete:hover .icon {
fill: hsl(1,77%,47%); fill: hsl(1,77%,47%);
} }
.ticket-id {
color: white;
background: hsl(198,19%,72%);
font-size: 11px;
border-radius: 7px;
padding: 0 5px;
margin-right: 2px;
}
.attributeBar { .attributeBar {
height: 60px; height: 60px;
background: white; background: white;