{{#ROW_TEMPLATE_BEFORE_ROWS}}
<div class="ma-report--cards #COMPONENT_CSS_CLASSES#">
{{/ROW_TEMPLATE_BEFORE_ROWS}}

{{#BEFORE_COLUMN_HEADING}}{{/BEFORE_COLUMN_HEADING}}

{{#COLUMN_HEADING_TEMPLATE}}{{/COLUMN_HEADING_TEMPLATE}}

{{#AFTER_COLUMN_HEADING}}{{/AFTER_COLUMN_HEADING}}

{{#ROW_TEMPLATE_BEFORE_FIRST}}{{/ROW_TEMPLATE_BEFORE_FIRST}}

{{#ROW_TEMPLATE1}}
<div class="ma-card-col">
  <div class="card">
    <div class="card-image">
      <img src="#IMG_SRC#">
      <span class="card-title">#TITLE#</span>
      <a href="#FAB_LINK#" class="btn-floating btn-large halfway-fab waves-effect waves-light u-color #FAB_COLOR#" title="#FAB_LABEL#" aria-label="#FAB_LABEL#">
        <i class="fa #FAB_ICON_CSS_CLASSES#" aria-hidden="true"></i>
      </a>
    </div>

    <div class="ma-card-stacked m-t-2">
      <div class="card-content">#CONTENT#</div>
      <div class="card-action">#BTN_LABEL_1##BTN_LABEL_2#</div>
    </div>
  </div>
</div>
{{/ROW_TEMPLATE1}}
{{#ROW_TEMPLATE_CONDITION1}}
:FAB_LINK is not null and :FAB_ICON_CSS_CLASSES is not null and :IMG_SRC is not null
{{/ROW_TEMPLATE_CONDITION1}}
{{#ROW_TEMPLATE_DISPLAY_COND1}}
NOT_CONDITIONAL
{{/ROW_TEMPLATE_DISPLAY_COND1}}
{{#ROW_TEMPLATE2}}
<div class="ma-card-col">
  <div class="card ma-card-image-content">
    <div class="card-image">
      <img src="#IMG_SRC#">
      <span class="card-title">#TITLE#</span>
    </div>
    <div class="ma-card-stacked">
      <div class="card-content">
        <p>#CONTENT#</p>
      </div>
      <div class="card-action">#BTN_LABEL_1##BTN_LABEL_2#</div>
    </div>
  </div>

  <div class="card sticky-action ma-card-reveal-content">
    <div class="card-image waves-effect waves-block waves-light">
      <img src="#IMG_SRC#" class="activator">
    </div>
    <div class="card-content">
      <span class="card-title activator">#TITLE#<i class="fa fa-ellipsis-v right" aria-hidden="true"></i></span>
    </div>
    <div class="card-action">#BTN_LABEL_1##BTN_LABEL_2#</div>
    <div class="card-reveal">
      <span class="card-title">#TITLE#<i class="fa fa-ellipsis-v right" aria-hidden="true"></i></span>
      <p>#CONTENT#</p>
    </div>
  </div>
</div>
{{/ROW_TEMPLATE2}}
{{#ROW_TEMPLATE_CONDITION2}}
:IMG_SRC is not null
{{/ROW_TEMPLATE_CONDITION2}}
{{#ROW_TEMPLATE_DISPLAY_COND2}}
NOT_CONDITIONAL
{{/ROW_TEMPLATE_DISPLAY_COND2}}
{{#ROW_TEMPLATE3}}
<div class="ma-card-col">
  <div class="card">
    <div class="card-content">
      <p class="card-title black-text">#TITLE#</p>
      <p>#CONTENT#</p>
    </div>
    <div class="card-action">#BTN_LABEL_1##BTN_LABEL_2#</div>
  </div>
</div>
{{/ROW_TEMPLATE3}}
{{#ROW_TEMPLATE_CONDITION3}}{{/ROW_TEMPLATE_CONDITION3}}
{{#ROW_TEMPLATE_DISPLAY_COND3}}
0
{{/ROW_TEMPLATE_DISPLAY_COND3}}
{{#ROW_TEMPLATE4}}{{/ROW_TEMPLATE4}}
{{#ROW_TEMPLATE_CONDITION4}}{{/ROW_TEMPLATE_CONDITION4}}
{{#ROW_TEMPLATE_DISPLAY_COND4}}
NOT_CONDITIONAL
{{/ROW_TEMPLATE_DISPLAY_COND4}}

{{#ROW_TEMPLATE_AFTER_LAST}}{{/ROW_TEMPLATE_AFTER_LAST}}

{{#ROW_TEMPLATE_AFTER_ROWS}}
</div>
{{/ROW_TEMPLATE_AFTER_ROWS}}

{{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}}
{{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}}
{{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}}
{{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}}
{{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}}

{{#TEMPLATE_OPTION_GROUPS}}
[
  {
    "NAME": "CARD_COLUMNS",
    "DISPLAY_NAME": "Number of columns",
    "DISPLAY_SEQUENCE": 1,
    "HELP_TEXT": "",
    "NULL_TEXT": "",
    "IS_ADVANCED": "N",
    "TEMPLATE_OPTIONS": [
      {
        "NAME": "CARD_COL1",
        "DISPLAY_NAME": "1 Column",
        "DISPLAY_SEQUENCE": 1,
        "CSS_CLASSES": "ma-card-col-1",
        "HELP_TEXT": ""
      },
      {
        "NAME": "CARD_COL2",
        "DISPLAY_NAME": "2 Columns",
        "DISPLAY_SEQUENCE": 2,
        "CSS_CLASSES": "ma-card-col-2",
        "HELP_TEXT": ""
      },
      {
        "NAME": "CARD_COL3",
        "DISPLAY_NAME": "3 Columns",
        "DISPLAY_SEQUENCE": 3,
        "CSS_CLASSES": "ma-card-col-3",
        "HELP_TEXT": ""
      },
      {
        "NAME": "CARD_COL4",
        "DISPLAY_NAME": "4 Columns",
        "DISPLAY_SEQUENCE": 4,
        "CSS_CLASSES": "ma-card-col-4",
        "HELP_TEXT": ""
      }
    ]
  }
]
{{/TEMPLATE_OPTION_GROUPS}}
{{#TEMPLATE_OPTIONS}}
[
  {
    "NAME": "CARD_HORIZONTAL",
    "DISPLAY_NAME": "Horizontal",
    "DISPLAY_SEQUENCE": 1,
    "CSS_CLASSES": "ma-card-horizontal",
    "HELP_TEXT": "If the card contains an image, it will be displayed horizontally",
    "IS_ADVANCED": ""
  },
  {
    "NAME": "CARD_HOVERABLE1",
    "DISPLAY_NAME": "Hoverable",
    "DISPLAY_SEQUENCE": 2,
    "CSS_CLASSES": "ma-card-hoverable",
    "HELP_TEXT": "",
    "IS_ADVANCED": ""
  },
  {
    "NAME": "CARD_REVEAL",
    "DISPLAY_NAME": "Reveal Effect",
    "DISPLAY_SEQUENCE": 3,
    "CSS_CLASSES": "ma-card-reveal",
    "HELP_TEXT": "The content will unfold when clicking on the card.",
    "IS_ADVANCED": "Y"
  }
]
{{/TEMPLATE_OPTIONS}}
{{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}}
{{#PRESET_TEMPLATE_OPTIONS}}
ma-card-col-3
{{/PRESET_TEMPLATE_OPTIONS}}