Just because this is a mobile-first series doesn't mean we can ignore the interactions of desktop/laptop computers. We spend a bit of time making sure there are :hover/:focus/:active states for "clickable" things like links. We use the Sass ability to darken/lighten colors to make altering the colors on these states very easy.

It's this easy:

a {
  color: $linkColor;
  &:hover, &:focus {
    color: darken($linkColor, 15%);

Sorry about the not-great sound on this one =(.

Leave a Comment

Posting Code

We highly encourage you to post problematic HTML/CSS/JavaScript over on CodePen and include the link in your post. It's much easier to see, understand, and help with when you do that.

Markdown is supported, so you can write inline code like `<div>this</div>` or multiline blocks of code in triple backtick fences like this:

  function example() {
    element.innerHTML = "<div>code</div>";

We have a pretty good* newsletter.