Orders Page - Table Data w/ Really Long Account Names

[bhatiak]

The table is stretched to make all rows occupy 2 lines, starting with shifting the AM / PM in the order time column breaking to the next line.

See the following account / password for an example: jdoes / jdoes

[manmehta0]

Please share any reference for correct implementation.

[bhatiak]

Can the table be switched to fixed width columns? For the one row with the long account name, it will break to two lines and the row will have double the height compared to the other rows.

And a quick note on this. It happens with long account names and when you have PendingNew, New, or PartiallyFilled orders that you can cancel. Both the action and account name columns are fighting for space then.

[nareshbhatia]

Use table-layout: fixed style for your table. See account-table-widget.scss. This will limit 2 line rows only for the long account names.

[nareshbhatia]

Well, simply adding table-layout: fixed will not work. The earlier (default) value of auto had the advantage that it tried to adjust column widths to fit the text as best it could, but the disadvantage is that we did not have precise control on it. With table-layout fixed we need to specify each column width explicitly. See position table as an example. Please do something similar so that headers are in a single line, and ideally there are no wrapping lines in the body.

Also clean up other oddities in _order-table-widget.scss. For example, I do not understand the purpose of:

.orders-table tr td:last-child { padding-right: 20px; }

.orders-table:after { ... }

Also you should not need the following styles if you will explicitly have a style for each column (like in position table):

.orders-table .center { text-align: center; }

.orders-table .number { text-align: right; }