Fix up links so they are 508 compliant

[TomNUSDS]

Doing this at the jekyll doesn't work because github's build system limits the plugins a site can use.

Another solution is to do it in javascript.

Image showing matched and unmatched links:

One possible issue are buttons that are links that take users offsite.

[drew-usds]

@TomNUSDS

In general I'm seeing the script add the usa-link--external class, the rel= and the target= to external links 🎉 👍 .

---

In addition to your flag on buttons, found the following things doing QA (adding them here as a to-do for me to check off)

• [x] Some internal links are being treated as external when viewing locally (imagine the same would happen on staging). Could present problems for QA both locally and on staging. Obvi solution is to just go clean those up, but could be an annoying ongoing QA thing .

Ex: the lead grafs on/apply and the nine-year blog post have a hardcoded link to https://usds.gov/* that is being treated as external when viewing locally/on staging.

• [x] Spacing after the links in body text is a little tight, could be expanded

• [x] Social link icons are getting the style added to them, which overlaps with the icon.

• [x] Baseline of external links with smaller text (ex in press clips, in the footer) don't totally line up with the external icon. Looks like it might be the external link icon margin being tied to the x height (.7ex) of the larger body font. This is pretty minimal, though!

.usa-link--external.usa-link--alt::after{
...
margin-top: .7ex;
}

---

Other thoughts

• [ ] Not sure how this will behave with the /apply form. Won't be able to QA until we push it live.

[TomNUSDS]

Some internal links are being treated as external when viewing locally

I think this is just a local thing, but I'll see if I can't make it work.

Spacing after the links in body text is a little tight, could be expanded

I think this is just standard USWDS layout for the style. We can tweak.

Social link icons are getting the style added to them, which overlaps with the icon.

This is a straight up bug. I fixed it for the first attempt (using the Jekyll plugins), but forgot to do it here.

Baseline of external links with smaller text (ex in press clips, in the footer) don't totally line up with the external icon.

I may need help with the css here. the .usa-link--external.usa-link--alt::after may make the other link locations too high. It may need to be specifically targeted at elements under the list element?