-
Notifications
You must be signed in to change notification settings - Fork 22
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
DP-13951 add more links to suggested pages template (#562)
* DP-13951 add more links to suggested pages template * Add changelog link list to pattern json * Fix styling for suggested pages * Fix image resize issues and guide page regressions * fix spacing issues * Resolve backstop issue with lineheight on suggested guide pages * fix margins on suggested page images * Add margin to svg on location template * fix a spacing scss
- Loading branch information
1 parent
60f2f89
commit fe58f50
Showing
6 changed files
with
139 additions
and
73 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| Minor | ||
| Added | ||
| - (Patternlab) [SuggestedPages] DP-13951: Add option for link list instead of more link to suggested pages. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
74 changes: 43 additions & 31 deletions
74
patternlab/styleguide/source/_patterns/03-organisms/by-author/suggested-pages.twig
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,37 +1,49 @@ | ||
| {% set pageType = '' %} | ||
| {% if suggestedPages.view == 'guide' %} | ||
| {% set pageType = 'guide' %} | ||
| {% endif %} | ||
|
|
||
| <section class="ma__suggested-pages"> | ||
| <section class="ma__suggested-pages {{ pageType }}"> | ||
| <div class="ma__suggested-pages__container"> | ||
| <h2 class="ma__suggested-pages__title">{{ suggestedPages.title }}{% if suggestedPages.titleContext %}<span class="visually-hidden"> {{suggestedPages.titleContext}}</span>{% endif %}</h2> | ||
| <div class="ma__suggested-pages__items"> | ||
| {% if suggestedPages.view == "guide" %} | ||
| {% for page in suggestedPages.pages %} | ||
| {% set illustratedLink = { | ||
| "href": page.link.href, | ||
| "text": page.link.text, | ||
| "info": page.link.info, | ||
| "image": page.image.src ? : page.image } %} | ||
| <div class="ma__suggested-pages__item ma__suggested-pages__item--guide"> | ||
| {% include "@molecules/illustrated-link.twig" %} | ||
| </div> | ||
| {% endfor %} | ||
| {% else %} | ||
| {% for page in suggestedPages.pages %} | ||
| <figure class="ma__suggested-pages__item ma__suggested-pages__item--figure"> | ||
| <a href="{{ page.link.href }}" title="{{ page.link.info }}"> | ||
| {% set image = page.image.src ? page.image : { "alt": page.altTag, "src": page.image } %} | ||
| {% include "@atoms/09-media/image.twig" %} | ||
| </a> | ||
| {% set decorativeLink = page.link %} | ||
| {% include "@atoms/decorative-link.twig" %} | ||
| </figure> | ||
| {% endfor %} | ||
| <div class="ma__suggested-pages__inner-container"> | ||
| <h2 class="ma__suggested-pages__title">{{ suggestedPages.title }}{% if suggestedPages.titleContext %}<span class="visually-hidden"> {{suggestedPages.titleContext}}</span>{% endif %}</h2> | ||
| <div class="ma__suggested-pages__items"> | ||
| {% if suggestedPages.view == "guide" %} | ||
| {% for page in suggestedPages.pages %} | ||
| {% set illustratedLink = { | ||
| "href": page.link.href, | ||
| "text": page.link.text, | ||
| "info": page.link.info, | ||
| "image": page.image.src ? : page.image } %} | ||
| <div class="ma__suggested-pages__item ma__suggested-pages__item--guide"> | ||
| {% include "@molecules/illustrated-link.twig" %} | ||
| </div> | ||
| {% endfor %} | ||
| {% else %} | ||
| {% for page in suggestedPages.pages|slice(0,3) %} | ||
| <div class="ma__suggested-pages__item ma__suggested-pages__item--suggested"> | ||
| <figure class="ma__suggested-pages__item--suggested-figure"> | ||
| <a href="{{ page.link.href }}" title="{{ page.link.info }}"> | ||
| {% set image = page.image.src ? page.image : { "alt": page.altTag, "src": page.image } %} | ||
| {% include "@atoms/09-media/image.twig" %} | ||
| </a> | ||
| {% set decorativeLink = page.link %} | ||
| {% include "@atoms/decorative-link.twig" %} | ||
| </figure> | ||
| </div> | ||
| {% endfor %} | ||
| {% endif %} | ||
| </div> | ||
| {% if suggestedPages.moreLinks %} | ||
| {% set linkList = suggestedPages.moreLinks %} | ||
| {% include "@organisms/by-author/link-list.twig" %} | ||
| {% endif %} | ||
| {% if suggestedPages.more %} | ||
| <div class="ma__suggested-pages__more"> | ||
| {% set link = suggestedPages.more %} | ||
| {% include "@atoms/11-text/link.twig" %} | ||
| </div> | ||
| {% endif %} | ||
| </div> | ||
| {% if suggestedPages.more %} | ||
| <div class="ma__suggested-pages__more"> | ||
| {% set link = suggestedPages.more %} | ||
| {% include "@atoms/11-text/link.twig" %} | ||
| </div> | ||
| {% endif %} | ||
| </div> | ||
| </section> |