Nan Li from the HSS UX team reviewed the proposed new system page design and suggested the following improvements (quoting): Qucik Info Box * Adjust the order of the quick info boxs. The system’s usage is more important, so move it to the middle. * Adjust the width of the box, to cancel the average width. In the large display, the width of the box is too large and difficult to see. * Added owners * When mouse over the names, prompts the user to click it to send messages. * The underline of time information is necessary? The Left Navigation Style * Reduce the overall width, make it more compact. * Strengthen each group heading styles, different with other links. * Increase the distance between the groups. * Right-justified text and select the style of the text, to increase its relevance and right information. Table List * Remove the row's line, deepen background-color of row, bold line of the first row. * Adjusting the distance between columns and column, easy to read. * Increase mouse over style, it is useful. Info * Remove excess lines, narrow the distance of the title and content. * Expand the distance between the information section, separated by a dotted line. * Message using the same style (blue background, blue border.) Other * The long page, increasing the “Back Top” button. * If there is no information, it is best to give prompt information. The header of the list is not displayed. * Left Navigation, "owner" can be removed or merged?
I am just a bit unclear about the last two suggestions in the list. (In reply to Dan Callaghan from comment #0) > * If there is no information, it is best to give prompt information. The > header of the list is not displayed. I'm not sure about this one. Header of which list? What does "prompt information" mean? > * Left Navigation, "owner" can be removed or merged? I guess it does seem a bit wasteful to have an entire tab for this, although it also has the UI for notify cc which is closely related to ownership. I'm not sure what "Owner" could be merged into.
Created attachment 939952 [details] no info in group
(In reply to Dan Callaghan from comment #2) > I am just a bit unclear about the last two suggestions in the list. > > (In reply to Dan Callaghan from comment #0) > > * If there is no information, it is best to give prompt information. The > > header of the list is not displayed. > > I'm not sure about this one. Header of which list? What does "prompt > information" mean? > If no have contents, better to give some tips. No information in the table, it is best to hide header. eg: attachmetn 939952 > > * Left Navigation, "owner" can be removed or merged? > > I guess it does seem a bit wasteful to have an entire tab for this, although > it also has the UI for notify cc which is closely related to ownership. I'm > not sure what "Owner" could be merged into. Some users feel that this tab a little superfluous. But this is a minor problem. We need to talk about merging or removing or some other solutions.
(In reply to nli from comment #4) > If no have contents, better to give some tips. > No information in the table, it is best to hide header. > eg: attachmetn 939952 Okay I see, you mean the Groups tab. A few of the tabs are still using the old TurboGears widgets code path and we are intentionally not tackling them as part of this release because we don't have time to port them to Backbone. Those are: Arches, Key/Values, Groups, Excluded Families, Notes, Install Options, Tasks. We will be gradually improving those in future, but not part of this bug (or Beaker 19).
http://gerrit.beaker-project.org/3459 > Qucik Info Box > > * Adjust the order of the quick info boxs. The system’s usage is more > important, so move it to the middle. Done. > * Adjust the width of the box, to cancel the average width. In the large > display, the width of the box is too large and difficult to see. Done, using CSS flexboxes. > * Added owners Done. > * When mouse over the names, prompts the user to click it to send > messages. Not sure what this means -- it already has mailto: hyperlinks with the user's real name and e-mail address shown in a title attribute. > * The underline of time information is necessary? Going to leave the dashed underlines in for now. It is supposed to match the (old) default conventional styling for abbreviations, indicating "you can hover over me to get more details". The extra details in this case is that you can see the precise timestamp. > The Left Navigation Style > > * Reduce the overall width, make it more compact. Done, using flexboxes. > * Strengthen each group heading styles, different with other links. I tried changing the nav group headings to be text colour, but with the bold caps (as they are now) it draws a *lot* of emphasis to them. It makes them feel even more important than the content in the tab itself, which is really not right. They are already grey, rather than the link blue colour, and they don't use a hand cursor, so I don't see how they can be mistaken for links. > * Increase the distance between the groups. Done. > * Right-justified text and select the style of the text, to increase its > relevance and right information. Done, added the right triangle as well as shown in the mock-up. > Table List > > * Remove the row's line, deepen background-color of row, bold line of > the first row. Thickened the <thead> bottom border to 2px, which matches what they have got in Bootstrap 3. I don't think we can darken the row striping colour, because then it will be indistinguishable from the hover colour. I also don't think we can remove the row borders entirely, because there are lots of other tables that are quite dense and cell data often wraps, so omitting the row border in those cases would hurt readability. And I think it's important that the tables on the system page stay visually consistent with the rest of Beaker so I don't want to tweak the styles only on the system page. > * Adjusting the distance between columns and column, easy to read. Removed 'table-condensed' class from the groups and key-values tables. I am going to leave 'table-condensed' for the activity grid though because it is very dense and often doesn't fit well horizontally because of the number of columns. Overrode the default width:100%; rule for the groups and key-values tables so that they don't get stretched out so much. > * Increase mouse over style, it is useful. Added 'table-hover' to the groups and key-values tables. The others already have it. We can't change the table hover colour to yellow because that conflicts with row colouring used elsewhere to convey other meanings. > Info > > * Remove excess lines, narrow the distance of the title and content. Done. Defined a new 'table-vertical' class for the system and CPU sections. > * Expand the distance between the information section, separated by a > dotted line. Done. > * Message using the same style (blue background, blue border.) Done. > Other > > * The long page, increasing the “Back Top” button. I don't think we need a "back to top" button. Even showing the hardware details tab, there will never be more than 2-3 screenfuls of information. I think the "back to top" buttons are a bad idea for all the reasons given here: http://www.cs.tut.fi/~jkorpela/www/totop.html
Marking this as VERIFIED now that 19.0rc2 acceptance testing is complete.
Beaker 19.0 has been released.