Display Pattern Help

Owned by Elaine Foley
Dec 18, 2023
8 min read

More general details about Display Pattern Display Pattern

File Type Pattern

The following code fragments can be used:

<cp-overlay-box-top-left style="..."></cp-overlay-box-top-left> <cp-overlay-box-bottom-left style="..."></cp-overlay-box-bottom-left> <cp-overlay-box-bottom-right style="..."></cp-overlay-box-bottom-right>

Rules

  • the style property is optional: if defined it will allow overriding the default styles of the overlay box. It directly binds to the style attribute of an HTML element and therefore can contain standard CSS style attributes

  • The content of each element can be other HTML tags or text

  • See Examples for some examples of different display patterns for different FileTypes / VirtualTypes

Virtual Item Pattern

<cp-thumbnail-content></cp-thumbnail-content> <cp-overlay-box-top-left></cp-overlay-box-top-left> <cp-overlay-box-bottom-left></cp-overlay-box-bottom-left> <cp-overlay-box-bottom-right></cp-overlay-box-bottom-right>

Icons

Only a limited set of icons will be supported with the overnext release. We implemented backward compatibility with Picturepark Weisshorn to ensure that you have enough time to update the icons to the new supported ones.

Embed icons with

<cp-icon name="video-image" size="24"></cp-icon>

Example Image

Examples for all File Types