[Dev Log] 소셜로그인 버튼 위치조정 관련

### 오늘은 어떻게 프로젝트에 기여했나요?
+ Login과 Singup 페이지의 소셜로그인 버튼의 위치를 조정하였다.

### 오늘의 프로젝트에서 힘든 점은 무엇인가요?
+ 어제 내가 만들었던 소셜로그인 버튼은 png 파일로 불러왔던 형식이었다. 원래는 font-awesome을 사용하여 아이콘으로 불러오려고 했었는데 카카오톡과 네이버 같은 경우에는 외국 사이트인 font-awesome에는 존재하지 않아 어쩔 수 없이 이미지를 사용했었다. 그리고 5시에 있는 팀 코드리뷰 및 머지하는 타임에 팀장님이 react-icons라는 라이브러리를 사용하면 카카오톡과 네이버도 있으니 그것을 사용해보라고 하셔서 사용하여 아이콘 형식으로 바꿔놓았다. 아이콘은 아이콘으로 존재하는 편이 코드적으로도 그렇고 보여지기에도 확실히 깔끔하기에 좋은 일이었다고 생각한다.

+ 다만 여기서 문제는, 페이스북 아이콘과 카카오톡/네이버 아이콘의 정렬이 살짝 맞지 않는다는 점이었다.

개발자도구를 열어 더 자세히 살펴보니 페이스북 아이콘 같은 경우에는 path 부분이 svg 부분을 완전히 차지하지 않고 있었다.

카카오톡과 네이버의 경우 path부분이 svg 부분을 완전히 차지하고 있어서 알아서 정렬이 잘 맞는 상태였다.

분명 조절할 수 있는 부분이 있을 것 같아서 코드를 자세히 살펴보던 중에 viewBox라는 부분을 발견했다.

```jsx

```

viewBox를 검색하여 밑의 레퍼런스를 참고해 이 속성으로 나타나는 위치의 영점을 조정할 수 있음을 알게 되었다.

[SVG viewBox를 알아보자](https://tecoble.techcourse.co.kr/post/2021-10-24-svg-viewBox/)

```jsx

```

viewBox 속성을 "0 0 1024 1024"에서 "-100 -100 1024 1024"로 조정한 후의 소셜로그인 버튼의 모습이다.