diff --git a/pages/_includes/cards/ribbon.html b/pages/_includes/cards/ribbon.html index 22717ef3b4b113b4ad9b1ddfc67e69bbfc7719c8..2db2c82f4babe1c2d08d52e1ffe9147c1c53f85f 100644 --- a/pages/_includes/cards/ribbon.html +++ b/pages/_includes/cards/ribbon.html @@ -3,7 +3,7 @@
-
+
{% if include.text %}{{ include.text }}{% else %}{% include ui/icon.html icon="star" %}{% endif %}
diff --git a/pages/_includes/ui/icon.html b/pages/_includes/ui/icon.html index 68000c7d0d3333296ae4923c2b06cc65a64afb0a..dded9c6d50ad99fe3dec58cdf3315e7e42ef2ffa 100644 --- a/pages/_includes/ui/icon.html +++ b/pages/_includes/ui/icon.html @@ -1,2 +1 @@ -{% assign provider = include.provider | default: "fe" %} - +{% assign provider = include.provider | default: "fe" %} diff --git a/scss/layout/_grid.scss b/scss/layout/_grid.scss index 4058be870e0c67d762c5b55b2a977cfe785a2b68..1850f60314abf429b2ae41d794c9de4a069e41a6 100644 --- a/scss/layout/_grid.scss +++ b/scss/layout/_grid.scss @@ -2,6 +2,18 @@ @include make-container-breakpoints(); } +.row-deck { + > .col, + > [class*='col-'] { + display: flex; + align-items: stretch; + + .card { + flex: 1 1 auto; + } + } +} + @each $name, $value in (0: 0, xs: .25rem, sm: .5rem, lg: 1rem, xl: 1.5rem) { .row-#{$name} { margin-right: (-$value); diff --git a/scss/ui/_ribbons.scss b/scss/ui/_ribbons.scss index 88052e4d158ac6649685a06e7d4b6f8cfd2e7bb2..9c42aa0b4d33e1c531fde11083fd3b2e4da3898c 100644 --- a/scss/ui/_ribbons.scss +++ b/scss/ui/_ribbons.scss @@ -5,12 +5,14 @@ top: .75rem; right: -($ribbon-margin); z-index: 1; - padding: .375rem 1rem; + padding: .25rem 1rem; font-weight: 600; color: #fff; text-align: center; background: $primary; border-color: $primary; + font-size: 1rem; + line-height: 1.5; &::before { position: absolute; @@ -101,7 +103,7 @@ width: 0; height: 0; content: ""; - border: 1.125rem solid; + border: 1rem solid; border-color: inherit; border-right-width: 0; border-left-color: transparent; @@ -132,7 +134,7 @@ right: 0; left: 0; border-color: inherit; - border-width: 1.125rem; + border-width: 1rem; border-top-width: 0; border-bottom-color: transparent; border-bottom-width: .75rem;