CSS refinements

[briri]

Now that the Bootstrap overrides are in place on roadmap-stg we should begin another round of review. @dsisu, @sjDCC and @stephaniesimms please take a look at the site now and record any refinements to color, fonts, borders, spacing, alignment, etc. in this ticket.

[stephaniesimms]

• Action menus in tables are cut off on right and bottom of page when user clicks to open the menu (screenshots 1-3)

• When resizing pages on different browsers/devices, the footer wraps and obscures things at bottom of page (e.g., Save, Cancel buttons on Template editing pages, screenshots 4-5)

• Standardize size of pop-up tooltips (they should be wider; screenshot 6)

• Remove filter box - this functionality is provided by column heading sort. Adding Search box above tables as separate issue #815 (screenshot 7)

• Comment editor boxes are cut off on far right on Write plan pages (screenshot 8)

• Make example answers same height as default text box so save button is not so far off.

1- Guidance page - Actions menu cut off at bottom of table

2- Guidance page - Actions menu cut off at bottom and side of table, need more space between table and footer

3- Templates page - same problems with Actions menu and footer

4-5 Templates page - Save, Cancel buttons obscured by footer when resizing page

6 - Pop-up tooltips should be wider

7 - Remove filter box from My Dashboard tables, anywhere else it appears

8 - Fix layout on Write plan page so full text editor for Comments is visible

[briri]

Looks like btn-default and btn-primary have different top margin settings. They should be the same

[briri]

This is happening in Chrome on my laptop. not sure if its happening in other browsers. I have not noticed it on my large iMac monitor. It looks like when the text in the footer is long and causes the navbar to wrap. This causes the footer to sit on top of the bottom portion of the page hiding the 'Save' button

This should be easily reproducible by manually resizing your browser window

[briri]

Update colors of notice/alert messages to match those on the current DMPonline site.

[briri]

the error message on the forgot password page is not the correct color (any color) when you enter an email that is not in the system

[bhavi]

Wud it makes sense to either use btn-default or btn-primary across the app? We are overwriting the styling anyway.

[briri]

yeah we should use those two classes across the site.

[jollopre]

@bhavi for the refactor I made, I used btn-default since it is colourless

[stephaniesimms]

@bhavi - most things are looking good. some minor tweaks:

• left justify the tooltip text (instead of current centered format)
• footer still wraps and obscures action menu items at bottom of page when you resize the window even slightly in Chrome and Firefox (screenshot for My Dashboard). not sure if any more can be done about this? the action buttons (Save) remain visible at least.

[stephaniesimms]

@sjDCC I created a new issue to capture new requests and transferred your comments #867 - we can all continue adding to it for the next round of customizing bootstrap.

@bhavi after you make the minor changes I noted above we can close this one out.

[stephaniesimms]

the two changes noted above still haven't been made. @bhavi please:

• left justify the tooltip text (instead of current centered format)
• footer still wraps and obscures action menu items at bottom of page when you resize the window even slightly in Chrome and Firefox (screenshot for My Dashboard). not sure if any more can be done about this? the action buttons (Save) remain visible at least.

[stephaniesimms]

looks good on roadmap stage. closing issue.