diff --git a/source/_patterns/04-components/card/_card.scss b/source/_patterns/04-components/card/_card.scss index 15e8dd7fe3d97bf56a7ea78059329e0f51a5dddb..8bd2794fae8072f7038a2642a6659d9a9cea44f8 100644 --- a/source/_patterns/04-components/card/_card.scss +++ b/source/_patterns/04-components/card/_card.scss @@ -65,6 +65,9 @@ $card-padding: rem(gesso-spacing(sm)) !default; $card-link-color-hover ); } +} +.card__sub-title{ + } .card__author{ @include uw-no-breakout(); diff --git a/source/_patterns/04-components/card/card--node/_card--node.scss b/source/_patterns/04-components/card/card--node/_card--node.scss index 20a03366c0de9ddc7b7e738359c511bf48e0ad09..ac3085b39df25a9bdf6ba07fb2482a5a62199933 100644 --- a/source/_patterns/04-components/card/card--node/_card--node.scss +++ b/source/_patterns/04-components/card/card--node/_card--node.scss @@ -11,71 +11,66 @@ margin:0 !important; } .card__node{ - .card__header { - @include uw-contained-width; - background:gesso-brand(org-default,uw-white,primary); - margin-top:4rem; - .card__title { - font-size: gesso-font-size(8); - - } - - .card__sub-title { - font-size: gesso-font-size(4); - } - - .card__date { + > .card__header, + > .card__footer { + margin:0 auto; + max-width: $max-width; + } + .uw-node__without-image &{ + .card__header, + .card__footer { + margin:0 auto; + max-width: $max-width; } + } + .card__featured-image { + align-items: center; + display: grid; + justify-items: center; + position: relative; - .card__author { + .card__header { + align-self: end; + margin-bottom: 0; + margin-top: 0; + max-width: $max-width; + padding: 0 gesso-spacing(md); + @include xl{ + padding: 0; + } - } - } - .uw-node__with-image &{ + .card__date { + margin-bottom: 0; + margin-top: 0; + } - .card__header { - @include uw-contained-width(); - bottom:0; .card__title { - padding: gesso-spacing(xs) gesso-spacing(md); + background: gesso-brand(org-default, uw-white, primary); + font-size: gesso-font-size(8); + margin-bottom: 0; + margin-top: 0; + padding: gesso-spacing(sm) gesso-spacing(md); } + .card__sub-title { + background: gesso-brand(org-default, uw-white, primary); + font-size: gesso-font-size(4); + margin-bottom: 0; + margin-top: 0; padding: gesso-spacing(xs) gesso-spacing(md); } + .card__author { + background: gesso-brand(org-default, uw-white, primary); + margin-bottom: 0; + margin-top: 0; padding: gesso-spacing(xs) gesso-spacing(md); } } - .card__date { - //margin-top: -2.25rem; - .uw-date { - } - } - + } + .card__footer{ + padding: gesso-spacing(xs) gesso-spacing(md); } } - -.card__body { - //margin-top: -7rem; -} - -//.card__footer{ -// //@include uw-contained-width(55rem); -// padding: gesso-spacing(xs) gesso-spacing(md); -//} - - -//.node--type-uw-ct-profile, -//.node--type-uw-ct-contact { -// .uw-node__without-image, -// .uw-node__with-image{ -// .card.node { -// margin-top: 1rem; -// .card__body { -// @include uw-contained-width; -// } -// } -// } -//} diff --git a/source/_patterns/04-components/card/card-elements/_title.twig b/source/_patterns/04-components/card/card-elements/_title.twig index dae73fdb20f5099e2586a6b61ac2b5a7f66cd1a0..8dac23deca1d761d542d13094d4be923210ecd29 100644 --- a/source/_patterns/04-components/card/card-elements/_title.twig +++ b/source/_patterns/04-components/card/card-elements/_title.twig @@ -24,5 +24,5 @@ {% endif%} {% if sub_title %} - <span class="sub-title">{{ sub_title }}</span> + <span class="card__sub-title">{{ sub_title }}</span> {% endif %}