File Objects

A File Object represents the presence of a file on the screen to users.

Overview

File Objects give users an efficient view of a file’s info - name, type, and size. You can use a File Object to represent a downloadable file or an uploaded file. Pair with the appropriate file icon from the Icon library (XLS, PDF, PPT, DOC, or CVS).

Design and Layout

The File Object content is split into 4 cells. The icon cell contains the icon that corresponds to the file type, the label cell contains the file name, the file-type cell contains the file extension and the file-size cell contains the file size.

The indi-file-object__cell--label class truncates the file name using CSS allowing file names of any length to be used.

Installation

Props