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

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

Browse source
This commit is contained in:
Martin Edenhofer 2014-09-15 22:56:41 +02:00
commit d9b5e428e7
11 changed files with 240 additions and 239 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
app/assets/javascripts/app/controllers/_application_controller_generic.js.coffee
View file

@ -417,15 +417,15 @@ class App.GenericHistory extends App.ControllerModal
class App.Sidebar extends App.Controller class App.Sidebar extends App.Controller
events: events:
'click .sidebar-tabs': 'toggleTab' 'click .tabsSidebar-tab': 'toggleTab'
'click .close-sidebar': 'toggleSidebar' 'click .tabsSidebar-close': 'toggleSidebar'
constructor: -> constructor: ->
super super
@render() @render()
# get first tab # get first tab
name = @el.find('.sidebar-tab').first().data('content') name = @el.find('.tabsSidebar-tab').first().data('content')
# activate first tab # activate first tab
@toggleTabAction(name) @toggleTabAction(name)
@ -439,17 +439,17 @@ class App.Sidebar extends App.Controller
item.callback( @el.find( '.sidebar-content[data-content=' + item.name + ']' ) ) item.callback( @el.find( '.sidebar-content[data-content=' + item.name + ']' ) )
toggleSidebar: -> toggleSidebar: ->
$('.content.active > div').toggleClass('state--sidebar-hidden') $('.content.active .tabsSidebarSpace').toggleClass('is-closed')
$('.content.active .tabsSidebar').toggleClass('is-closed')
showSidebar: -> showSidebar: ->
# show sidebar if not shown $('.content.active .tabsSidebarSpace').removeClass('is-closed')
if $('.content.active > div').hasClass('state--sidebar-hidden') $('.content.active .tabsSidebar').removeClass('is-closed')
$('.content.active > div').removeClass('state--sidebar-hidden')
toggleTab: (e) -> toggleTab: (e) ->
# get selected tab # get selected tab
name = $(e.target).closest('.sidebar-tab').data('content') name = $(e.target).closest('.tabsSidebar-tab').data('content')
if name if name
@ -466,10 +466,10 @@ class App.Sidebar extends App.Controller
return if !name return if !name
# remove active state # remove active state
@el.find('.sidebar-tab').removeClass('active') @el.find('.tabsSidebar-tab').removeClass('active')
# add active state # add active state
@el.find('.sidebar-tab[data-content=' + name + ']').addClass('active') @el.find('.tabsSidebar-tab[data-content=' + name + ']').addClass('active')
# hide all content tabs # hide all content tabs
@el.find('.sidebar-content').addClass('hide') @el.find('.sidebar-content').addClass('hide')
@ -483,7 +483,7 @@ class App.Sidebar extends App.Controller
@el.find('.sidebar h2').html(title) @el.find('.sidebar h2').html(title)
# set tab actions # set tab actions
@el.find('.sidebar-tab-actions').html('') @el.find('.tabsSidebar-tabActions').html('')
# add item acctions # add item acctions
for item in @items for item in @items
@ -491,7 +491,7 @@ class App.Sidebar extends App.Controller
if item.actions if item.actions
for action in item.actions for action in item.actions
do (action) => do (action) =>
@el.find('.sidebar-tab-actions').append("<div class='sidebar-tab-action #{action.class}'></div>").find(".sidebar-tab-action").last().bind( @el.find('.tabsSidebar-tabActions').append("<div class='tabsSidebar-tabAction #{action.class}'></div>").find(".tabsSidebar-tabAction").last().bind(
'click' 'click'
(e) => (e) =>
e.stopPropagation() e.stopPropagation()

2
app/assets/javascripts/app/controllers/agent_ticket_create.js.coffee
View file

@ -469,7 +469,7 @@ class Sidebar extends App.Controller
} }
new App.Sidebar( new App.Sidebar(
el: @el.find('.sidebar-holder') el: @el.find('.tabsSidebar')
items: items items: items
) )

