From 17d9eb2d79b985a3dff30d70647da87645fccea0 Mon Sep 17 00:00:00 2001
From: wodby <wodby@example.com>
Date: Fri, 4 Jun 2021 15:33:52 +0000
Subject: [PATCH] additional rebase card merge
---
css/styles.css | 91 +++++++++-----
css/uw-dashboards.css | 6 +-
js/component_scripts.min.js | 34 +++---
.../00-config/01-mixins/_mixins.uw.scss | 23 +++-
.../02-html-elements/25-forms/forms.twig | 3 +-
.../_patterns/03-layouts/footer/footer.twig | 3 -
.../_patterns/03-layouts/layout/_layout.scss | 15 ++-
.../layout/layout--1-col/_layout--1-col.scss | 2 -
.../layout/layout--3-col/_layout--3-col.scss | 1 -
.../layout/layout--4-col/_layout--4-col.scss | 2 -
.../03-layouts/sidebar/_sidebar.scss | 3 +
.../site-container/site-container.twig | 3 +
.../_patterns/04-components/card/_card.scss | 21 ++--
source/_patterns/04-components/card/card.twig | 40 +++----
.../content-grid-list/_content-grid-list.scss | 21 +++-
.../content-grid-list/content-grid-list.twig | 41 +++++--
.../content-grid-list/content-grid-list.yml | 45 +++++++
source/_patterns/05-templates/termpage.twig | 6 +-
source/_patterns/05-templates/termpage.yml | 112 ++++++++++++------
19 files changed, 332 insertions(+), 140 deletions(-)
diff --git a/css/styles.css b/css/styles.css
index c3168e82..8320b4dc 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -2048,6 +2048,10 @@ svg:not(:root) {
margin-bottom: 2.5rem;
margin-top: 1.5rem;
position: relative; }
+ .uw-term--layout .uw-content-grid-list__style_controls {
+ order: 1;
+ padding: 0;
+ width: 100%; }
.uw-term--layout .l-section {
margin: 0 !important;
width: 100%; }
@@ -2059,7 +2063,7 @@ svg:not(:root) {
width: 100%; }
.uw-term--layout .uw-term--filters .uw-input {
width: 100%; }
- @media (min-width: 48.06rem) {
+ @media (min-width: 40.06rem) {
.uw-term--layout {
flex-direction: row;
gap: 1.5rem; }
@@ -3455,11 +3459,19 @@ button {
.card--show-hover:hover, .card--show-hover:focus-within {
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); }
+.card__header {
+ display: flex;
+ flex-direction: column;
+ margin-bottom: 1rem;
+ width: 100%; }
+
.card__date {
- font-size: 1rem; }
+ font-size: 1rem;
+ margin-bottom: 1rem; }
.card__author {
- font-size: 1rem; }
+ font-family: Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
+ font-size: 14.22224px; }
.card__author a {
color: #000;
text-decoration: underline; }
@@ -3471,16 +3483,19 @@ button {
.card__author a:active {
color: #757575; }
-.card__title a {
- color: #000;
- text-decoration: underline; }
- .card__title a:visited {
- color: #000; }
- .card__title a:hover, .card__title a:focus {
- color: #757575;
+.card__title {
+ margin: 0.5rem 0;
+ padding: 0; }
+ .card__title a {
+ color: #000;
text-decoration: none; }
- .card__title a:active {
- color: #757575; }
+ .card__title a:visited {
+ color: #000; }
+ .card__title a:hover, .card__title a:focus {
+ color: #757575;
+ text-decoration: underline; }
+ .card__title a:active {
+ color: #757575; }
.card__body {
display: flex;
@@ -3701,30 +3716,50 @@ button {
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
- gap: 1.25rem !important; }
- .uw-flex-grid .card {
- -webkit-box: 1;
- -moz-box: 1;
- -webkit-flex: 1 0 auto;
- -ms-flex: 1 0 auto;
- flex: 1 0 auto;
- -webkit-box-align: start;
- -moz-box-align: start;
- -ms-flex-align: start;
- -webkit-align-items: flex-start;
- align-items: flex-start;
- width: 100%; }
- @media (min-width: 40.06rem) {
- .uw-flex-grid .card {
+ gap: 1.25rem !important;
+ max-width: 75rem; }
+ .uw-flex-grid .uw-content-grid-list__style_controls {
+ width: 100%;
+ -webkit-align-content: flex-end;
+ -ms-flex-line-pack: end;
+ align-content: flex-end;
+ order: 1;
+ width: 100% !important; }
+ .uw-flex-grid .uw-content-grid-list__style_controls .uw-layout--controls {
+ padding: 1rem 0;
+ text-align: right; }
+ @media (min-width: 63.1875rem) {
+ .uw-flex-grid .uw-content-grid-list__style_controls {
+ -webkit-box: 1;
+ -moz-box: 1;
+ -webkit-flex: 1 1 auto 0 auto;
+ -ms-flex: 1 1 auto 0 auto;
+ flex: 1 1 auto 0 auto;
-webkit-box-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
-webkit-flex-grow: 1;
flex-grow: 1;
width: 45%; } }
+ .uw-flex-grid .card {
+ width: 100%;
+ order: 3; }
@media (min-width: 63.1875rem) {
.uw-flex-grid .card {
- width: 30%; } }
+ -webkit-box: 1;
+ -moz-box: 1;
+ -webkit-flex: 1 1 auto 0 auto;
+ -ms-flex: 1 1 auto 0 auto;
+ flex: 1 1 auto 0 auto;
+ -webkit-box-flex: 1;
+ -moz-box-flex: 1;
+ -ms-flex: 1;
+ -webkit-flex-grow: 1;
+ flex-grow: 1;
+ width: 45%; } }
+ .uw-flex-grid .card:first-child {
+ order: 2;
+ width: 100% !important; }
.uw-copy-text__wrapper.uw-contained-width {
margin-left: auto;
diff --git a/css/uw-dashboards.css b/css/uw-dashboards.css
index ed39eb68..da8b493a 100644
--- a/css/uw-dashboards.css
+++ b/css/uw-dashboards.css
@@ -469,6 +469,10 @@
margin-bottom: 2.5rem;
margin-top: 1.5rem;
position: relative; }
+ .uw-term--layout .uw-content-grid-list__style_controls {
+ order: 1;
+ padding: 0;
+ width: 100%; }
.uw-term--layout .l-section {
margin: 0 !important;
width: 100%; }
@@ -480,7 +484,7 @@
width: 100%; }
.uw-term--layout .uw-term--filters .uw-input {
width: 100%; }
- @media (min-width: 48.06rem) {
+ @media (min-width: 40.06rem) {
.uw-term--layout {
flex-direction: row;
gap: 1.5rem; }
diff --git a/js/component_scripts.min.js b/js/component_scripts.min.js
index 77e7464f..c787838a 100644
--- a/js/component_scripts.min.js
+++ b/js/component_scripts.min.js
@@ -1,20 +1,3 @@
-/**
- * @file
- * Ckeditor Modal.
- */
-
-(function ($, Drupal) {
- if ($.ui && $.ui.dialog) {
- orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
- $.ui.dialog.prototype._allowInteraction = function (event) {
- if ($(event.target).closest('.cke_dialog').length) {
- return true;
- }
- return orig_allowInteraction.apply(this, arguments);
- };
- }
-})(jQuery, Drupal);
-
(function ($, Drupal) {
Drupal.behaviors.cardbanner = {
attach: function (context, settings) {
@@ -342,6 +325,23 @@ else {
};
})(jQuery);
+/**
+ * @file
+ * Ckeditor Modal.
+ */
+
+(function ($, Drupal) {
+ if ($.ui && $.ui.dialog) {
+ orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
+ $.ui.dialog.prototype._allowInteraction = function (event) {
+ if ($(event.target).closest('.cke_dialog').length) {
+ return true;
+ }
+ return orig_allowInteraction.apply(this, arguments);
+ };
+ }
+})(jQuery, Drupal);
+
/**
* @file
*/
diff --git a/source/_patterns/00-config/01-mixins/_mixins.uw.scss b/source/_patterns/00-config/01-mixins/_mixins.uw.scss
index beee7625..e5392802 100644
--- a/source/_patterns/00-config/01-mixins/_mixins.uw.scss
+++ b/source/_patterns/00-config/01-mixins/_mixins.uw.scss
@@ -238,10 +238,15 @@
@mixin uw-flex-grid($value: flexbox){
@if $value == inline-flex {
@include inline-flex();
- }@else{
+ @include flex-flow(row wrap);
+ }@else if $value == term{
@include flexbox();
- }
+ @include flex-wrap(wrap);
+ }@else{
+ @include flexbox();
@include flex-flow(row wrap);
+}
+
gap:1.25rem !important;
}
// Display of grid item.
@@ -250,6 +255,7 @@
@include align-items(flex-start);
width:100%;
@include small{
+ @include flex(1 1 auto);
@include flex-grow(1);
width: 45%;
}
@@ -261,7 +267,15 @@
//}
}
-
+// Display of list item.
+@mixin uw-flex-term-item(){
+ width:100%;
+ @include large{
+ @include flex(1 1 auto);
+ @include flex-grow(1);
+ width: 45%;
+ }
+}
// Display of elements in list style.
@mixin uw-flex-list(){
@@ -273,8 +287,6 @@
}
-
-
// Display of elements in mosaic style.
@mixin uw-flex-mosaic(){
//
@@ -285,7 +297,6 @@
}
-
// Display of elements gallery style.
@mixin uw-flex-gallery(){
diff --git a/source/_patterns/02-base/02-html-elements/25-forms/forms.twig b/source/_patterns/02-base/02-html-elements/25-forms/forms.twig
index 0c76486a..9a7147f0 100644
--- a/source/_patterns/02-base/02-html-elements/25-forms/forms.twig
+++ b/source/_patterns/02-base/02-html-elements/25-forms/forms.twig
@@ -56,6 +56,7 @@
'is_button_tag': true,
'text': form_item.text,
'type': form_item.type,
+ 'button_modifer_classes': item.button_modifer_classes,
'classes': form_item.classes,
'formaction': form_item.formaction,
'form': form_item.form,
@@ -125,4 +126,4 @@
{% endif %}
-</form>
\ No newline at end of file
+</form>
diff --git a/source/_patterns/03-layouts/footer/footer.twig b/source/_patterns/03-layouts/footer/footer.twig
index 3e8a9ab3..0c544894 100644
--- a/source/_patterns/03-layouts/footer/footer.twig
+++ b/source/_patterns/03-layouts/footer/footer.twig
@@ -37,6 +37,3 @@
</div>
</div>
</footer>
-{% if is_demo_footer %}
- {% include "@components/eu-cookie-compliance/eu-cookie-compliance.twig" %}
-{% endif %}
\ No newline at end of file
diff --git a/source/_patterns/03-layouts/layout/_layout.scss b/source/_patterns/03-layouts/layout/_layout.scss
index c73046b0..e36053b3 100644
--- a/source/_patterns/03-layouts/layout/_layout.scss
+++ b/source/_patterns/03-layouts/layout/_layout.scss
@@ -54,25 +54,36 @@ $sidebar-width: 18.75rem;
margin-bottom:2.5rem;
margin-top:1.5rem;
position:relative;
-
+ .uw-content-grid-list{
+ &__style_controls{
+ //background: #d75a5a;
+ order:1;
+ padding:0;
+ width:100%;
+ }
+ }
.l-section{
margin:0 !important;
width:100%;
}
.uw-term--header{
+ //background: #94d75a;
width:100%;
}
.uw-term--results{
+ //background: #d26a2f;
width:100%;
+ .uw-term--results{}
}
.uw-term--filters{
+ //background: rgba(43, 131, 186, 0.5);
width:100%;
.uw-input{
width:100%;
}
}
- @include medium {
+ @include small {
flex-direction: row;
gap: 1.5rem;
.uw-term--header{
diff --git a/source/_patterns/03-layouts/layout/layout--1-col/_layout--1-col.scss b/source/_patterns/03-layouts/layout/layout--1-col/_layout--1-col.scss
index ba10c2c4..ae3f338f 100644
--- a/source/_patterns/03-layouts/layout/layout--1-col/_layout--1-col.scss
+++ b/source/_patterns/03-layouts/layout/layout--1-col/_layout--1-col.scss
@@ -6,5 +6,3 @@
.layout--uw-1-col .layout__region--first {
grid-column: 1 / 2;
}
-
-
diff --git a/source/_patterns/03-layouts/layout/layout--3-col/_layout--3-col.scss b/source/_patterns/03-layouts/layout/layout--3-col/_layout--3-col.scss
index e7833ebc..f1fe4f91 100644
--- a/source/_patterns/03-layouts/layout/layout--3-col/_layout--3-col.scss
+++ b/source/_patterns/03-layouts/layout/layout--3-col/_layout--3-col.scss
@@ -59,4 +59,3 @@
}
}
}
-
diff --git a/source/_patterns/03-layouts/layout/layout--4-col/_layout--4-col.scss b/source/_patterns/03-layouts/layout/layout--4-col/_layout--4-col.scss
index 2cd42a8c..9c5d83ca 100644
--- a/source/_patterns/03-layouts/layout/layout--4-col/_layout--4-col.scss
+++ b/source/_patterns/03-layouts/layout/layout--4-col/_layout--4-col.scss
@@ -62,5 +62,3 @@
}
}
}
-
-
diff --git a/source/_patterns/03-layouts/sidebar/_sidebar.scss b/source/_patterns/03-layouts/sidebar/_sidebar.scss
index 6083d170..b2d517a2 100644
--- a/source/_patterns/03-layouts/sidebar/_sidebar.scss
+++ b/source/_patterns/03-layouts/sidebar/_sidebar.scss
@@ -47,6 +47,9 @@ $l-sidebar-gutter: rem(gesso-spacing(sm));
}
}
+.l-sidebar-offcanvas{
+
+}
.l-sidebar--multi-2 {
@include breakpoint($l-sidebar-bp) {
diff --git a/source/_patterns/03-layouts/site-container/site-container.twig b/source/_patterns/03-layouts/site-container/site-container.twig
index 2368a978..65af0137 100644
--- a/source/_patterns/03-layouts/site-container/site-container.twig
+++ b/source/_patterns/03-layouts/site-container/site-container.twig
@@ -20,5 +20,8 @@
'menu_name': footer_menu_name,
'items': footer_menu
}%}
+ {% if pattern_lab %}
+ {% include "@components/eu-cookie-compliance/eu-cookie-compliance.twig" %}
+ {% endif %}
{% endblock %}
</div>
diff --git a/source/_patterns/04-components/card/_card.scss b/source/_patterns/04-components/card/_card.scss
index 0ced2d10..a76faf00 100644
--- a/source/_patterns/04-components/card/_card.scss
+++ b/source/_patterns/04-components/card/_card.scss
@@ -22,27 +22,34 @@ $card-padding: rem(gesso-spacing(sm)) !default;
}
}
.card__header{
-
+ display:flex;
+ flex-direction: column;
+ margin-bottom: rem(gesso-spacing(sm));
+ width:100%;
}
.card__date {
font-size: rem(gesso-font-size(0));
+ margin-bottom: rem(gesso-spacing(sm));
}
.card__author{
- font-size: rem(gesso-font-size(0));
+ font-family: gesso-font-family(systemmedium);
+ font-size: gesso-font-size(-1);
a {
@include link(
- $card-link-color,
- $card-link-color-hover
+ $card-link-color,
+ $card-link-color-hover
);
}
}
.card__title {
+ margin:rem(gesso-spacing(xs)) 0;
+ padding:0;
a {
- @include link(
- $card-link-color,
- $card-link-color-hover
+ @include link-reverse(
+ $card-link-color,
+ $card-link-color-hover
);
}
}
diff --git a/source/_patterns/04-components/card/card.twig b/source/_patterns/04-components/card/card.twig
index 66d07abe..b90ee927 100644
--- a/source/_patterns/04-components/card/card.twig
+++ b/source/_patterns/04-components/card/card.twig
@@ -28,11 +28,11 @@
{% if title %}
<h{{ header_level }} class="card__title">
{% if url %}
- <a href="{{ url }}">
- {% endif %}
- {{ title }}
- {% if url %}
- </a>
+ <a href="{{ url }}">
+ {% endif %}
+ {{ title }}
+ {% if url %}
+ </a>
{% endif %}
</h{{ header_level }}>
{% endif %}
@@ -46,14 +46,14 @@
{% if author_name %}
<div class="card__author">
{% if author_link %}
- by
- <a href="{{ author_link }}">
- {% endif %}
+ by
+ <a href="{{ author_link }}">
+ {% endif %}
- {{ author_name }}
+ {{ author_name }}
- {% if author_link %}
- </a>
+ {% if author_link %}
+ </a>
{% endif %}
</div>
{% endif %}
@@ -65,17 +65,17 @@
{% if sources or img_element %}
<div class="card__media">
{% if url %}
- <a href="{{ url }}">
- {% endif %}
+ <a href="{{ url }}">
+ {% endif %}
- {% include "@components/responsive-image/responsive-image.twig" with {
- sources: sources,
- img_element: img_element,
- alt: alt
- } %}
+ {% include "@components/responsive-image/responsive-image.twig" with {
+ sources: sources,
+ img_element: img_element,
+ alt: alt
+ } %}
- {% if url %}
- </a>
+ {% if url %}
+ </a>
{% endif %}
</div>
{% endif %}
diff --git a/source/_patterns/04-components/content-grid-list/_content-grid-list.scss b/source/_patterns/04-components/content-grid-list/_content-grid-list.scss
index c8b4d686..9e0b1371 100644
--- a/source/_patterns/04-components/content-grid-list/_content-grid-list.scss
+++ b/source/_patterns/04-components/content-grid-list/_content-grid-list.scss
@@ -1,6 +1,25 @@
.uw-flex-grid{
@include uw-flex-grid();
+ max-width:$max-width;
+ .uw-content-grid-list{
+ &__style_controls{
+ .uw-layout--controls{
+ padding:1rem 0;
+ text-align:right;
+
+ }
+ @include uw-flex-term-item();
+ @include align-content(flex-end);
+ order:1;
+ width:100% !important;
+ }
+ }
.card{
- @include uw-flex-grid-item();
+ @include uw-flex-term-item();
+ &:first-child{
+ order:2;
+ width:100% !important;
+ }
+ order:3;
}
}
diff --git a/source/_patterns/04-components/content-grid-list/content-grid-list.twig b/source/_patterns/04-components/content-grid-list/content-grid-list.twig
index 7f00a510..dbea7817 100644
--- a/source/_patterns/04-components/content-grid-list/content-grid-list.twig
+++ b/source/_patterns/04-components/content-grid-list/content-grid-list.twig
@@ -1,20 +1,42 @@
-{% set grid_modifier_classes = 'l-grid--1col' %}
-
-{% embed '@layouts/grid/grid.twig' with {
- 'modifier_classes': grid_modifier_classes
-} %}
-
{% block content %}
+ {% include '@global/06-break-hints/break-hints.twig' %}
{% if flex_modifier_classes %}
- <div class="{{ flex_modifier_classes }}">
+ <div class="{{ flex_modifier_classes }} {{ layout_style }}">
{% endif %}
+ {% if layout_style or use_offcanvas %}
+
+ <div class="uw-content-grid-list__style_controls">
+ {% set button_modifier_classes -%}
+ button button--small {{ button_modifier_classes }}
+ {%- endset %}
+
+ {% if layout_style %}
+ {% set button_modifier_classes -%}
+ button button--small button--toggle_layout {{ modifier_classes }}
+ {%- endset %}
+ {% endif %}
+ {% if use_offcanvas %}
+ {% set button_modifier_classes -%}
+ button button--small button--offcanvas {{ modifier_classes }}
+ {%- endset %}
+ {% endif %}
+
+ {% include '@base/02-html-elements/25-forms/forms.twig' with {
+ 'form_items': form_items,
+ 'modifier_classes': button_modifier_classes
+ } %}
+
+ </div>
+
+ {% endif %}
{% for item in lists %}
{% include "@components/card/card.twig" with {
modifier_classes: item.modifier_classes,
title: item.title,
+ header_level: '2',
url: item.url,
footer: item.footer,
date: item.date,
@@ -26,7 +48,9 @@
img_element: item.img_element,
alt: item.alt,
content: item.content,
- show_hover: 'true'
+ show_hover: 'true',
+ author_name: item.author_name,
+ author_link: item.author_link
} %}
{% endfor %}
{% if content %}
@@ -37,4 +61,3 @@
{% endif %}
{% endblock %}
-{% endembed %}
diff --git a/source/_patterns/04-components/content-grid-list/content-grid-list.yml b/source/_patterns/04-components/content-grid-list/content-grid-list.yml
index c9c744c4..e0b8551d 100644
--- a/source/_patterns/04-components/content-grid-list/content-grid-list.yml
+++ b/source/_patterns/04-components/content-grid-list/content-grid-list.yml
@@ -3,6 +3,7 @@ flex_modifier_classes: 'uw-flex-grid'
lists:
-
title: 'Blog Teaser title 1'
+ header_level: '2'
url: '#'
date:
- 'Friday, September 18, 2020'
@@ -41,6 +42,7 @@ lists:
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
-
title: 'Blog Teaser title 2'
+ header_level: '2'
url: '#'
date:
- 'Friday, September 18, 2020'
@@ -79,6 +81,7 @@ lists:
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
-
title: 'Blog Teaser title 3'
+ header_level: '2'
url: '#'
date:
- 'Friday, September 18, 2020'
@@ -117,6 +120,7 @@ lists:
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
-
title: 'News Teaser title 1'
+ header_level: '2'
url: '#'
date:
- 'Sep. 18, 2020'
@@ -144,6 +148,7 @@ lists:
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
-
title: 'News Teaser title 2'
+ header_level: '2'
url: '#'
date:
- 'Sep. 18, 2020'
@@ -171,6 +176,7 @@ lists:
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
-
title: 'News Teaser title 3'
+ header_level: '2'
url: '#'
date:
- 'Sep. 18, 2020'
@@ -198,6 +204,7 @@ lists:
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
-
title: 'Event Teaser title 1'
+ header_level: '2'
url: '#'
date:
- 'Friday, September 18, 2020 2:20- 4:20 PM EDT'
@@ -225,6 +232,7 @@ lists:
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
-
title: 'Event Teaser title 2'
+ header_level: '2'
url: '#'
date:
- 'Friday, September 18, 2020 2:20- 4:20 PM EDT'
@@ -250,6 +258,7 @@ lists:
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
-
title: 'Event Teaser title 3'
+ header_level: '2'
url: '#'
date:
- 'Friday, September 18, 2020 2:20- 4:20 PM EDT'
@@ -275,3 +284,39 @@ lists:
show_hover: true
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
+form_classes: 'uw-layout--controls'
+layout_style: 'grid'
+use_offcanvas: true
+form_items:
+ - is_button_tag: true
+ form_item_wrapper: false
+ is_demo: false
+ is_disabled: false
+ type: ''
+ classes: button_modifier_classes
+ modifier_classes: button_modifier_classes
+ formaction: ''
+ form: ''
+ name: ''
+ formenctype: ''
+ value: ''
+ formmethod: ''
+ formtarget: ''
+ text: 'toggle-layout'
+ btnclick: |
+ - is_button_tag: true
+ form_item_wrapper: false
+ is_demo: false
+ is_disabled: false
+ type: ''
+ classes: button_modifier_classes
+ modifier_classes: button_modifier_classes
+ formaction: ''
+ form: ''
+ name: ''
+ formenctype: ''
+ value: ''
+ formmethod: ''
+ formtarget: ''
+ text: 'off-canvas'
+ btnclick: |
diff --git a/source/_patterns/05-templates/termpage.twig b/source/_patterns/05-templates/termpage.twig
index 10412082..7f505a0d 100644
--- a/source/_patterns/05-templates/termpage.twig
+++ b/source/_patterns/05-templates/termpage.twig
@@ -35,7 +35,7 @@
'section_title': false,
'section_content': termpage_title,
'has_constrain' : true,
- 'constrain_modifier_classes': 'l-constrain--no-padding'
+ 'constrain_modifier_classes': 'l-term-title l-constrain--no-padding'
} %}
{% include '@layouts/section/section.twig' with {
@@ -43,7 +43,7 @@
'section_title': false,
'section_content': termpage_results,
'has_constrain' : true,
- 'constrain_modifier_classes': 'l-constrain--no-padding'
+ 'constrain_modifier_classes': 'l-term-results l-constrain--no-padding'
} %}
{% include '@layouts/section/section.twig' with {
@@ -51,7 +51,7 @@
'section_title': false,
'section_content': termpage_filters,
'has_constrain' : false,
- 'constrain_modifier_classes': 'l-constrain--no-padding'
+ 'constrain_modifier_classes': 'l-term-filters l-constrain--no-padding'
} %}
{% endblock %}
{% endembed %}
diff --git a/source/_patterns/05-templates/termpage.yml b/source/_patterns/05-templates/termpage.yml
index d9b6fb6b..c6beafef 100644
--- a/source/_patterns/05-templates/termpage.yml
+++ b/source/_patterns/05-templates/termpage.yml
@@ -1,7 +1,7 @@
---
cookie:
text: '<h2>We use cookies on this site to enhance the user experience.</h2><p>Select "Accept all" to agree and continue. You consent to our cookies if you continue to use this website.</p>'
-termpage_title: 'News'
+termpage_title: 'Blog'
termpage_image:
termpage_content: |-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi quis mattis ipsum, non hendrerit justo. Pellentesque libero dui, varius ut ex quis, interdum aliquet est. Integer iaculis sapien libero, ut ullamcorper est tristique et. Vivamus orci nunc, commodo at vulputate gravida, tempus id nisi. Praesent feugiat elit at nunc dignissim consequat. Cras posuere venenatis augue, quis ultricies mauris sagittis quis. Proin blandit arcu est, ac pulvinar ante tristique non. Suspendisse eu maximus erat. Vestibulum hendrerit arcu id ex ullamcorper, id ultrices magna euismod. Maecenas id elit ultrices purus elementum sollicitudin. Sed id magna id metus pretium vulputate id a risus. Curabitur tellus quam, congue tristique rutrum in, sagittis vel nibh. Mauris aliquet purus vel faucibus faucibus. Nullam lacinia diam ante, nec consequat sem pulvinar non. Mauris et dolor quis metus cursus fermentum nec vitae risus.</p>
@@ -84,15 +84,12 @@ filter_items:
name: ''
type: 'text'
placeholder: '10text'
-
-
-
modifier_classes: ''
grid_modifier_classes: 'uw-term--layout'
flex_modifier_classes: 'uw-flex-grid'
lists:
-
- title: 'Blog Teaser title 1'
+ title: 'Blog Teaser title goes here'
url: '#'
date:
- 'Friday, September 18, 2020'
@@ -130,7 +127,7 @@ lists:
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
-
- title: 'Blog Teaser title 2'
+ title: 'Blog Teaser title goes here'
url: '#'
date:
- 'Friday, September 18, 2020'
@@ -168,7 +165,7 @@ lists:
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
-
- title: 'Blog Teaser title 3'
+ title: 'Blog Teaser title goes here'
url: '#'
date:
- 'Friday, September 18, 2020'
@@ -206,10 +203,12 @@ lists:
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
-
- title: 'News Teaser title 1'
+ title: 'Blog Teaser title goes here'
url: '#'
date:
- 'Sep. 18, 2020'
+ author_name: 'Author Lastname'
+ author_link: '#'
sources:
- srcset: '../../../../source/images/president/president_xlarge.jpg'
media: 'all and (min-width: 63.19rem)'
@@ -233,10 +232,12 @@ lists:
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
-
- title: 'News Teaser title 2'
+ title: 'Blog Teaser title goes here'
url: '#'
date:
- 'Sep. 18, 2020'
+ author_name: 'Author Lastname'
+ author_link: '#'
sources:
- srcset: '../../../../source/images/president/president_xlarge.jpg'
media: 'all and (min-width: 63.19rem)'
@@ -260,10 +261,12 @@ lists:
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
-
- title: 'News Teaser title 3'
+ title: 'Blog Teaser title goes here'
url: '#'
date:
- 'Sep. 18, 2020'
+ author_name: 'Author Lastname'
+ author_link: '#'
sources:
- srcset: '../../../../source/images/president/president_xlarge.jpg'
media: 'all and (min-width: 63.19rem)'
@@ -287,10 +290,12 @@ lists:
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
-
- title: 'Event Teaser title 1'
+ title: 'Blog Teaser title goes here'
url: '#'
date:
- 'Friday, September 18, 2020 2:20- 4:20 PM EDT'
+ author_name: 'Author Lastname'
+ author_link: '#'
sources:
- srcset: '../../../../source/images/president/president_xlarge.jpg'
media: 'all and (min-width: 63.19rem)'
@@ -314,10 +319,40 @@ lists:
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
-
- title: 'Event Teaser title 2'
+ title: 'Blog Teaser title goes here'
+ url: '#'
+ date:
+ - 'Friday, September 18, 2020 2:20- 4:20 PM EDT'
+
+ author_name: 'Author Lastname'
+ author_link: '#'
+ sources:
+ - srcset: '../../../../source/images/president/president_xlarge.jpg'
+ media: 'all and (min-width: 63.19rem)'
+ type: 'image/jpeg'
+ - srcset: '../../../../source/images/president/president_large.jpg'
+ media: 'all and (min-width: 49.81rem)'
+ type: 'image/jpeg'
+ - srcset: '../../../../source/images/president/president_medium.jpg'
+ media: 'all and (min-width: 30rem)'
+ type: 'image/jpeg'
+ - srcset: '../../../../source/images/president/president_small.jpg'
+ media: 'all and (min-width: 25rem)'
+ type: 'image/jpeg'
+ - srcset: '../../../../source/images/president/president_xsmall.jpg'
+ media: 'all and (min-width: 15rem)'
+ type: 'image/jpeg'
+ img_element: '../../../../source/images/president/president_xlarge.jpg'
+ alt: 'Alternative text for blog teaser photo'
+ content: |-
+ <p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
+ -
+ title: 'Blog Teaser title goes here'
url: '#'
date:
- 'Friday, September 18, 2020 2:20- 4:20 PM EDT'
+ author_name: 'Author Lastname'
+ author_link: '#'
sources:
- srcset: '../../../../source/images/president/president_xlarge.jpg'
media: 'all and (min-width: 63.19rem)'
@@ -336,13 +371,17 @@ lists:
type: 'image/jpeg'
img_element: '../../../../source/images/president/president_xlarge.jpg'
alt: 'Alternative text for blog teaser photo'
+ read_more: false
+ show_hover: true
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
-
- title: 'Event Teaser title 3'
+ title: 'Blog Teaser title goes here'
url: '#'
date:
- 'Friday, September 18, 2020 2:20- 4:20 PM EDT'
+ author_name: 'Author Lastname'
+ author_link: '#'
sources:
- srcset: '../../../../source/images/president/president_xlarge.jpg'
media: 'all and (min-width: 63.19rem)'
@@ -365,6 +404,7 @@ lists:
show_hover: true
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be short summary of the content and contain a few lines of useful descriptive text .</p>
+
site_name: 'Psychology'
is_demo_site_container: true
is_demo_footer: true
@@ -1275,23 +1315,10 @@ secondary_items:
class: ''
active_trail: false
menu_items_count: 0
-form_action: 'https://uwaterloo.ca/search'
-form_autocomplete: 'off'
-form_classes: 'uw-search--form'
-form_id: '12345'
-form_method: 'get'
-form_target: ''
-form_accept-charset : 'UTF-8'
-form_role: 'search'
+form_classes: 'uw-layout--controls'
+layout_style: 'grid'
+use_offcanvas: true
form_items:
- - classes: 'uw-input--search'
- id: '1text'
- name: 'search-input'
- type: 'text'
- placeholder: 'Search'
- label:
- text: 'Search'
- class: 'uw-search--label hidden'
- is_button_tag: true
form_item_wrapper: false
is_demo: false
@@ -1300,17 +1327,28 @@ form_items:
classes: button_modifier_classes
modifier_classes: button_modifier_classes
formaction: ''
- form: 'uw-search'
+ form: ''
+ name: ''
+ formenctype: ''
+ value: ''
+ formmethod: ''
+ formtarget: ''
+ text: 'toggle-layout'
+ btnclick: |
+ - is_button_tag: true
+ form_item_wrapper: false
+ is_demo: false
+ is_disabled: false
+ type: ''
+ classes: button_modifier_classes
+ modifier_classes: button_modifier_classes
+ formaction: ''
+ form: ''
name: ''
formenctype: ''
- value: 'submit'
+ value: ''
formmethod: ''
formtarget: ''
- text: ''
+ text: 'off-canvas'
btnclick: |
- # alert('Hello World!');
-# - classes: 'uw-input--submit'
-# id: 'submit'
-# name: 'Search'
-# type: 'submit'
--
GitLab