1
0
mirror of https://github.com/ansible/awx.git synced 2024-10-31 23:51:09 +03:00

Merge pull request #156 from mabashian/5225-responsive-workflow-editor

Fixed workflow maker responsiveness
This commit is contained in:
Michael Abashian 2017-08-03 09:36:58 -04:00 committed by GitHub
commit ddb47c4e81
2 changed files with 10 additions and 10 deletions

View File

@ -1,12 +1,9 @@
.WorkflowMaker-dialog {
padding: 0px;
margin-bottom: 20px;
position: fixed;
top: 0 !important;
bottom: 0;
width: 100vw !important;
height: 100vh !important;
overflow: scroll;
.ui-dialog-buttonpane, .ui-dialog-titlebar {
display:none;
}
@ -274,6 +271,10 @@
.WorkflowMaker-formTab {
margin-right: 10px;
}
.WorkflowMaker-preventBodyScrolling {
height: 100%;
overflow: hidden;
}
.Key-list {
margin: 0;

View File

@ -20,8 +20,8 @@ export default ['templateUrl', 'CreateDialog', 'Wait', '$state', '$window',
let availableHeight = $(window).height(),
availableWidth = $(window).width(),
minimumWidth = 1300,
minimumHeight = 550;
minimumWidth = 682,
minimumHeight = 400;
CreateDialog({
id: 'workflow-modal-dialog',
@ -33,15 +33,15 @@ export default ['templateUrl', 'CreateDialog', 'Wait', '$state', '$window',
position: ['center', 20],
onClose: function() {
$('#workflow-modal-dialog').empty();
$('body').removeClass('WorkflowMaker-preventBodyScrolling');
},
onOpen: function() {
Wait('stop');
$('body').addClass('WorkflowMaker-preventBodyScrolling');
// Let the modal height be variable based on the content
// and set a uniform padding
$('#workflow-modal-dialog').css({ 'padding': '20px' });
$('#workflow-modal-dialog').parent('.ui-dialog').height(availableHeight > minimumHeight ? availableHeight : minimumHeight);
$('#workflow-modal-dialog').parent('.ui-dialog').width(availableWidth > minimumWidth ? availableWidth : minimumWidth);
$('#workflow-modal-dialog').outerHeight(availableHeight > minimumHeight ? availableHeight : minimumHeight);
$('#workflow-modal-dialog').outerWidth(availableWidth > minimumWidth ? availableWidth : minimumWidth);
@ -62,6 +62,7 @@ export default ['templateUrl', 'CreateDialog', 'Wait', '$state', '$window',
scope.closeDialog = function() {
$('#workflow-modal-dialog').dialog('destroy');
$('body').removeClass('WorkflowMaker-preventBodyScrolling');
$state.go('^');
};
@ -69,8 +70,6 @@ export default ['templateUrl', 'CreateDialog', 'Wait', '$state', '$window',
function onResize(){
availableHeight = $(window).height();
availableWidth = $(window).width();
$('#workflow-modal-dialog').parent('.ui-dialog').height(availableHeight > minimumHeight ? availableHeight : minimumHeight);
$('#workflow-modal-dialog').parent('.ui-dialog').width(availableWidth > minimumWidth ? availableWidth : minimumWidth);
$('#workflow-modal-dialog').outerHeight(availableHeight > minimumHeight ? availableHeight : minimumHeight);
$('#workflow-modal-dialog').outerWidth(availableWidth > minimumWidth ? availableWidth : minimumWidth);