22
app/assets/javascripts/app/controllers/layout_ref.js.coffee
View file

@ -43,10 +43,32 @@ App.Config.set( 'layout_ref/content_sidebar_right_sidebar_optional', ContentSide
class ContentSidebarTabsRight extends App.ControllerContent class ContentSidebarTabsRight extends App.ControllerContent
elements:
'.tabsSidebar' : 'sidebar'
constructor: -> constructor: ->
super super
@render() @render()
items = [
head: 'Ticket Settings'
name: 'ticket'
icon: 'message'
,
head: 'Customer'
name: 'customer'
icon: 'person'
,
head: 'Organization'
name: 'organization'
icon: 'group'
]
new App.Sidebar(
el: sidebar
items: items
)
render: -> render: ->
@html App.view('layout_ref/content_sidebar_tabs_right')() @html App.view('layout_ref/content_sidebar_tabs_right')()

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

@ -235,7 +235,7 @@ class App.TicketZoom extends App.Controller
} }
new App.Sidebar( new App.Sidebar(
el: @el.find('.sidebar-holder') el: @el.find('.tabsSidebar')
items: items items: items
) )

12
app/assets/javascripts/app/views/agent_ticket_create.jst.eco
View file

@ -1,8 +1,5 @@
<div class="fit ticket-zoom vertical"> <div class="main no-padding fit tabsSidebarSpace">
<div class="flex u-positionOrigin"> <div class="newTicket">
<div class="main no-padding">
<div class="flex-overflow u-positionOrigin sidebar-tabs--spacing">
<div class="box"> <div class="box">
<div class="page-header"> <div class="page-header">
<h1><%- @T( @head ) %></h1> <h1><%- @T( @head ) %></h1>
@ -44,11 +41,9 @@
</form> </form>
</div> </div>
</div> </div>
</div>
</div> </div>
<div class="sidebar-holder vertical"></div> <div class="tabsSidebar vertical"></div>
<!-- <!--
<div class="sidebar"> <div class="sidebar">
<div class="widgets"> <div class="widgets">
@ -171,4 +166,3 @@
</div> </div>
</div> </div>
--> -->
</div>

8
app/assets/javascripts/app/views/generic/sidebar_tabs.jst.eco
View file

@ -1,8 +1,8 @@
<div class="sidebar bottom-form-shadow flex"> <div class="sidebar bottom-form-shadow flex">
<div class="horizontal center"> <div class="horizontal center">
<h2 class="flex u-textTruncate"></h2> <h2 class="flex u-textTruncate"></h2>
<div class="close-sidebar centered u-clickable"> <div class="tabsSidebar-close centered u-clickable">
<div class="sidebar-tab-actions"></div> <div class="tabsSidebar-tabActions"></div>
<div class="arrow-right icon"></div> <div class="arrow-right icon"></div>
</div> </div>
</div> </div>
@ -13,9 +13,9 @@
<% end %> <% end %>
</div> </div>
<div class="sidebar-tabs vertical justified"> <div class="tabsSidebar-tabs vertical justified">
<% for item in @items: %> <% for item in @items: %>
<div class="sidebar-tab centered" data-content="<%= item.name %>"> <div class="tabsSidebar-tab centered" data-content="<%= item.name %>">
<div class="dark icon <%= item.icon %>"></div> <div class="dark icon <%= item.icon %>"></div>
</div> </div>
<% end %> <% end %>

14
app/assets/javascripts/app/views/layout_ref/content_sidebar_tabs_right.jst.eco
View file

