diff --git a/src/patterns/04-components/timeline/_timeline.scss b/src/patterns/04-components/timeline/_timeline.scss index 9c319e4708bd6d0bd31aa38ffeb6fd398c706f8f..dae0de7cab308409e6225583415414034952a38e 100644 --- a/src/patterns/04-components/timeline/_timeline.scss +++ b/src/patterns/04-components/timeline/_timeline.scss @@ -34,7 +34,7 @@ font-family: var(--font-secondary); font-size: var(--font-size-00); } - + li { margin: 0; padding: 0; @@ -89,11 +89,22 @@ padding: var(--size-sm) var(--size-2) var(--size-4); position: relative; + /* Affordance for links inside of links, which can happen because + * they don't have to have an outer link, and can put links in the text, + * but sometimes people have done both, which is not allowed by web standards, and causes issues. + * This makes sure the clickable bits are at least visible. + */ a { + text-decoration: underline; + } + /* Only put the timeline link styling on the outer link. */ + > a { display: block; /* Margin/padding tricks to make links cover the padding of the li */ margin: -1rem -1rem -2rem; padding: var(--size-2) var(--size-2) var(--size-2); + /* Undo the link underline for the "real" link. */ + text-decoration: none; &:hover, &:focus{