Bug 1553697 - Service dialog text, dialog element and button layout/spacing is incorrect in CloudForms 4.6
Summary: Service dialog text, dialog element and button layout/spacing is incorrect in...
Keywords:
Status: CLOSED CURRENTRELEASE
Alias: None
Product: Red Hat CloudForms Management Engine
Classification: Red Hat
Component: UI - OPS
Version: 5.9.0
Hardware: Unspecified
OS: Unspecified
high
medium
Target Milestone: GA
: 5.10.0
Assignee: Eric Winchell
QA Contact: Shveta
URL:
Whiteboard: service;dialog
: 1487781 1569439 (view as bug list)
Depends On:
Blocks: 1588527
TreeView+ depends on / blocked
 
Reported: 2018-03-09 10:49 UTC by Peter McGowan
Modified: 2019-02-11 14:01 UTC (History)
10 users (show)

Fixed In Version: 5.10.0.0
Doc Type: If docs needed, set a value
Doc Text:
Clone Of:
: 1588527 (view as bug list)
Environment:
Last Closed: 2019-02-11 14:01:06 UTC
Category: ---
Cloudforms Team: CFME Core
Target Upstream Version:
Embargoed:


Attachments (Terms of Use)
Service Dialog CloudForms 4.5 (119.14 KB, image/png)
2018-03-09 10:49 UTC, Peter McGowan
no flags Details
Service Dialog CloudForms 4.6 (137.27 KB, image/png)
2018-03-09 10:50 UTC, Peter McGowan
no flags Details
Service Dialog CloudForms 4.5 Text Area Box Resized (128.07 KB, image/png)
2018-03-09 10:50 UTC, Peter McGowan
no flags Details
refresh button (97.85 KB, image/png)
2018-07-11 17:57 UTC, Shveta
no flags Details

Description Peter McGowan 2018-03-09 10:49:46 UTC
Created attachment 1406234 [details]
Service Dialog CloudForms 4.5

Description of problem:
In CloudForms 4.6 the custom service dialogs have a new look, however the layout of element labels in relation to dialog elements, and default sizing of elements, and the placing of buttons looks incorrect compared to CloudForms 4.5

Version-Release number of selected component (if applicable):
5.9.0.22

How reproducible:
Every time

Steps to Reproduce:
Comparing the two screenshots service_dialog_cloudforms_4.5 and service_dialog_cloudforms_4.6, it can be seen that in the 4.6 version, there are the following inconsistencies/regressions:
 
a) Too much space between the element label and the element itself. In a long dialog with many elements this can make it more difficult for the eye to follow.
b) The default sizing for the elements is incorrect; the drop-down is wider than it needs to be and the text area box is smaller than it should be.
c) The 'Cancel' button right edge is hard against the edge of the window. This is inconsistent with other buttons in the Ops UI that have some whitespace all around them.
d) The text area box's 'Refresh' button does not move if the text area box is resized (see service_dialog_cloudforms_4.6_text_area_box_resized)

Comment 2 Peter McGowan 2018-03-09 10:50:09 UTC
Created attachment 1406235 [details]
Service Dialog CloudForms 4.6

Comment 3 Peter McGowan 2018-03-09 10:50:38 UTC
Created attachment 1406236 [details]
Service Dialog CloudForms 4.5 Text Area Box Resized

Comment 4 Peter McGowan 2018-03-09 11:06:17 UTC
Also the dialog name is now prominently displayed at the top of the dialog - in the CloudForms 4.6 screenshot examples this is "Embedded Ansible Service Template Selection" - whereas it wasn't displayed before. This should not be displayed as the dialog name sometimes has no relation to the name of the button or service catalog item that has been ordered, and displaying the name in this way will cause confusion. 

For example a single service dialog called "Generic VM Options" might be used to front the service catalog items for several VM types, by prompting for common elements such as VM name, VM size, service name etc. If the user has ordered a service called "Order a RHEL 7 VM", they shouldn't see a dialog called "Generic VM Options".

Comment 9 CFME Bot 2018-03-21 22:17:32 UTC
New commit detected on ManageIQ/manageiq-ui-classic/master:

https://github.com/ManageIQ/manageiq-ui-classic/commit/23fb012af9ddc3ecf7da899038db46d3a7082c94
commit 23fb012af9ddc3ecf7da899038db46d3a7082c94
Author:     Eric Winchell <ewinchel>
AuthorDate: Wed Mar 21 11:52:22 2018 -0400
Commit:     Eric Winchell <ewinchel>
CommitDate: Wed Mar 21 11:52:22 2018 -0400

    Correct positioning of dialog form buttons

    https://bugzilla.redhat.com/show_bug.cgi?id=1553697

 app/views/shared/dialogs/_dialog_user.html.haml | 26 +-
 1 file changed, 13 insertions(+), 13 deletions(-)

Comment 14 CFME Bot 2018-05-18 14:04:33 UTC
New commit detected on ManageIQ/ui-components/master:

https://github.com/ManageIQ/ui-components/commit/a8213098ccee66ea1335dc65202c8b476b36c956
commit a8213098ccee66ea1335dc65202c8b476b36c956
Author:     Eric Winchell <ewinchel>
AuthorDate: Thu May  3 11:34:58 2018 -0400
Commit:     Eric Winchell <ewinchel>
CommitDate: Thu May  3 11:34:58 2018 -0400

    Fix Dialog Editor styling issues

    https://bugzilla.redhat.com/show_bug.cgi?id=1553697

 src/dialog-user/components/dialog-user/dialogField.html | 281 +-
 1 file changed, 143 insertions(+), 138 deletions(-)

Comment 16 Shveta 2018-07-11 17:57:06 UTC
Created attachment 1458199 [details]
refresh button

a , b , c are fixed but d isn't .
Refresh button moves over the line with window resizing as in attached screenshot.

Comment 19 Shveta 2018-07-17 16:57:45 UTC
I can open a new BZ for Item D .
Verifying this one .

Comment 20 CFME Bot 2018-07-24 13:03:05 UTC
New commit detected on ManageIQ/ui-components/master:

https://github.com/ManageIQ/ui-components/commit/509ceb167853b521b71285a704f387bc00dd746e
commit 509ceb167853b521b71285a704f387bc00dd746e
Author:     Eric Winchell <ewinchel>
AuthorDate: Mon Jul 16 13:55:15 2018 -0400
Commit:     Eric Winchell <ewinchel>
CommitDate: Mon Jul 16 13:55:15 2018 -0400

    fix refresh button placement in service dialog screen

    https://bugzilla.redhat.com/show_bug.cgi?id=1553697

 src/dialog-user/components/dialog-user/dialogField.html | 12 +-
 1 file changed, 7 insertions(+), 5 deletions(-)

Comment 21 Roman Blanco 2018-10-19 12:57:24 UTC
*** Bug 1487781 has been marked as a duplicate of this bug. ***

Comment 22 Eric Winchell 2018-10-23 16:21:59 UTC
*** Bug 1569439 has been marked as a duplicate of this bug. ***


Note You need to log in before you can comment on or make changes to this bug.