diff --git a/templates/patterns/card/card.ui_patterns.yml b/templates/patterns/card/card.ui_patterns.yml index ec4281f90..fed5d040a 100644 --- a/templates/patterns/card/card.ui_patterns.yml +++ b/templates/patterns/card/card.ui_patterns.yml @@ -13,11 +13,26 @@ card: type: string label: 'Orientation' description: 'Can be set to horizontal or vertical. Defaults to vertical.' + left_col_classes: + type: string + label: 'Left column classes' + description: 'When horizontal orientation. Classes of left column.' + preview: 'col-3' + right_col_classes: + type: string + label: 'Right column classes' + description: 'When horizontal orientation. Classes of right column.' + preview: 'col-9' title: type: text label: 'Title' description: 'Card title. Supports markup, e.g. for links.' preview: 'Title card' + title_tag: + type: text + label: 'Title tag' + description: 'Tag to be used for heading' + preview: 'h5' subtitle: type: text label: 'Subtitle' diff --git a/templates/patterns/card/pattern-card.html.twig b/templates/patterns/card/pattern-card.html.twig index e6e0c7d4a..64ed90b90 100644 --- a/templates/patterns/card/pattern-card.html.twig +++ b/templates/patterns/card/pattern-card.html.twig @@ -5,6 +5,8 @@ */ #} {% apply spaceless %} +{% set _left_col_classes = left_col_classes|default('col-4') %} +{% set _right_col_classes = right_col_classes|default('col-8') %} {% set _content %} {% if meta is not empty %} {# Use negative margin to compensate for me-3 on each item. #} @@ -35,11 +37,12 @@ {% include '@oe-bcl/card' with { 'horizontal': orientation == 'horizontal', 'horizontal_grid': (orientation == 'horizontal') ? { - left_col_classes: 'col-4', - right_col_classes: 'col-8', + left_col_classes: _left_col_classes, + right_col_classes: _right_col_classes, gutter: 0, } : {}, 'title': title, + 'title_tag' : title_tag, 'subtitle': (subtitle is not empty) ? { 'content': subtitle, 'classes': 'mb-2',