[MGNLUI-250] Style the GroupManagement and RoleManagement fields Created: 28/Nov/12 Updated: 11/Feb/13 Resolved: 04/Dec/12 |
|
| Status: | Closed |
| Project: | Magnolia UI |
| Component/s: | design, forms |
| Affects Version/s: | None |
| Fix Version/s: | 5.0 |
| Type: | Improvement | Priority: | Major |
| Reporter: | Jozef Chocholacek | Assignee: | Federico Grilli |
| Resolution: | Fixed | Votes: | 0 |
| Labels: | design | ||
| Remaining Estimate: | Not Specified | ||
| Time Spent: | Not Specified | ||
| Original Estimate: | Not Specified | ||
| Attachments: |
|
||||||||||||
| Issue Links: |
|
||||||||||||
| Template: |
|
||||||||||||
| Acceptance criteria: |
Empty
|
||||||||||||
| Task DoD: |
[ ]*
Doc/release notes changes? Comment present?
[ ]*
Downstream builds green?
[ ]*
Solution information and context easily available?
[ ]*
Tests
[ ]*
FixVersion filled and not yet released
[ ] 
Architecture Decision Record (ADR)
|
||||||||||||
| Date of First Response: | |||||||||||||
| Description |
|
The group/role management fields created for the Security App should be designed to comply with the M5 UX style. |
| Comments |
| Comment by Andreas Weder [ 30/Nov/12 ] |
|
I'm raising the priority on this, as it is very visible and should be tackled for Alpha1. |
| Comment by Antti Hietala [ 30/Nov/12 ] |
|
Currently it is easy to mix up the lists. Which list contains assigned groups and which available groups? The label is currently next to the "wrong" list. In the screenshot, user eric belongs to group demo-project-editors. Maybe two labels above each list would help? |
| Comment by Andreas Weder [ 30/Nov/12 ] |
|
I agree with Antti. As an example, check out the second, quick sketch for the Change Group Membership dialog of the Security App: http://wiki.magnolia-cms.com/display/UX/Security+App There must be labels on top of every column. |
| Comment by Andreas Weder [ 30/Nov/12 ] |
|
As for the visual design, please make sure that the buttons are dark gray, as our buttons within forms are. Adjust paddings and margins to ensure the field fits in well into our generous design: don't make things fit too tightly, but make sure the field can still be perceived as a single element. If in doubt, please make a first version, then ask me to review it. Thanks. |
| Comment by Andreas Weder [ 03/Dec/12 ] |
|
Added component(s) to make it easier to filter issues. |
| Comment by Federico Grilli [ 03/Dec/12 ] |
|
here's what I managed to hack given the currently not so flexible html structure of the TwinColSelect widget |
| Comment by Andreas Weder [ 04/Dec/12 ] |
|
Thanks, looks great already. Visually, I would leave things the way they are. But I propose the following changes:
I.e. for group membership:
And for additionally assigned roles:
We can't use "all groups/roles", since elements are actually moved between the boxes, so I'd say we use "other" instead. |
| Comment by Federico Grilli [ 04/Dec/12 ] |
|
Unfortunately, at least to my understanding, it is not trivial to switch columns in Vaadin's TwinColSelect widget. That would involve extending and rewriting some parts of it which I would not do at this stage. Also, you'll notice that the label for roles is truncated but displaying it completely would mean break the dialog design concerning margins between label and fields. |
| Comment by Andreas Weder [ 04/Dec/12 ] |
|
Switching columns: too bad. Can you confirm that with Sasha or Samuli? I'd love to see those switched. If this doesn't work, well, then be it, but if you could add an issue to the 5.0 backlog, that'd be great. Truncated labels: I'd expect long labels to extend over multiple lines then. Can that be done? That should be something the dialog does in general (if it doesn't, we should report that). If this requires too much effort to fix, use "Grant further roles" instead. Thanks. |
| Comment by Federico Grilli [ 04/Dec/12 ] |
|
Switching columns: Sasha confirmed to me that this requires some client-side coding, so I would add an issue to the backlog, given also that I've seen at least another problem with the TwinSelectCol widget. |
| Comment by Andreas Weder [ 04/Dec/12 ] |
|
Ok, thanks for researching the column thingy - please add an issue for this. As for the labels, that's fine. Since labels are right-aligned, it's perfectly fine if the text they contain is right aligned as well. I actually do have screen shots from the designers where they do just that (not that that is the only reference I would use, but it is an important one If you dislike the way the words are spread over the two lines, you could force a line break after "additional" or use "further" instead to shorten the line. I wouldn't do that here, though, I'd leave the first three words together, as they do belong together like this (i.e. you can miss the second line and still understand what you'll have to do). |
| Comment by Federico Grilli [ 04/Dec/12 ] |
|
Issues related to TwinColSelect and aligning of labels are going to be filed. |