About

Cards are useful for presenting a variety of information in small blocks and can be heavily customized. They can be displayed in three styles, with icons or initials, and you can control the layout. With Universal Theme, you can style both Lists or Classic Reports regions to appear as cards by setting the appropriate template.

For Classic Reports, set Cards as the Report Template.

For Lists, set Cards as the List Template.

1. Block

Report Template Options

  • Use DefaultYes
  • Apply Theme ColorsYes
  • StyleBlock
  • IconsDisplay Icons
  • Layout2 Columns
  • AnimationColor Fill

2. Featured

Report Template Options

  • Use DefaultYes
  • Apply Theme ColorsYes
  • StyleFeatured
  • IconsDisplay Icons
  • Layout2 Columns
  • AnimationColor Fill

3. Basic

  • BU

    Bug Tracker

    #CARD_SUBTITLE#

    Created by SHAKEEB (3 years ago)
    Updated 3 years ago
  • CO

    Convert Excel Spreadsheet

    #CARD_SUBTITLE#

    Created by SHAKEEB (3 years ago)
    Updated 3 years ago
  • CU

    Customer Satisfaction Survey

    #CARD_SUBTITLE#

    Created by SHAKEEB (3 years ago)
    Updated 3 years ago
  • DO

    Documentation

    #CARD_SUBTITLE#

    Created by SHAKEEB (3 years ago)
    Updated 3 years ago

Report Template Options

  • Use DefaultYes
  • StyleBasic
  • IconsDisplay Initials
  • Layout2 Columns
  • Apply Theme ColorsYes

4. Compact

  • BU

    Bug Tracker

    #CARD_SUBTITLE#

    Created by SHAKEEB (3 years ago)
    Updated 3 years ago
  • CO

    Convert Excel Spreadsheet

    #CARD_SUBTITLE#

    Created by SHAKEEB (3 years ago)
    Updated 3 years ago
  • CU

    Customer Satisfaction Survey

    #CARD_SUBTITLE#

    Created by SHAKEEB (3 years ago)
    Updated 3 years ago
  • DO

    Documentation

    #CARD_SUBTITLE#

    Created by SHAKEEB (3 years ago)
    Updated 3 years ago

Report Template Options

  • Use DefaultYes
  • StyleCompact
  • Apply Theme ColorsYes
  • IconsDisplay Initials
  • Layout2 Columns

List Template Customization

Custom Attributes

#A01#
Description
#A02#
Secondary Information
#A03#
Initials
#A04#
List Item CSS Classes
#A05#
Link Attributes
#A06#
Card Color Class
#A07#
Subtitle

Template Options

  • General

    • Use Template Defaults
    • Apply Theme Colors
      Applies the colors from the theme's color palette to the icons or initials within cards.
    • Display Subtitle
  • Style

    • Basic
    • Compact
      Use this option when you want to show smaller cards.
    • Featured
    • Block
  • Icons

    • No Icons
    • Display Icons
    • Display Initials
      Initials come from List Attribute 3
  • Layout

    • Stacked
      Stacks the cards on top of each other.
    • 2 Columns
    • 3 Columns
    • 4 Columns
    • 5 Columns
    • Float
    • Span Horizontally
  • Body Text

    Determines the height of the card body.

    • Auto
    • 2 Lines
    • 3 Lines
    • 4 Lines
    • Hidden
      This option hides the card body which contains description and subtext.
  • Animation

    Sets the hover and focus animation.

    • Color Fill
      Fills the card background with the color of the icon or default link style.
    • Raise Card
      Raises the card so it pops up.

Report Template Customization

Substitution Strings

#CARD_MODIFIERS#
Card CSS Class
#CARD_COLOR#
Card Color Class
#CARD_ICON#
Icon
#CARD_INITIALS#
Initials
#CARD_TITLE#
Title
#CARD_LINK#
Link
#CARD_SUBTITLE#
Subtitle
#CARD_TEXT#
Description text
#CARD_SUBTEXT#
Secondary description text

Sample Report Query

select -- data card_title, -- title card_subtitle, -- subtitle, set template option to see card_text, -- card body text card_subtext, -- card secondary text, positioned near bottom -- ui and other attributes card_modifiers, -- card item modifiers card_link, -- card link, use apex_page.get_url(...) card_color, -- color modifier, e.g. u-color-1 or u-warning card_icon, -- icon class, e.g. fa-cloud card_initials -- 2 or 3 letters, use apex_string.get_initials(...) from dual

Template Options

  • General

    • Use Template Defaults
    • Apply Theme Colors
    • Display Subtitle
  • Style

    Determines the overall style for the component.

    • Basic
    • Compact
      Use this option when you want to show smaller cards.
    • Featured
    • Block
  • Icons

    Controls how to handle icons in the report.

    • No Icons
    • Display Icons
    • Display Initials
  • Layout

    Determines the layout of Cards in the report.

    • 2 Columns
    • 3 Columns
    • 4 Columns
    • 5 Columns
    • Float
    • Span Horizontally
  • Body Text

    Determines the height of the card body.

    • Auto
    • 2 Lines
    • 3 Lines
    • 4 Lines
    • Hidden
      This option hides the card body which contains description and subtext.
  • Animation

    Sets the hover and focus animation.

    • Color Fill
    • Raise Card
  • Advanced

    Pagination Display

    Controls the display of pagination for this region.

    • Default
    • Hide when all rows displayed
      This option will hide the pagination when all rows are displayed.