bootstrap_italia-8.x-0.x-dev/patterns/card2/card2-simple.patterns.yml
patterns/card2/card2-simple.patterns.yml
# This is the unique pattern ID.
#
# It is possible to define multiple patterns in a YML file, each with it's own
# unique ID. However, I personally think that it is more logical to have one
# pattern per file to keep them well-separated and organized.
#
# You can however, group similar patterns in a file.
# Example:
# - button
# - button_with_icon
#
card2_simple:
# The label and description are used in the Drupal UI and the pattern library.
label: "Card 2 Simple"
description: "A card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options. https://italia.github.io/bootstrap-italia/docs/componenti/card/#card-semplice"
# Variants definition.
variants:
default:
label: Default
description: https://italia.github.io/bootstrap-italia/docs/componenti/card/#card-semplice
article:
label: Article (tags and date are mandatory)
description: 'In this variant card_category and card_date field are mandatory. https://italia.github.io/bootstrap-italia/docs/componenti/card/#card-articolo-semplice'
icon:
label: Icon (category and icon are mandatory)
description: In this variant card_icon field are mandatory, use the settings to provide a default value. https://italia.github.io/bootstrap-italia/docs/componenti/card/#card-con-icona
image:
label: Image (image field are mandatory)
description: https://italia.github.io/bootstrap-italia/docs/componenti/card/#card-con-immagine
# Settings (ui_patterns_settings module).
settings:
card_shadow:
type: boolean
label: "Enable shadow"
description: "Shows card shadow."
allow_token: true
preview: 1
allow_expose: true
image_panoramic:
type: boolean
label: "Enable image panoramic"
description: "Shows image panoramic."
allow_token: true
preview: 1
allow_expose: true
default_icon:
type: textfield
label: "Default icon"
description: "Choose default icon."
allow_token: true
preview: "it-file"
read_more_type:
type: select
label: Read more type
allow_expose: true
options:
read_more: Default
simple_link: Simple link
content_padding:
type: select
label: Card content padding
allow_expose: true
options:
default: Default (from CSS)
xs: Extra small
sm: Small
md: Medium
lg: Large
xl: Extra large
xxl: Extra extra large
# Fields of data supported by the pattern.
# This can include optional fields which you can handle in your TWIG.
fields:
card_title:
type: text
label: 'Title (field)'
description: 'Card title.'
preview: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor…'
card_subtitle:
type: text
label: 'Subtitle (field)'
description: 'Card subtitle.'
preview: 'Lorem ipsum dolor sit amet'
card_text:
type: text
label: 'Text (eg. body, raw text)'
description: 'Card content.'
preview: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.'
card_category:
type: text
label: 'Category, tag or link (field)'
description: 'Link of the category, tag or taxonomy term to associate.'
preview: 'Category'
card_date:
type: text
label: 'Date (field)'
description: 'Submitting date. Format: Bootstrap Italia Medium Format (dd month yyyy)'
preview: '09 October 2022'
card_icon:
type: text
label: 'Icon (eg. it-name, raw text)'
description: 'https://italia.github.io/bootstrap-italia/docs/utilities/icone/'
preview: 'it-file'
card_signature:
type: text
label: 'Author name (field)'
description: 'The author of the content or signature.'
preview: 'Federico De Paolis'
card_read_more_url:
type: text
label: 'Link (eg. /node/id, raw text).'
description: 'Enter a url in raw text format.'
preview: '#/node/1'
card_image:
type: text
label: 'Image (field)'
description: 'Enter a image field.'
preview: '<img src="https://placehold.co/310x190/0066cc/FFFFFF/?text=EXAMPLE%20IMAGE" title="Image title" alt="Card simple image description">'
# Optional: Attached libraries.
#
# You can include libraries defined by other modules / themes with dependencies.
#
# These libraries are also available for include in theme libraries as
# dependencies. Doing this ensures that the CSS / JS for the pattern are loaded
# irrespective of whether a pattern of that type appears on the page.
# Example: ui_patterns/button.button
# libraries:
# -
# card_simple:
# css:
# component:
# css/card_simple.css: {}
# Optional: Specify a TWIG template with 'use'.
#
# Example:
# use: 'themes/custom/THEME/patterns/blockquote/blockquote.html.twig'
#
# This usually contains a path relative to the Drupal root. Some documentation
# says that a theme-relative path can also be used, but it didn't work for me.
#
# Example:
# use: '@oldie/patterns/blockquote/blockquote.html.twig' (didn't work)
#
# Alternatively, you can use the 'components' module to have better-looking
# and flexible paths.
#
# Examples:
# use: '@patterns/blockquote/blockquote.html.twig'
# use: '@blockquote/blockquote.html.twig'
#
# Not defining 'use' makes the UI Patterns module look for a template with
# the name 'pattern-PATTERN.html.twig. Underscores are changed into dashes.
#
# Example: pattern-blockquote.html.twig
