라이브러리 코드 어딨냐고~~~!!!

tiptap 라이브러리를 이용해 글쓰기 창을 만들었는데 맘에 안 드는 굵직한 선이 보였다.
더군다나 처음 글 쓸 때 글쓰기 창이 아닌 꼭 첫 줄을 클릭해야 커서가 찍히더라....
스타일을 바꾸고 싶은데 코드에선 도저히 안 보인다고?
개발자 도구를 이용합시다요!!

수정 방법

개발자 도구는 신이야!!!

• 코드에서 보이지 않는 부분을 개발자 도구를 이용해 찾을 수 있다.
• 찾은 태그의 class나 id를 확인한다!

css 설정

.ProseMirror {
  min-height: 15rem;
  outline: none;
  padding: 0.5rem;
}

• css 폴더에 새로운 파일을 만들고 코드를 작성한다.
• 나는 굵고 못 생긴 아웃라인을 사라지게 하고 최소 높이를 설정해줬다.

nuxt.config.ts에서 전역 설정

export default defineNuxtConfig({
  css: ['@/assets/css/main.scss', '@/assets/css/tiptap.scss']
})

• nuxt.config.ts에서 css 배열에 main과 더불어 내가 만든 css 파일을 추가한다!