diff --git a/benefits/core/templates/core/base.html b/benefits/core/templates/core/base.html index 69e401459..f11d13dc4 100644 --- a/benefits/core/templates/core/base.html +++ b/benefits/core/templates/core/base.html @@ -108,7 +108,8 @@

{{ page.headline }}

{% translate "core.buttons.help" %}
  • - {% translate "core.buttons.privacy" %} + {% translate "core.buttons.privacy" %} +
  • diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index e2c2a6dd5..601fcc023 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -142,6 +142,25 @@ a:visited:not(.btn) { color: var(--selected-color); } +.external-link::after { + content: " "; + background-color: currentColor; + + mask-image: url("/static/img/external-link.svg"), + linear-gradient(transparent, transparent); + mask-position: center center; + -webkit-mask-image: url("/static/img/external-link.svg"), + linear-gradient(transparent, transparent); + -webkit-mask-position: center center; + + display: inline-block; + position: relative; + width: 24px; + height: 24px; + margin-left: 2px; + vertical-align: text-bottom; +} + /* Headlines */ /* All headlines */ /* All headlines share font-weight, letter-spacing, line-height and margin */ diff --git a/benefits/static/img/external-link.svg b/benefits/static/img/external-link.svg new file mode 100644 index 000000000..e409ee892 --- /dev/null +++ b/benefits/static/img/external-link.svg @@ -0,0 +1,11 @@ + + + + + + + + + + +