839060 - Make file inputs prettier by appending file icon to files

Status: NEW

(Core :: Layout: Form Controls, enhancement)

Description

[Tomer Cohen :tomer]

Attachment: A mock-up displaying how I think file uploads should look alike

After watching bug 838675 I got the conclusion that there are plans to change the representation of <input type=file> to something better. While most of text inputs have not changed over the past decade, File inputs have been changed a bit with some restrictions (bug 258875) and the addition of dropping files onto the form control (bug 469280).

I'd like to suggest making overall change in its display, to something that most HTML5 applications already implement on their own — additional icon to represent the file content, so the plain HTML file input widget will look similar what web developers do with HTML5, and without the awful gray background we currently have on the control.  

By removing some unnecessary information from the control, such as the file path (bug 838676) we also has the opportunity to include more useful information such as the file size, giving the users a clue about how long the upload would take.