프론트엔드 부트캠프 61일차, 팀 프로젝트(7) 글자가 자꾸 부러져, 폰트어썸

 

 

신만*님 한 줄로 나오면 좋겠는데

자꾸 도각 부러진다.

 

export const CommentWriter = styled.h3`
  font-size: 1.1em;
  white-space: nowrap;
`;

white-spcae: nowrap; 을 주니까 해결됨!

- 물님의 도움이 있었다. - 

 

 

폰트어썸은 리액트에서 쓰려면 조금 까다로워~~~~

 

9월 5일 추가! 

yarn add @fortawesome/fontawesome-svg-core
yarn add @fortawesome/react-fontawesome --save-dev

 

yarn add @fortawesome/free-solid-svg-icons
yarn add @fortawesome/free-regular-svg-icons

 

 

기본적으로 fontawesome이랑 자기가 쓸 아이콘(solid/regular ...)을 설치해야 한다. 

 

 

 

import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { 여기 } from "@fortawesome/free-solid-svg-icons";

(fort네??!)

 폰트어썸에서 복붙하라고 하는 fa-star를 복사해서

위 import의 여기에 넣을건데, 또 그냥 넣으면 안된다.

카멜 케이스로 바꿔서 넣어줘야 한다!!! 그리고 뒤에 solid인지 regular인지... 체크해서 import 해야 한다.

 

import { faStar } from "@fortawesome/free-solid-svg-icons";

이렇게 바꿔주고, 이 faStar를 다시 

저 위에 fa-solid fa-start 자리를 지우고 { } 안에! 넣어주면 된다...

 

 

- 이것도 물님의 도움이 있었다. -