블로그 사이드 프로필 투명도 조절하기

블로그를 커스텀하면서 커서를 댈 때마다 프로필쪽 색깔이 깜빡이는 게 거슬려서 코드를 뜯어고치다가 혹시나 그냥 색깔을 고정하고 싶은 비전공자들에게 도움이 될까 싶어서 적어본다
사실 비전공자들이 github.io 블로그를 굳이 만들까 싶긴 하지만

처음에 대충 크롬 개발자 도구로 태그를 뜯어보다가 프로필 부분이 사이드바에 속한다는 것을 발견함

결론은 /_sass/minimal-mistakes/vendor/_sidebar.scss파일을 고치면 된다

.sidebar {
  /* 생략 */

  @include breakpoint($large) {
    float: left;
    width: calc(#{$right-sidebar-width-narrow} - 1em);
    opacity: 1; // 이 부분
    -webkit-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out;

    &:hover {
      opacity: 1;
    }

    &.sticky {
      overflow-y: auto;
      /* calculate height of nav list
         viewport height - nav height - masthead x-padding
      */
      max-height: calc(100vh - #{$nav-height} - 2em);
    }
  }

  /* 생략 */
}

코드에 표시된대로 opacity 값을 수정해주면 된다 0에 가까울수록 투명해지고 1에 가까워질수록 선명해진다 나는 커서 댈때 투명도가 바뀌는거 자체가 싫어서 그냥 1로 고정해놨다 사실 저걸 바꾸면 아래 다른 코드 몇개는 쓸모없어질 수도 있지만 프론트에 대해 잘 모르기 때문에… 여기까지가 한계일지도

다른 걸 할게 많기 때문에 그냥 내 눈에 거슬리는 걸 찾아서 뜯어고치는 정도에서 만족