ticketZoom attributeBar animation

This commit is contained in:
Felix Niklas 2014-11-14 16:44:59 +01:00
parent 3b0c5696a1
commit 62d92ef630
4 changed files with 21 additions and 8 deletions

View file

@ -511,10 +511,12 @@ class App.Sidebar extends App.Controller
toggleSidebar: -> toggleSidebar: ->
@el.parent().find('.tabsSidebar-sidebarSpacer').toggleClass('is-closed') @el.parent().find('.tabsSidebar-sidebarSpacer').toggleClass('is-closed')
@el.parent().find('.tabsSidebar').toggleClass('is-closed') @el.parent().find('.tabsSidebar').toggleClass('is-closed')
@el.parent().next('.attributeBar').toggleClass('is-closed')
showSidebar: -> showSidebar: ->
@el.parent().find('.tabsSidebar-sidebarSpacer').removeClass('is-closed') @el.parent().find('.tabsSidebar-sidebarSpacer').removeClass('is-closed')
@el.parent().find('.tabsSidebar').removeClass('is-closed') @el.parent().find('.tabsSidebar').removeClass('is-closed')
@el.parent().next('.attributeBar').addClass('is-closed')
toggleTab: (e) -> toggleTab: (e) ->

View file

@ -1,6 +1,6 @@
<form class="update-box bulkAction-form" role="form"> <form class="update-box bulkAction-form" role="form">
<div class="horizontal center bulkAction-firstStep js-action-step"> <div class="horizontal center bulkAction-firstStep js-action-step">
<div id="form-ticket-bulk" class="form-inline form-inline--enclosed flex horizontal"></div> <div id="form-ticket-bulk" class="form-inline form-inline--enclosed flex"></div>
<div class="btn btn--primary js-confirm"><%- @T('Confirm') %></div> <div class="btn btn--primary js-confirm"><%- @T('Confirm') %></div>
</div> </div>
<div class="vertical hide bulkAction-secondStep js-confirm-step"> <div class="vertical hide bulkAction-secondStep js-confirm-step">

View file

@ -53,7 +53,7 @@
<div class="tabsSidebar vertical"></div> <div class="tabsSidebar vertical"></div>
</div> </div>
<form class="ticket-attributes bottom-form form-inline horizontal" role="form"> <form class="attributeBar form-inline is-closed" role="form">
<div class="form-group"> <div class="form-group">
<label for="update_ticket_1_state_id123" class="input-group-addon u-clickable">State</label> <label for="update_ticket_1_state_id123" class="input-group-addon u-clickable">State</label>
<select id="update_ticket_1_state_id123" class="form-control level-1" name="state_id"> <select id="update_ticket_1_state_id123" class="form-control level-1" name="state_id">

View file

@ -2641,6 +2641,10 @@ footer {
background: white; background: white;
} }
.form-inline {
@extend .horizontal;
}
.form-inline .input-group-addon, .form-inline .input-group-addon,
.form-inline .form-control:not(textarea) { .form-inline .form-control:not(textarea) {
background: white; background: white;
@ -2655,7 +2659,7 @@ footer {
@extend .flex-auto; @extend .flex-auto;
} }
.ticket-attributes.form-inline .form-group:last-child { .attributeBar.form-inline .form-group:last-child {
@extend .flex-shrink; @extend .flex-shrink;
} }
@ -2999,10 +3003,6 @@ footer {
margin-bottom: 36px; margin-bottom: 36px;
} }
.bottom-form {
background: white;
}
.dropArea { .dropArea {
background: white; background: white;
border: 5px solid; border: 5px solid;
@ -3507,6 +3507,16 @@ footer {
opacity: 0.5; opacity: 0.5;
} }
.attributeBar {
height: 60px;
background: white;
transition: margin 250ms;
&.is-closed {
margin-bottom: -60px;
}
}
.newTicket { .newTicket {
padding: 34px; padding: 34px;
} }
@ -4580,7 +4590,8 @@ label + .wizard-buttonList {
opacity: 0.4; opacity: 0.4;
.icon { .icon {
transform: scale(1.6); -webkit-transform: scale(1.6);
transform: scale(1.6);
} }
} }