Customize Folder List and File List Styles

You can customize the styles of Folder List and File List components by adding selectors in the design.css file.

You can use a Folder List component to list the folders within a specified folder from your Oracle Content Management account. The folder list automatically communicates with a File List component and document manager on the page to display the files in a folder selected in the folder list.

You can use a File List component to provide a view of files from a specified folder in your Oracle Content Management account. The file list automatically communicates with a Folder List component on the page to display the files in a folder selected in the folder list.

Folder List CSS Selectors

Use these CSS selectors to customize the style of the Folder List component.

Selector name	Description
.scs-folder-list-cust .scs-folder-list-container	Outmost DIV of the component
.scs-folder-list-cust .scs-folder-list-folder-title	Folder name
.scs-folder-list-cust .scs-folder-list-line-separator	Separator between the folder name and the list of subfolders
.scs-folder-list-cust .scs-folder-list-sub-folder-title	Subfolder name
.scs-folder-list-cust .scs-folder-list-sub-folder-title-active	Subfolder name when it’s selected
.scs-folder-list-cust .scs-folder-list-no-folder-msg	Message when there is no subfolder to display

File List CSS Selectors

Use these CSS selectors to customize the style of the File List component.

Selector name	Description
.scs-file-list-cust .scs-file-list-container	Outmost DIV of the component
.scs-file-list-cust .scs-file-list-folder-title	Folder name
.scs-file-list-cust .scs-file-list-line-separator	Separator between the folder name and the list of files
.scs-file-list-cust .scs-file-list-row	Row that contains the information for a file
.scs-file-list-cust .scs-file-list-left-col	File’s thumbnail located in the left section of the component
.scs-file-list-cust .scs-file-list-mid-col	Middle section of the component, which contains the name, description, last modification, and size of a file
.scs-file-list-cust .scs-file-list-file-title	File name located in the middle section of the app
.scs-file-list-cust .scs-file-list-file-desc	File description located in the middle section of the app
.scs-file-list-cust .scs-file-list-file-lastModified	Last modification of the file
.scs-file-list-cust .scs-file-list-file-size	Size of the file with a vertical separator from the last modification
.scs-file-list-cust .scs-file-list-file-size-no-sep	Size of the file without a vertical separator (last modification not shown)
.scs-file-list-cust .scs-file-list-right-col	Right section of the app
.scs-file-list-cust .scs-file-list-file-download-icon	Download icon located in the right section of the app
.scs-file-list-cust .scs-file-list-no-file-msg	Message when there is no file to display

See File Lists and Folder Lists in Building Sites with Oracle Content Management.