Merge branch 'develop' of github.com:martini/zammad into develop

This commit is contained in:
Martin Edenhofer 2015-05-26 23:53:25 +02:00
commit a2798b17c2
36 changed files with 338 additions and 112 deletions

View file

@ -213,18 +213,18 @@ class App.Navigation extends App.Controller
) )
# remove search result # remove search result
@$('#global-search').bind( 'focusout', (e) => # @$('#global-search').bind( 'focusout', (e) =>
@delay( # @delay(
=> # =>
@$('.search').removeClass('focused') # @$('.search').removeClass('focused')
# remove not needed popovers # # remove not needed popovers
$('.popover').remove() # $('.popover').remove()
@renderResult() # @renderResult()
320 # 320
) # )
) # )
# prevent submit of search box # prevent submit of search box
@$('form.search').bind( 'submit', (e) => @$('form.search').bind( 'submit', (e) =>

View file

@ -3,7 +3,7 @@
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<div class="modal-close js-close"> <div class="modal-close js-close">
<svg class="close-icon"><use xlink:href="#icon-close" /></svg> <svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
</div> </div>
<h1 class="modal-title"><%- @T( @head ) %></h1> <h1 class="modal-title"><%- @T( @head ) %></h1>
</div> </div>

View file

@ -12,22 +12,22 @@
<li> <li>
<% if @items_from != 1: %> <% if @items_from != 1: %>
<a class="btn btn--action" href="#" data-from="<%= @items_from - @items_per_page %>" data-type="page"> <a class="btn btn--action" href="#" data-from="<%= @items_from - @items_per_page %>" data-type="page">
<svg class="icon arrow arrow--left"><use xlink:href="#icon-arrow-left" /></svg> <svg class="icon-arrow-left"><use xlink:href="#icon-arrow-left" /></svg>
</a> </a>
<% else: %> <% else: %>
<a class="btn btn--action is-disabled" href="#" data-from="" data-type="page"> <a class="btn btn--action is-disabled" href="#" data-from="" data-type="page">
<svg class="icon arrow arrow--left arrow--disabled"><use xlink:href="#icon-arrow-left" /></svg> <svg class="icon-arrow-left arrow--disabled"><use xlink:href="#icon-arrow-left" /></svg>
</a> </a>
<% end %> <% end %>
</li> </li>
<li> <li>
<% if @items_till != @items_total: %> <% if @items_till != @items_total: %>
<a class="btn btn--action" href="#" data-from="<%= @items_from + @items_per_page %>" data-type="page"> <a class="btn btn--action" href="#" data-from="<%= @items_from + @items_per_page %>" data-type="page">
<svg class="icon arrow arrow--right"><use xlink:href="#icon-arrow-right" /></svg> <svg class="icon-arrow-right"><use xlink:href="#icon-arrow-right" /></svg>
</a> </a>
<% else: %> <% else: %>
<a class="btn btn--action is-disabled" href="#" data-from="" data-type="page"> <a class="btn btn--action is-disabled" href="#" data-from="" data-type="page">
<svg class="icon arrow arrow--right arrow--disabled"><use xlink:href="#icon-arrow-right" /></svg> <svg class="icon-arrow-right arrow--disabled"><use xlink:href="#icon-arrow-right" /></svg>
</a> </a>
</li> </li>
<% end %> <% end %>

View file

@ -4,7 +4,7 @@
<svg class="dropdown-icon"><use xlink:href="#icon-cog" /></svg> <svg class="dropdown-icon"><use xlink:href="#icon-cog" /></svg>
<label><%- @T('Action') %></label> <label><%- @T('Action') %></label>
<% end %> <% end %>
<svg class="arrow arrow--down"><use xlink:href="#icon-arrow-down" /></svg> <svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down" /></svg>
</div> </div>
<ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="userAction"> <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="userAction">
<% for item in @items: %> <% for item in @items: %>

View file

@ -6,5 +6,5 @@
<% end %> <% end %>
<% end %> <% end %>
</select> </select>
<svg class="arrow arrow--down"><use xlink:href="#icon-arrow-down" /></svg> <svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down" /></svg>
</div> </div>

View file

@ -4,7 +4,7 @@
<h2 class="u-textTruncate"><%- @T( item.head ) %></h2> <h2 class="u-textTruncate"><%- @T( item.head ) %></h2>
<div class="js-actions flex"></div> <div class="js-actions flex"></div>
<div class="tabsSidebar-close"> <div class="tabsSidebar-close">
<svg class="icon"><use xlink:href="#icon-long-arrow-right" /></svg> <svg class="icon icon-long-arrow-right"><use xlink:href="#icon-long-arrow-right" /></svg>
</div> </div>
</div> </div>
<hr> <hr>

View file

@ -80,7 +80,7 @@
</td> </td>
<% end %> <% end %>
<% if @destroy: %> <% if @destroy: %>
<td><a href="#" class="glyphicon glyphicon-trash" data-type="destroy"></a></td> <td><svg class="icon-trash" data-type="destroy"><use xlink:href="#icon-trash" /></svg></td>
<% end %> <% end %>
</tr> </tr>
<% end %> <% end %>

View file

@ -1,7 +1,7 @@
<div class="u-positionOrigin"> <div class="u-positionOrigin">
<input type="hidden" name="<%- @attribute.name %>" value="<%= @attribute.value %>"> <input type="hidden" name="<%- @attribute.name %>" value="<%= @attribute.value %>">
<input name="<%- @attribute.name %>_completion" class="ui-autocomplete-input form-control" autocapitalize="off" placeholder="<%- @attribute.placeholder %>" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true"> <input name="<%- @attribute.name %>_completion" class="ui-autocomplete-input form-control" autocapitalize="off" placeholder="<%- @attribute.placeholder %>" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true">
<svg class="arrow arrow--down"><use xlink:href="#icon-arrow-down" /></svg> <svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down" /></svg>
</div> </div>
<div class="dropdown-menu" aria-labelledby="customer_id"> <div class="dropdown-menu" aria-labelledby="customer_id">

View file

@ -6,5 +6,5 @@
<%= @organization.displayName() %> <%= @organization.displayName() %>
<span class="recipientList-detail">- <%= @organization.member_ids.length %> <%- @T('People') %></span> <span class="recipientList-detail">- <%= @organization.member_ids.length %> <%- @T('People') %></span>
</div> </div>
<svg class="recipientList-arrow"><use xlink:href="#icon-arrow-right" /></svg> <svg class="recipientList-arrow icon-arrow-right"><use xlink:href="#icon-arrow-right" /></svg>
</li> </li>

View file

@ -1,7 +1,7 @@
<ul class="recipientList-organizationMembers hide" id="<%- @organization.id %>"> <ul class="recipientList-organizationMembers hide" id="<%- @organization.id %>">
<li class="recipientList-controls js-back"> <li class="recipientList-controls js-back">
<div class="btn btn--action btn--onDark"> <div class="btn btn--action btn--onDark">
<svg class="icon arrow arrow--left"><use xlink:href="#icon-arrow-left" /></svg> <svg class="icon-arrow-left"><use xlink:href="#icon-arrow-left" /></svg>
<span class="btn-label"><%- @T('Back') %></span> <span class="btn-label"><%- @T('Back') %></span>
</div> </div>
</ul> </ul>

View file

@ -7,7 +7,7 @@
</div> </div>
<div class="dropdown dropdown--actions"> <div class="dropdown dropdown--actions">
<div class="btn btn--action btn--split--last btn--slim centered" id="highlight" data-toggle="dropdown" aria-expanded="true"> <div class="btn btn--action btn--split--last btn--slim centered" id="highlight" data-toggle="dropdown" aria-expanded="true">
<svg class="arrow arrow--down"><use xlink:href="#icon-arrow-down" /></svg> <svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down" /></svg>
</div> </div>
<ul class="dropdown-menu dropdown-menu-right" role="menu"> <ul class="dropdown-menu dropdown-menu-right" role="menu">
<% for entry, i in @colors: %> <% for entry, i in @colors: %>
@ -30,11 +30,11 @@
<ul class="pagination"> <ul class="pagination">
<li> <li>
<a class="btn btn--action btn--split--first" data-from="0" data-type="page"> <a class="btn btn--action btn--split--first" data-from="0" data-type="page">
<svg class="arrow arrow--left"><use xlink:href="#icon-arrow-left" /></svg> <svg class="icon-arrow-left"><use xlink:href="#icon-arrow-left" /></svg>
</a> </a>
<li> <li>
<a class="btn btn--action btn--split--last" href="#" data-from="1" data-type="page"> <a class="btn btn--action btn--split--last" href="#" data-from="1" data-type="page">
<svg class="arrow arrow--right"><use xlink:href="#icon-arrow-right" /></svg> <svg class="icon-arrow-right"><use xlink:href="#icon-arrow-right" /></svg>
</a> </a>
</ul> </ul>
</li> </li>
@ -55,11 +55,11 @@
<ul class="pagination"> <ul class="pagination">
<li> <li>
<a class="centered" href="#" data-from="<%= @items_from - @items_per_page %>" data-type="page"> <a class="centered" href="#" data-from="<%= @items_from - @items_per_page %>" data-type="page">
<svg class="icon arrow arrow--left"><use xlink:href="#icon-arrow-left" /></svg> <svg class="icon-arrow-left"><use xlink:href="#icon-arrow-left" /></svg>
</a> </a>
<li> <li>
<a class="centered" href="#" data-from="<%= @items_from + @items_per_page %>" data-type="page"> <a class="centered" href="#" data-from="<%= @items_from + @items_per_page %>" data-type="page">
<svg class="icon arrow arrow--left"><use xlink:href="#icon-arrow-left" /></svg> <svg class="icon-arrow-left"><use xlink:href="#icon-arrow-left" /></svg>
</a> </a>
</ul> </ul>
</div> </div>

View file

@ -6,7 +6,7 @@
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<div class="modal-close js-close"> <div class="modal-close js-close">
<svg class="close-icon"><use xlink:href="#icon-close" /></svg> <svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
</div> </div>
<h1 class="modal-title">Edit Customer</h1> <h1 class="modal-title">Edit Customer</h1>
</div> </div>

View file

@ -1,4 +1,4 @@
<div class="flex profile"> <div class="profile">
<div class="profile-window"> <div class="profile-window">
<div class="profile-section vertical centered"> <div class="profile-section vertical centered">
@ -16,7 +16,7 @@
</ul> </ul>
</div> </div>
<div class="profile-organizationIcon"> <div class="profile-organizationIcon">
<div class="organization icon"></div> <svg class="icon-organization"><use xlink:href="#icon-organization" /></svg>
</div> </div>
<h1>Steuerbüro C. Kaik</h1> <h1>Steuerbüro C. Kaik</h1>
</div> </div>

View file

@ -1,4 +1,4 @@
<div class="flex profile"> <div class="profile">
<div class="profile-window"> <div class="profile-window">
<div class="profile-section vertical centered"> <div class="profile-section vertical centered">

View file

@ -4,7 +4,7 @@
<div class="modal-header"> <div class="modal-header">
<% if @close: %> <% if @close: %>
<div class="modal-close js-close"> <div class="modal-close js-close">
<svg class="close-icon"><use xlink:href="#icon-close" /></svg> <svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
</div> </div>
<% end %> <% end %>
<h1 class="modal-title"><%- @T( @head ) %></h1> <h1 class="modal-title"><%- @T( @head ) %></h1>

View file

@ -3,7 +3,7 @@
<input id="global-search" type="search" autocomplete="off"> <input id="global-search" type="search" autocomplete="off">
<svg class="icon-magnifier"><use xlink:href="#icon-magnifier" /></svg> <svg class="icon-magnifier"><use xlink:href="#icon-magnifier" /></svg>
<div class="empty-search"> <div class="empty-search">
<svg class="icon-close"><use xlink:href="#icon-close" /></svg> <svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
</div> </div>
</div> </div>
<svg class="icon-logo js-toggleNavigation"><use xlink:href="#icon-logo" /></svg> <svg class="icon-logo js-toggleNavigation"><use xlink:href="#icon-logo" /></svg>

View file

@ -3,7 +3,7 @@
<% for item in area.result: %> <% for item in area.result: %>
<li> <li>
<a href="<%- item.url %>" class="nav-tab nav-tab--search <%= item.class %>" data-id="<%= item.id %>"> <a href="<%- item.url %>" class="nav-tab nav-tab--search <%= item.class %>" data-id="<%= item.id %>">
<svg class="nav-tab-icon tab-icon--search"><use xlink:href="#icon-<%= item.iconClass %>" /></svg> <svg class="nav-tab-icon priority-icon icon-<%= item.iconClass %>"><use xlink:href="#icon-<%= item.iconClass %>" /></svg>
<span class="nav-tab-name flex u-textTruncate"><%= item.display %></span> <span class="nav-tab-name flex u-textTruncate"><%= item.display %></span>
</a> </a>
</li> </li>

View file

@ -1,4 +1,4 @@
<div class="flex profile"> <div class="profile">
<div class="profile-window"> <div class="profile-window">
<div class="js-object-container"></div> <div class="js-object-container"></div>
<div class="profile-section js-ticket-stats"></div> <div class="profile-section js-ticket-stats"></div>

View file

@ -1,7 +1,7 @@
<div class="profile-section vertical centered"> <div class="profile-section vertical centered">
<div class="align-right profile-action js-action"></div> <div class="align-right profile-action js-action"></div>
<div class="profile-organizationIcon"> <div class="profile-organizationIcon">
<div class="organization icon"></div> <svg class="icon-organization"><use xlink:href="#icon-organization" /></svg>
</div> </div>
<h1><%= @organization.displayName() %></h1> <h1><%= @organization.displayName() %></h1>
</div> </div>

View file

@ -1,4 +1,6 @@
<div class="avatar-holder"> <div class="avatar-holder">
<span class="avatar size-50" data-avatar-id="<%- @avatar.id %>" style="background-image: url(<%- @src %>)"></span> <span class="avatar size-50" data-avatar-id="<%- @avatar.id %>" style="background-image: url(<%- @src %>)"></span>
<div class="avatar-delete"><div class="delete icon"></div></div> <div class="avatar-delete">
<svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
</div>
</div> </div>

View file

@ -9,7 +9,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="avatar-gallery horizontal wrap"> <div class="avatar-gallery">
<% for avatar in @avatars: %> <% for avatar in @avatars: %>
<div class="avatar-holder"> <div class="avatar-holder">
<% if avatar.initial: %> <% if avatar.initial: %>
@ -17,11 +17,13 @@
<% if avatar.default: %> <% if avatar.default: %>
<% cssClass = 'is-active' %> <% cssClass = 'is-active' %>
<% end %> <% end %>
<%- App.Session.get().avatar('50', '', cssClass, true, avatar) %> <%- App.Session.get().avatar('80', '', cssClass, true, avatar) %>
<% else: %> <% else: %>
<span class="avatar size-50 <% if avatar.default: %>is-active<% end %>" data-avatar-id="<%- avatar.id %>" style="background-image: url(<%- avatar.content %>)"></span> <span class="avatar size-80 <% if avatar.default: %>is-active<% end %>" data-avatar-id="<%- avatar.id %>" style="background-image: url(<%- avatar.content %>)"></span>
<% if avatar.deletable: %> <% if avatar.deletable: %>
<div class="avatar-delete"><div class="delete icon"></div></div> <div class="avatar-delete">
<svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
</div>
<% end %> <% end %>
<% end %> <% end %>
</div> </div>

View file

@ -11,7 +11,7 @@
<div class="nav-tab-name u-textTruncate flex"><%= item.data.head %></div> <div class="nav-tab-name u-textTruncate flex"><%= item.data.head %></div>
<div class="nav-tab-close js-close" title="<%- @Ti('close') %>"> <div class="nav-tab-close js-close" title="<%- @Ti('close') %>">
<div class="nav-tab-close-inner"> <div class="nav-tab-close-inner">
<svg class="icon"><use xlink:href="#icon-close" /></svg> <svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
</div> </div>
</div> </div>
</a> </a>

View file

@ -31,7 +31,7 @@
<option value="2">open</option> <option value="2">open</option>
<option value="3">pending</option> <option value="3">pending</option>
</select> </select>
<svg class="arrow arrow--down"><use xlink:href="#icon-arrow-down" /></svg> <svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down" /></svg>
</div> </div>
<div class="form-group is-changed"> <div class="form-group is-changed">
<label for="update_ticket_1_priority_id123" class="input-group-addon u-clickable">Priority</label> <label for="update_ticket_1_priority_id123" class="input-group-addon u-clickable">Priority</label>
@ -40,7 +40,7 @@
<option value="2" selected="">2 normal</option> <option value="2" selected="">2 normal</option>
<option value="3">3 high</option> <option value="3">3 high</option>
</select> </select>
<svg class="arrow arrow--down"><use xlink:href="#icon-arrow-down" /></svg> <svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down" /></svg>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="update_ticket_1_group_id123" class="input-group-addon u-clickable">Group</label> <label for="update_ticket_1_group_id123" class="input-group-addon u-clickable">Group</label>
@ -50,7 +50,7 @@
<option value="2">Twitter</option> <option value="2">Twitter</option>
<option value="1" selected="">Users</option> <option value="1" selected="">Users</option>
</select> </select>
<svg class="arrow arrow--down"><use xlink:href="#icon-arrow-down" /></svg> <svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down" /></svg>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="update_ticket_1_owner_id123" class="input-group-addon u-clickable">Owner</label> <label for="update_ticket_1_owner_id123" class="input-group-addon u-clickable">Owner</label>
@ -58,7 +58,7 @@
<option value="">-</option> <option value="">-</option>
<option value="3">Felix Niklas</option> <option value="3">Felix Niklas</option>
</select> </select>
<svg class="arrow arrow--down"><use xlink:href="#icon-arrow-down" /></svg> <svg class="icon-arrow-down"><use xlink:href="#icon-arrow-down" /></svg>
</div> </div>
</form> </form>
<form class="form-inline"> <form class="form-inline">

View file

@ -4,10 +4,10 @@
<ul class="pagination"> <ul class="pagination">
<li <% if !@previous: %>class="disabled"<% end %> title="<%- @Ti( 'previous in Overview' ) %>"> <li <% if !@previous: %>class="disabled"<% end %> title="<%- @Ti( 'previous in Overview' ) %>">
<a class="centered previous" href="<% if @previous: %><%- @previous.uiUrl() %><% end %>" data-id="<% if @previous: %><%- @previous.id %><% end %>"> <a class="centered previous" href="<% if @previous: %><%- @previous.uiUrl() %><% end %>" data-id="<% if @previous: %><%- @previous.id %><% end %>">
<span class="left arrow icon"></span> <svg class="icon icon-arrow-left<% if !@previous: %> arrow--disabled<% end %>"><use xlink:href="#icon-arrow-left" /></svg>
</a> </a>
<li <% if !@next: %>class="disabled"<% end %> title="<%- @Ti( 'next in Overview' ) %>"> <li <% if !@next: %>class="disabled"<% end %> title="<%- @Ti( 'next in Overview' ) %>">
<a class="centered next" href="<% if @next: %><%- @next.uiUrl() %><% end %>" data-id="<% if @next: %><%- @next.id %><% end %>"> <a class="centered next" href="<% if @next: %><%- @next.uiUrl() %><% end %>" data-id="<% if @next: %><%- @next.id %><% end %>">
<span class="right arrow icon"></span> <svg class="icon icon-arrow-right<% if !@next: %> arrow--disabled<% end %>"><use xlink:href="#icon-arrow-right" /></svg>
</a> </a>
</ul> </ul>

View file

@ -1,4 +1,4 @@
<div class="flex profile"> <div class="profile">
<div class="profile-window"> <div class="profile-window">
<div class="js-object-container"></div> <div class="js-object-container"></div>
<div class="profile-section js-ticket-stats"></div> <div class="profile-section js-ticket-stats"></div>

View file

@ -1,6 +1,8 @@
<div class="sidebar-block"> <div class="sidebar-block">
<div class="avatar organizationInfo-avatar size-50"> <div class="avatar organizationInfo-avatar size-50">
<a href="<%- @organization.uiUrl() %>" class="organization icon"></a> <a href="<%- @organization.uiUrl() %>">
<svg class="icon-organization"><use xlink:href="#icon-organization" /></svg>
</a>
</div> </div>
<h3 title="<%- @Ti( 'Name') %>"><%= @organization.displayName() %></h3> <h3 title="<%- @Ti( 'Name') %>"><%= @organization.displayName() %></h3>
</div> </div>

View file

@ -4,7 +4,7 @@
<div class="align-right horizontal center js-close u-clickable"> <div class="align-right horizontal center js-close u-clickable">
<%- @T('Back to my view') %> <%- @T('Back to my view') %>
<div class="switchBackToUser-close"> <div class="switchBackToUser-close">
<svg class="icon"><use xlink:href="#icon-close" /></svg> <svg class="icon-diagonal-cross"><use xlink:href="#icon-diagonal-cross" /></svg>
</div> </div>
</div> </div>
</div> </div>

View file

@ -6,7 +6,6 @@
.icon-checkbox { width: 10px; height: 10px; } .icon-checkbox { width: 10px; height: 10px; }
.icon-checkmark { width: 16px; height: 14px; } .icon-checkmark { width: 16px; height: 14px; }
.icon-clock { width: 16px; height: 16px; } .icon-clock { width: 16px; height: 16px; }
.icon-close { width: 13px; height: 13px; }
.icon-cloud { width: 16px; height: 16px; } .icon-cloud { width: 16px; height: 16px; }
.icon-cog { width: 20px; height: 20px; } .icon-cog { width: 20px; height: 20px; }
.icon-dashboard { width: 24px; height: 24px; } .icon-dashboard { width: 24px; height: 24px; }
@ -60,5 +59,6 @@
.icon-templates { width: 24px; height: 24px; } .icon-templates { width: 24px; height: 24px; }
.icon-tools { width: 24px; height: 24px; } .icon-tools { width: 24px; height: 24px; }
.icon-total-tickets { width: 48px; height: 83px; } .icon-total-tickets { width: 48px; height: 83px; }
.icon-trash { width: 16px; height: 16px; }
.icon-twitter { width: 17px; height: 17px; } .icon-twitter { width: 17px; height: 17px; }
.icon-user { width: 16px; height: 16px; } .icon-user { width: 16px; height: 16px; }

View file

@ -503,6 +503,11 @@ table {
padding: 0; padding: 0;
} }
.table .icon-trash {
vertical-align: middle;
fill: hsl(240,1%,77%);
}
.input-replacement { .input-replacement {
padding: 0; padding: 0;
margin: 0; margin: 0;
@ -808,7 +813,7 @@ textarea,
padding-right: 34px; padding-right: 34px;
} }
.form-control + .arrow { .form-control + .icon-arrow-down {
position: absolute; position: absolute;
right: 12px; right: 12px;
top: 50%; top: 50%;
@ -1305,7 +1310,10 @@ ol.tabs li {
*/ */
.arrow { .icon-arrow-down,
.icon-arrow-up,
.icon-arrow-left,
.icon-arrow-right {
fill: black; fill: black;
opacity: 0.39; opacity: 0.39;
} }
@ -1314,18 +1322,6 @@ ol.tabs li {
opacity: 0.23; opacity: 0.23;
} }
.arrow--down,
.arrow--up {
width: 13px;
height: 7px;
}
.arrow--left,
.arrow--right {
width: 7px;
height: 13px;
}
.icon-checkmark { .icon-checkmark {
fill: #38AE6A; fill: #38AE6A;
} }
@ -1702,7 +1698,7 @@ footer {
background-color: #972e29; background-color: #972e29;
} }
.nav-tab-close .icon { .nav-tab-close svg {
width: 13px; width: 13px;
height: 13px; height: 13px;
fill: white; fill: white;
@ -1710,7 +1706,7 @@ footer {
transform: scale(0.7); transform: scale(0.7);
} }
.nav-tab-close:hover .icon { .nav-tab-close:hover svg {
opacity: 1; opacity: 1;
} }
@ -1762,7 +1758,7 @@ footer {
justify-content: center; justify-content: center;
} }
.empty-search .icon-close { .empty-search .icon-diagonal-cross {
fill: white; fill: white;
opacity: 0.5; opacity: 0.5;
} }
@ -3453,8 +3449,6 @@ footer {
justify-content: center; justify-content: center;
.icon { .icon {
width: 13px;
height: 13px;
fill: black; fill: black;
} }
} }
@ -3825,10 +3819,8 @@ footer {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
.icon { svg {
fill: white; fill: white;
width: 13px;
height: 13px;
} }
} }
@ -3875,10 +3867,8 @@ footer {
@extend .u-clickable; @extend .u-clickable;
} }
.modal-close .close-icon { .modal-close .icon-diagonal-cross {
opacity: 0.18; opacity: 0.18;
width: 13px;
height: 13px;
} }
.modal-body { .modal-body {
@ -4061,8 +4051,6 @@ footer {
} }
.recipientList-arrow { .recipientList-arrow {
width: 7px;
height: 13px;
fill: white; fill: white;
opacity: 0.39; opacity: 0.39;
} }
@ -4506,19 +4494,23 @@ label + .wizard-buttonList {
} }
} }
.avatar-gallery {
display: flex;
flex-wrap: wrap;
}
.avatar-holder { .avatar-holder {
display: inline-block; display: inline-block;
position: relative; position: relative;
margin: 0 15px 15px 0; margin: 0 32px 32px 0;
border-radius: 100%; border-radius: 100%;
box-shadow: 0 0 0 4px white;
.avatar { .avatar {
@extend .u-clickable; @extend .u-clickable;
opacity: .33;
&.is-active { &.is-active {
opacity: 1; box-shadow: 0 0 0 4px hsl(200,71%,59%);
box-shadow: 0 0 0 3px hsl(200,71%,59%);
} }
} }
} }
@ -4530,23 +4522,28 @@ label + .wizard-buttonList {
.avatar-holder .avatar-delete { .avatar-holder .avatar-delete {
position: absolute; position: absolute;
right: -18px; right: -15px;
top: -18px; top: -15px;
width: 30px; width: 40px;
height: 30px; height: 40px;
pointer-events: none; pointer-events: none;
visibility: hidden; visibility: hidden;
opacity: 0.5; background: white;
display: flex;
align-items: center;
justify-content: center;
border-radius: 100%;
box-shadow: 0 1px 5px rgba(0,0,0,.05);
@extend .u-clickable; @extend .u-clickable;
&:hover { svg {
opacity: 1; opacity: 0.5;
fill: hsl(234,10%,19%);
} }
.icon { &:hover svg {
position: absolute; opacity: 1;
left: 8px;
bottom: 8px;
} }
} }
@ -4624,6 +4621,7 @@ label + .wizard-buttonList {
.profile { .profile {
padding: 60px; padding: 60px;
overflow: auto; overflow: auto;
flex: 1;
h1 { h1 {
margin: 18px 0 0; margin: 18px 0 0;
@ -4756,8 +4754,9 @@ label + .wizard-buttonList {
border-radius: 100%; border-radius: 100%;
opacity: 0.4; opacity: 0.4;
.icon { svg {
transform: scale(1.6); width: 32px;
height: 32px;
} }
} }

View file

@ -0,0 +1,145 @@
<!doctype html>
<title>Zammad Icons</title>
<style>
html {
padding: 0 14px 14px 0;
}
body {
margin: 28px 28px 14px 14px;
background: hsl(210,14%,97%);
font-family: sans-serif;
font-size: 13px;
}
.icon-holder {
border: 1px solid hsl(199,44%,93%);
background: white;
box-shadow: 0 2px hsl(210,7%,96%);
float: left;
margin: 0 0 14px 14px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
max-width: 200px;
}
.icon {
position: relative;
padding: 14px;
width: 100%;
box-sizing: border-box;
display: flex;
justify-content: center;
}
.icon svg {
width: 128px;
height: 128px;
position: relative;
}
.icon-body {
padding: 14px;
}
.icon-name {
margin: 0 0 7px;
white-space: nowrap;
}
input {
width: 160px;
font: inherit;
border: 1px solid #ddd;
padding: 3px 5px;
}
input:focus {
outline: none;
border-color: hsl(205,74%,61%);
}
.icon:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-image:
linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black),
linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black);
background-size: 20px 20px;
background-position: 10px 10px, 40px 40px;
background: hsl(210,14%,94%);
opacity: 0.3;
}
</style>
<?
# Path to image folder
$imageFolder = '../../public/assets/images/icons/';
# Show only these file types from the image folder
$imageTypes = '{*.svg}';
# Set to true if you prefer sorting images by name
# If set to false, images will be sorted by date
$sortByImageName = true;
# Set to false if you want the oldest images to appear first
# This is only used if images are sorted by date (see above)
$newestImagesFirst = true;
# The rest of the code is technical
# Add images to array
$images = glob($imageFolder . $imageTypes, GLOB_BRACE);
$author_data = json_decode(file_get_contents('list.json'), true);
# Sort images
if ($sortByImageName) {
$sortedImages = $images;
natsort($sortedImages);
} else {
# Sort the images based on its 'last modified' time stamp
$sortedImages = array();
$count = count($images);
for ($i = 0; $i < $count; $i++) {
$sortedImages[date('YmdHis', filemtime($images[$i])) . $i] = $images[$i];
}
# Sort images in array
if ($newestImagesFirst) {
krsort($sortedImages);
} else {
ksort($sortedImages);
}
}
?>
<? foreach ($sortedImages as $image): ?>
<?
# Get the name of the image, stripped from image folder path and file type extension
$filename = basename($image);
$name = preg_replace('/\\.[^.\\s]{3,4}$/', '', $filename);
# Begin adding
?>
<div class="icon-holder">
<div class="icon">
<?= file_get_contents($image) ?>
</div>
<div class="icon-body">
<div class="icon-name"><?= $name ?></div>
<input class="icon-author" value="<?= $author_data[$filename] ?>" placeholder="Author" data-filename="<?= $filename ?>">
</div>
</div>
<? endforeach ?>
<script src="../../app/assets/javascripts/app/lib/core/jquery-2.1.1.min.js"></script>
<script>
$('input').on('blur', function(){
var iconList = {}
$('.icon-author').each(function(){
iconList[$(this).attr('data-filename')] = $(this).val()
})
$.post('store.php', { list: iconList })
})
</script>

View file

@ -0,0 +1,67 @@
{
"arrow-down.svg": "Felix Niklas",
"arrow-left.svg": "Felix Niklas",
"arrow-right.svg": "Felix Niklas",
"arrow-up.svg": "Felix Niklas",
"checkbox-checked.svg": "Felix Niklas",
"checkbox.svg": "Felix Niklas",
"checkmark.svg": "Felix Niklas",
"clock.svg": "",
"close.svg": "Felix Niklas",
"cloud.svg": "Felix Niklas",
"cog.svg": "",
"dashboard.svg": "",
"diagonal-cross.svg": "Felix Niklas",
"download.svg": "Felix Niklas",
"email.svg": "",
"facebook.svg": "Global Domain",
"group.svg": "",
"help.svg": "Felix Niklas",
"important.svg": "",
"in-process.svg": "",
"list.svg": "Felix Niklas",
"loading.svg": "Felix Niklas",
"lock-open.svg": "Felix Niklas",
"lock.svg": "Felix Niklas",
"logo.svg": "",
"long-arrow-right.svg": "Felix Niklas",
"magnifier.svg": "Felix Niklas",
"marker.svg": "Felix Niklas",
"message.svg": "Felix Niklas",
"mood-bad.svg": "",
"mood-good.svg": "",
"mood-ok.svg": "",
"mood-super-bad.svg": "",
"mood-supergood.svg": "",
"note.svg": "",
"one-ticket.svg": "",
"organization.svg": "",
"outbound-calls.svg": "",
"overviews.svg": "",
"package.svg": "Felix Niklas",
"paperclip.svg": "Felix Niklas",
"pen.svg": "Felix Niklas",
"person.svg": "",
"phone.svg": "",
"plus.svg": "Felix Niklas",
"priority-modified-inner-circle.svg": "Felix Niklas",
"priority-modified-outer-circle.svg": "Felix Niklas",
"priority.svg": "Felix Niklas",
"radio-checked.svg": "Felix Niklas",
"radio.svg": "Felix Niklas",
"received-calls.svg": "",
"reopening.svg": "",
"reply-all.svg": "Felix Niklas",
"reply.svg": "Felix Niklas",
"signout.svg": "",
"split.svg": "",
"stopwatch.svg": "",
"switchView.svg": "",
"team.svg": "",
"templates.svg": "Felix Niklas",
"tools.svg": "",
"total-tickets.svg": "",
"trash.svg": "Felix Niklas",
"twitter.svg": "",
"user.svg": ""
}

View file

@ -0,0 +1,9 @@
<?
// check for ajax request
if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
file_put_contents('list.json', json_encode($_POST['list'], JSON_PRETTY_PRINT));
exit();
}
?>

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 37 KiB

View file

@ -1,12 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="13px" height="13px" viewBox="0 0 13 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.3.2 (12043) - http://www.bohemiancoding.com/sketch -->
<title>close</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="close" sketch:type="MSArtboardGroup" fill="#50E3C2">
<path d="M6.51832931,5.11243489 L11.3036762,0.293623582 C11.6905483,-0.0959532292 12.3199849,-0.0981462527 12.7095624,0.288725564 C13.0991398,0.675597381 13.1013329,1.3050339 12.7144609,1.69461171 L7.92423256,6.51833794 L12.7088296,11.3029347 C13.0970567,11.6911625 13.0970567,12.320603 12.7088296,12.7088298 C12.3206025,13.0970566 11.691162,13.0970566 11.3029349,12.7088298 L6.52323648,7.92913105 L1.77916681,12.7063763 C1.39229479,13.0959531 0.76285807,13.0981471 0.373280663,12.7112743 C-0.0162967445,12.3244025 -0.0184898675,11.694966 0.368382148,11.3053882 L5.11733323,6.523228 L0.291170323,1.69706519 C-0.0970567743,1.30883839 -0.0970567743,0.679397892 0.291170323,0.291170099 C0.679397321,-0.0970566998 1.30883782,-0.0970566998 1.69706492,0.291170099 L6.51832931,5.11243489 L6.51832931,5.11243489 Z" sketch:type="MSShapeGroup"></path>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.4 KiB

View file

@ -6,7 +6,7 @@
<defs></defs> <defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="priority" sketch:type="MSArtboardGroup" fill="#50E3C2"> <g id="priority" sketch:type="MSArtboardGroup" fill="#50E3C2">
<path d="M8,14 C11.3137085,14 14,11.3137085 14,8 C14,4.6862915 11.3137085,2 8,2 C4.6862915,2 2,4.6862915 2,8 C2,11.3137085 4.6862915,14 8,14 Z M8,12 C10.209139,12 12,10.209139 12,8 C12,5.790861 10.209139,4 8,4 C5.790861,4 4,5.790861 4,8 C4,10.209139 5.790861,12 8,12 Z" id="Oval-2" sketch:type="MSShapeGroup"></path> <path d="M8.00000001,13.5 C11.0375661,13.5 13.5,11.0375661 13.5,8.00000001 C13.5,4.96243388 11.0375661,2.50000001 8.00000001,2.50000001 C4.96243388,2.50000001 2.50000001,4.96243388 2.50000001,8.00000001 C2.50000001,11.0375661 4.96243388,13.5 8.00000001,13.5 Z M8.00000001,11.0833333 C9.70287799,11.0833333 11.0833333,9.70287799 11.0833333,8.00000001 C11.0833333,6.29712203 9.70287799,4.91666667 8.00000001,4.91666667 C6.29712203,4.91666667 4.91666667,6.29712203 4.91666667,8.00000001 C4.91666667,9.70287799 6.29712203,11.0833333 8.00000001,11.0833333 Z" id="Oval-2" sketch:type="MSShapeGroup"></path>
</g> </g>
</g> </g>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 955 B

After

Width:  |  Height:  |  Size: 1.2 KiB

View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.3.2 (12043) - http://www.bohemiancoding.com/sketch -->
<title>trash</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="trash" sketch:type="MSArtboardGroup" fill="#50E3C2">
<path d="M3.5,3 L3,5 L13,5 L12.5,3 L10,3 L9.5,2 L6.5,2 L6,3 L3.5,3 Z M4.00000001,6 L12,6 L11,14 L5.00000001,14 L4.00000001,6 Z" id="trashbin" sketch:type="MSShapeGroup"></path>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 809 B