@ -1,5 +1,4 @@
<div class="main fit"> <div class="main fit tabsSidebarSpace">
<h1>content</h1> <h1>content</h1>
<p> <p>
@ -13,10 +12,9 @@ Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
<p> <p>
Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.
</p> </p>
</div> </div>
<div class="sidebar-holder"> <div class="tabsSidebar vertical">
<!-- ticket information content --> <!-- ticket information content -->
<div class="sidebar flex" data-tab="ticket"> <div class="sidebar flex" data-tab="ticket">
@ -72,17 +70,17 @@ Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit no
</div> </div>
<div class="sidebar-tabs vertical justified"> <div class="tabsSidebar-tabs vertical justified">
<div class="sidebar-tab centered active" data-tab="ticket"> <div class="tabsSidebar-tab centered active" data-tab="ticket">
<div class="dark icon message"></div> <div class="dark icon message"></div>
</div> </div>
<div class="sidebar-tab centered" data-tab="customer"> <div class="tabsSidebar-tab centered" data-tab="customer">
<div class="dark icon person"></div> <div class="dark icon person"></div>
</div> </div>
<div class="sidebar-tab centered" data-tab="organization"> <div class="tabsSidebar-tab centered" data-tab="organization">
<div class="dark icon group"></div> <div class="dark icon group"></div>
</div> </div>

9
app/assets/javascripts/app/views/ticket_zoom.jst.eco
View file

@ -1,7 +1,7 @@
<div class="fit ticket-zoom vertical"> <div class="flex vertical">
<div class="flex u-positionOrigin"> <div class="flex u-positionOrigin">
<div class="main no-padding"> <div class="main no-padding fit tabsSidebarSpace">
<div class="flex-overflow u-positionOrigin sidebar-tabs--spacing"> <div class="ticketZoom">
<div class="page-header horizontal"> <div class="page-header horizontal">
<div class="flex vertical center"> <div class="flex vertical center">
<div class="big avatar user-popover" data-id="<%- @ticket.customer.id %>" style="background-image: url(<%- @ticket.customer.imageUrl %>)"></div> <div class="big avatar user-popover" data-id="<%- @ticket.customer.id %>" style="background-image: url(<%- @ticket.customer.imageUrl %>)"></div>
@ -26,10 +26,9 @@
<div class="ticket-edit is-public"></div> <div class="ticket-edit is-public"></div>
</div> </div>
</div> </div>
<div class="sidebar-holder vertical"> <div class="tabsSidebar vertical">
</div> </div>
</div> </div>

4
app/assets/stylesheets/application.css
View file

@ -10,9 +10,11 @@
*= require ./bootstrap-tokenfield.css *= require ./bootstrap-tokenfield.css
*= require ./noty_theme_twitter.css *= require ./noty_theme_twitter.css
*= require ./sew.css *= require ./sew.css
*= require ./layout.css
*= require ./zzz.css *= require ./zzz.css
*= require ./fonts/fira-sans.css *= require ./fonts/fira-sans.css
*= require ./layout.css
*
* layout.css after zzz.css because .fix's position absolute should overwrite others
* *
*= require_tree ./custom/ *= require_tree ./custom/
* *

4
app/assets/stylesheets/layout.css
View file

