.template-container {
  position: relative;
}

%edit-template-link,
.edit-template-link {

  @include core-19;
  position: absolute;
  background: $link-colour;
  color: $white;
  padding: 10px $gutter-half;
  z-index: 10000;

  &:link, &:visited {
    color: $white;
  }

  &:hover {
    color: $light-blue-25;
  }

}

.edit-template-link-letter-contact {
  @extend %edit-template-link;
  right: -25px;
  top: 13.3%; // align to top of contact block
}

.edit-template-link-letter-address {
  @extend %edit-template-link;
  top: 16.5%; // align bottom edge to bottom of address
  left: -5px;
}

.edit-template-link-letter-body {
  @extend %edit-template-link;
  top: 33.3%; // aligns to top of subject
  left: -5px;
}

.template-container {
  position: relative;
}

%edit-template-link,
.edit-template-link {

  @include core-19;
  position: absolute;
  background: $link-colour;
  color: $white;
  padding: 10px $gutter-half;
  z-index: 10000;

  &:link, &:visited {
    color: $white;
  }

  &:hover {
    color: $light-blue-25;
  }

}

.edit-template-link-letter-contact {
  @extend %edit-template-link;
  right: -25px;
  top: 13.3%; // align to top of contact block
}

.edit-template-link-letter-address {
  @extend %edit-template-link;
  top: 14.65%; // align bottom edge to bottom of address
  left: -5px;
}

.edit-template-link-letter-body {
  @extend %edit-template-link;
  top: 38.5%; // aligns to top of subject
  left: -5px;
}

Fix alignment of edit letter links
Fix alignment of edit letter links

Not sure how these got out of line (maybe when we brought the date into
the left-hand text area). But this commit updates the percentages to
match the comments.

This is so it’s clear from the position of the link which part of the
letter you’re editing.
