Make Datatable Responsive

[TimothyMee]

The data-table before this commit wasn't responsive,
and when the number of columns increase or the
screen reduces, data are lost.

This commit fixes that issue,
so when the screen reduces a scrollbar is introduced,
this stops the issue of losing visuals of the data in the table.

[MicroDroid]

This PR has multiple issues:

1. overflow-x: scroll causes the scrollbar to be permanently visible, whereas it should be auto so that the scrollbar only shows when needed.
2. Long data (like descriptions for things) will cause the scrollbar to show even for desktop screens
3. This should be entirely optional.

[cssailing]

when you are view table on mobile, you can choose to 'scroll', use the table swipe from right or to left,
or you can make the table tr { display: inline-block;}
or you can make table tr{display: none;} to hidden tr, and make td data-lable show as td's title, and the table swipe up and down

[MicroDroid]

@cssailing That doesn't make sense.