@ -59,8 +59,8 @@
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
height: 100%; bottom: 0;
width: 100%; right: 0;
} }
body.fit { body.fit {

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

@ -2322,31 +2322,11 @@ footer {
appearance: none; appearance: none;
} }
.ticket-zoom { .ticketZoom {
overflow: hidden;
background: #f8f9fa; background: #f8f9fa;
} }
.ticket-zoom .main { .ticketZoom .page-header {
right: 0;
left: 0;
top: 0;
bottom: 0;
margin-right: 280px;
position: absolute;
transition: 500ms;
}
.ticket-zoom .flex-overflow {
overflow: hidden;
min-height: 100%;
}
.ticket-zoom.state--sidebar-hidden .main {
margin-right: 0;
}
.ticket-zoom .page-header {
margin-top: 62px; margin-top: 62px;
margin-bottom: 46px; margin-bottom: 46px;
border-bottom: none; border-bottom: none;
@ -2811,16 +2791,26 @@ footer {
border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0;
} }
.ticket-zoom .sidebar { .tabsSidebarSpace {
padding-right: 62px !important;
margin-right: 280px;
transition: 500ms;
}
.tabsSidebarSpace.is-closed {
margin-right: 0;
}
.tabsSidebar .sidebar {
width: 280px; width: 280px;
border-left: 1px solid #e6e6e6; border-left: 1px solid #e6e6e6;
} }
.ticket-zoom .sidebar h2 { .tabsSidebar .sidebar h2 {
margin: 5px 0 0; margin: 5px 0 0;
} }
.close-sidebar { .tabsSidebar-close {
padding: 20px; padding: 20px;
margin: -15px; margin: -15px;
} }
@ -2833,7 +2823,7 @@ footer {
0 -4px rgba(0,0,0,.005) inset; 0 -4px rgba(0,0,0,.005) inset;
} }
.sidebar-holder { .tabsSidebar {
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
@ -2841,28 +2831,24 @@ footer {
transition: 500ms; transition: 500ms;
} }
.ticket-zoom.state--sidebar-hidden .sidebar-holder { .tabsSidebar.is-closed {
-webkit-transform: translateX(280px); -webkit-transform: translateX(280px);
transform: translateX(280px); transform: translateX(280px);
} }
.sidebar-tabs { .tabsSidebar-tabs {
position: absolute; position: absolute;
left: -55px; left: -55px;
top: 0; top: 0;
bottom: 0; bottom: 0;
} }
.sidebar-tabs--spacing {
padding-right: 62px;
}
.test { .test {
position: absolute; position: absolute;
width: 100%; width: 100%;
} }
.sidebar-tab { .tabsSidebar-tab {
width: 56px; width: 56px;
height: 60px; height: 60px;
background: hsl(197,20%,93%); background: hsl(197,20%,93%);
@ -2871,7 +2857,7 @@ footer {
border-top: 1px solid hsl(202,12%,87%); border-top: 1px solid hsl(202,12%,87%);
} }
.sidebar-tab.is-changed:before { .tabsSidebar-tab.is-changed:before {
position: absolute; position: absolute;
content: ''; content: '';
left: -3px; left: -3px;
@ -2884,20 +2870,20 @@ footer {
box-shadow: 0 0 0 2px hsl(210,17%,98%); box-shadow: 0 0 0 2px hsl(210,17%,98%);
} }
.sidebar-tab:first-child { .tabsSidebar-tab:first-child {
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-top: none; border-top: none;
} }
.sidebar-tab:last-child { .tabsSidebar-tab:last-child {
border-bottom-left-radius: 8px; border-bottom-left-radius: 8px;
} }
.sidebar-tab .icon { .tabsSidebar-tab .icon {
opacity: 0.3; opacity: 0.3;
} }
.sidebar-tab.active .icon { .tabsSidebar-tab.active .icon {
opacity: 1; opacity: 1;
} }
@ -2937,17 +2923,17 @@ footer {
opacity: 0.5; opacity: 0.5;
} }
.create-new .main { .newTicket {
padding: 34px; padding: 34px;
} }
.create-new .sidebar { .newTicket .sidebar {
width: 290px; width: 290px;
} }
.create-new .form-control:not(:focus):not(.focus) { .newTicket .form-control:not(:focus):not(.focus) {
border-color: hsl(0,0%,90%); border-color: hsl(0,0%,90%);
} }
.create-new .subtle-link { .newTicket .subtle-link {
color: hsl(0,0%,89%); color: hsl(0,0%,89%);
} }
@ -3065,7 +3051,7 @@ footer {
margin-top: 20px; margin-top: 20px;
} }
.create-new .templates { .newTicket .templates {
border-bottom: 1px solid hsl(240,4%,95%); border-bottom: 1px solid hsl(240,4%,95%);
padding-bottom: 14px; padding-bottom: 14px;
} }