Move allowed and blocked instance tables to the column right of linked instance table

[dnswrsrx]

Description

Addresses #2065

I think for most instances, the linked instance list will be longer than the allowed and blocked list, combined or not. So it made sense to join the allowed and blocked instance tables into the same column, to the right of the linked instance table.

If there were blocked instances, they would be shown in another table below Allowed Instances.

Screenshots

Before

After

[camporter]

Looks better. Thoughts on tabs between the linked, blocked, and allowed instances to make it easier to get to the blocked ones as well?

[dnswrsrx]

Hmm, tabs are not a bad option. I'll try it out and post a screenshot of it a bit later on. Or if you (@camporter) wanted to you could to!

[SleeplessOne1917]

There's a Tabs component that's used in some other parts of the UI you can use if you're trying to add tabs.

[dnswrsrx]

A screenshot of the instances organised into tabs. I'm only showing the status tab if there are instances with that status. In this example, there are no blocked instances, so the Blocked Instances tab is not displayed.

[SleeplessOne1917]

I think a max width for the table on screen sizes medium and above would be a good addition. The table looks a bit too spaced out in the screenshot.

[dnswrsrx]

How about something like this? I wrapped the tabs and table in a col-lg-8. On medium screen width and smaller, it'll take the full width. Otherwise it'll be restricted as per that column class.

Live version with these changes to try resizing