diff --git a/web/themes/custom/cambridge_tailwind/components/link-grid/link-grid.stories.twig b/web/themes/custom/cambridge_tailwind/components/link-grid/link-grid.stories.twig index 8e54a2512a3ed96ece5785acf0878d667a4e8f3b..ac789867f6170fb322be378dda89777bed0fbdca 100644 --- a/web/themes/custom/cambridge_tailwind/components/link-grid/link-grid.stories.twig +++ b/web/themes/custom/cambridge_tailwind/components/link-grid/link-grid.stories.twig @@ -22,7 +22,7 @@ %} -{% story link_grid_1 with + {% story link_grid_1 with { name: '1. Default', args: { @@ -43,5 +43,59 @@ {% include '@cambridge_tailwind/components/link-grid/link-grid.twig' with { content: { field_link_grid_title: { 0: title }, field_link_grid_description: { 0: description }, field_list_of_links:list_of_links }, nested_paragraph_count: number_of_links } %} {% endstory %} + {% story link_grid_2 with + { + name: '1. Mix of description and no description', + args: { + title: "Heading", + description: "Description of the whole link set", + field_link_url: '/home', + field_link_title: 'Link grid link', + link_description: "A link description", + number_of_links: 6 + } + } %} + {% set list_of_links %} + {% include "@cambridge_tailwind/components/link-grid/link-with-description.twig" with { + field_link_url, + field_link_title: "Special Students at Harvard University", + field_featured_links_description: false, + link_description + } %} + {% include "@cambridge_tailwind/components/link-grid/link-with-description.twig" with { + field_link_url, + field_link_title: "Visiting Student at Yale", + field_featured_links_description: false, + link_description + } %} + {% include "@cambridge_tailwind/components/link-grid/link-with-description.twig" with { + field_link_url, + field_link_title: "Wikipedia page - Henry Fellowship", + field_featured_links_description: false, + link_description + } %} + {% include "@cambridge_tailwind/components/link-grid/link-with-description.twig" with { + field_link_url, + field_link_title: "Wikipedia page - Procter Fellowship", + field_featured_links_description: false, + link_description + } %} + {% include "@cambridge_tailwind/components/link-grid/link-with-description.twig" with { + field_link_url, + field_link_title, + field_featured_links_description: field_featured_links_description ~ "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", + link_description + } %} + {% include "@cambridge_tailwind/components/link-grid/link-with-description.twig" with { + field_link_url, + field_link_title, + field_featured_links_description: + link_description + } %} + {% endset %} + {# Here, use any Twig you want, including custom functions, filters, etc. #} + {% include '@cambridge_tailwind/components/link-grid/link-grid.twig' with { content: { field_link_grid_title: { 0: title }, field_link_grid_description: { 0: description }, field_list_of_links:list_of_links }, nested_paragraph_count: number_of_links } %} + {% endstory %} + {% endstories %} diff --git a/web/themes/custom/cambridge_tailwind/components/link-grid/link-with-description.twig b/web/themes/custom/cambridge_tailwind/components/link-grid/link-with-description.twig index 45359dc47179ae570e874dc2af8e235d0002fe68..338c8954eb5c1380fcd1b1e212f9e31f2ce367c4 100644 --- a/web/themes/custom/cambridge_tailwind/components/link-grid/link-with-description.twig +++ b/web/themes/custom/cambridge_tailwind/components/link-grid/link-with-description.twig @@ -7,13 +7,16 @@ * field_featured_links_description */ #} + +{% set field_featured_links_description %}{{ field_featured_links_description }}{% endset %} + {% from '@cambridge_tailwind/components/link/link.twig' import cardLinkClasses %} {% set imageCardLinkClasses = cardLinkClasses() | spaceless | split(" ") %} {% set linkId = field_link_title | truncate(10) | clean_unique_id %} -<a href="{{ field_link_url }}" class="{{ imageCardLinkClasses | join(" ") }} py-20" aria-labelledby="link_grid_{{linkId}}_label" {% if field_featured_links_description %}aria-describedby="link_grid_{{linkId}}_desc"{% endif %}> +<a href="{{ field_link_url }}" class="{{ imageCardLinkClasses | join(" ") }} py-20" aria-labelledby="link_grid_{{linkId}}_label" {% if field_featured_links_description is not empty %}aria-describedby="link_grid_{{linkId}}_desc"{% endif %}> <p class="text-style-heading-xs" id="link_grid_{{linkId}}_label">{{ field_link_title }}</p> - {% if field_featured_links_description %} + {% if field_featured_links_description is not empty %} <p class="text-text-tertiary text-style-body-sm pt-12" id="link_grid_{{linkId}}_desc">{{ field_featured_links_description }}</p> {% endif %} </a>