Stop file field from hiding filename

[iainbeeston]

Description

On main, even if you choose to display filenames, filenames are hidden for file fields on avo 3.x. This is happening because the parent flexbox is set to flex row and truncate css class was truncating the text down to 0 width.

To fix this I've made the parent flexbox use flex-col, which puts the filename underneath the image (as it was in avo 2.x) so it doesn't get truncated and can be seen.

Fixes # (issue)

Checklist:

• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• I have added tests that prove my fix is effective or that my feature works

Screenshots & recording

Before it looks like this:

On this branch it looks like this:

Manual review steps

1. Find a resource with a files component and set display_filename: true is set to true
2. View it in the browser and confirm that the filename isn't visible
3. Switch to this branch
4. Confirm that the filename is visible now.

Manual reviewer: please leave a comment with output from the test if that's the case.

[adrianthedev]

Thanks for digging into this @iainbeeston