Feature/issue 3 style improvement

[WonhyeongLee]

요약

3 에 적어놓은 내용 작업 + FOUC 최적화

반영 브랜치

feature/issue-3-style-improvement -> dev

변경 사항

1. css를 emotion으로 다 변환할 예정이라 전역변수와 레이아웃스타일을 emotion의 Global 컴포넌트에 추가하고 해당 부분을 style.css에서 삭제했습니다.
2. 태그리스트의 태그의 모양과 hover시 효과를 추가했습니다.
3. 포스트 간 구분선을 추가했습니다.
4. 필터링 된(선택된) 태그에 대해서 hover 효과와 똑같은 스타일이 적용되도록 추가했습니다.
5. 태그리스트가 나타나고 사라지는 과정에서 태그리스트 요소가 사라지도록 Transition의 unmountOnExit 옵션을 사용했습니다.
6. 본문에도 애니매이션을 추가해 태그 리스트와 함께 내려가고 올라오도록 추가했습니다.
7. gatsby-plugin-fix-fouc 플러그인을 설치해서 fouc 현상을 개선했습니다.

결과

선택된 태그 색상효과

fouc 개선 전

fouc 개선 후