Fix/592 small css glitch in other media section

[joejoe04]

closes #592

Fixes issues with the select and filter button display on the "Other Media" page including:

Corrects the select element padding so the text doesn't run into the down arrow icon at narrow widths and also so it matches the height of the filter button:

Fixes filter button padding at width of 782px and below so its height continues to match height of select elements:

Changes the top margin of select elements and filter buttons so they adapt with better spacing at narrower display widths:

[Mai-Saad]

Can see the initial problem fixed on chrome, FF, safari.

Note: All folders field width is dependent on selected folder path length i.e for longer path, the width of All folders field increase and corrupt in small screens, Can we fix this? (i.e we can truncate the path of older after a certain length maybe) will this be included in the current PR? @Tabrisrp @joejoe04 what do you think?

[joejoe04]

@Mai-Saad Nice catch on the select element width with long folder names. I’ve added one more commit applying a max-width value to it and it now looks like this at narrow widths:

However, that doesn’t help with the option element inside with the folder names:

I tried doing some searching, but I’m not sure it’s possible to limit the width of these. If this is an issue we should fix, that may need a separate GH issue, where we could possibly do something like limit the values to a specific number of characters, but that could lead to some confusion possibly.

Interested if anyone else has an opinion on this.