10. Chirpy, Footnote, 주석 폰트 크기 조절

Chirpy 블로그 테마에서는 주석란에 따로 폰트 크기가 조절되는 것 같지 않다.

주석이 본문의 글씨와 똑같은 크기를 지니고 있으면 매우 보기 이상하기 때문에 이것을 바꿔보도록 하자. Chirpy 테마에서는 주석들을 <div class=footnote>로 관리하고 있고 그 안의 내용물들은 다시 <ol>로 정리하고 있다. 우선 _sass/addon/commons.scss 파일을 열어서 아래 코드를 찾고 주석 처리된 곳의 좌측 코드를 넣어주면 된다.

.footnotes > ol {
  padding-left: 2rem;
  margin-top: 0.5rem;
  font-size: smaller; /* 여기에 좌측 코드를 추가하면 된다. */

  > li {
    &:not(:last-child) {
      margin-bottom: 0.3rem;
    }

    @extend %sup-fn-target;

    > p {
      margin-left: 0.25em;
      margin-top: 0;
      margin-bottom: 0;
    }
  }
}

이렇게 하면 본문보다 작아진 폰트로 예뻐진 주석들을 확인할 수 있다.