[2.4, UI] Device Discovery page needs fixing

[Andres Rodriguez]

Instead of filing individual bugs I'm filing a single bug for some of the issues in the page (although, there's others):

Loading spinner is on second row
on/off button is too big
Table titles are blue
Table title for 'actions' doesn't match color of rest of titles
No expander icon in table, has a open button instead
Spacing is not correct intable.
spacing makes wrapping of date
Open row its completley unformatted.
Cannot scroll on opened row

[Lee Trager (ltrager)]

I'm also see errors in the browser console on the device discovery page

Firefox:
Error: ngRepeatChild[0] is undefined
compile@http://10.0.0.2:5240/MAAS/combo/vs-repeat.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):152:21
applyDirectivesToNode@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:30261
compileNodes@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:17566
compileNodes@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:17864
compileNodes@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:17864
compileNodes@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:17864
compile@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:15640
link@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):14:7950
bind/<@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):2:11383
invokeLinkFn@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):5:15992
nodeLinkFn@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):5:3508
compositeLinkFn@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:19230
publicLinkFn@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:16884
lazyCompilation@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:23878
boundTranscludeFn@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):4:19695
controllersBoundTransclude@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):5:4664
update@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):14:7240
$broadcast@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):8:24147
commitRoute/<@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):14:4406
processQueue@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):8:9357
scheduleProcessQueue/<@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):8:9649
$eval@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):8:21764
$digest@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):8:19375
$apply@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):8:22200
done@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):6:2147
completeRequest@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):6:5053
requestLoaded@http://10.0.0.2:5240/MAAS/combo/angular.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):6:4127
 <div vs-repeat="" vs-scroll-parent="window"> angular.js:6:24152

Chrome:
TypeError: Cannot read property 'outerHTML' of undefined
    at Object.compile (http://10.0.0.2:5240/MAAS/combo/vs-repeat.js?v=2.4.0~alpha1(6564-g86b2286-0ubuntu1):152:55)
    at applyDirectivesToNode (http://10.0.0.2:5240/MAAS/combo/angular....

[Karl Williams (deadlight)]

I'll take a look at these issues:

>Loading spinner is on second row
That should be a quick fix

>on/off button is too big
This is the default vanilla style. I'll speak to design & UX and see if there are options for smaller controls that are still accessible.

>Table titles are blue
>Table title for 'actions' doesn't match color of rest of titles
The blue ones are styled as links because they are interactive elements (for sorting). The black headings are non-interactive. We have some work planned to add clearer indication to sort order status to these links.

>No expander icon in table, has a open button instead
We've implemented the design rule that menus with fewer than two items are buttons and three or more get a menu.

>Spacing is not correct intable.
>spacing makes wrapping of date
Design are looking at the best treatment to make the table single-line (closer to the more compact style used on, for example, the nodes list).

>Open row its completley unformatted.
The opened row is using the "definition list" and "inline tables" patterns but they're not well suited to this particular context. We'll find a way of styling this in a more cohesive way.

>Cannot scroll on opened row
Can you elaborate on this, please? Scrolling is working normally for me with opened table cells (Ubuntu Chrome & Firefox).

I'll begin work on the fixes that require no input from anyone else now.

[Karl Williams (deadlight)]

I will also find where those errors were introduced and remove the offending code.