[CSS] bootstrap 테마 적용하기 (bootswatch)

 

bootswatch 홈페이지 

 

https://bootswatch.com/

Bootswatch: Free themes for Bootstrap

 

1. 사용할 테마를 선택하고 다운받는다. ( bootstrap.min.css  )

2. 사용 중인 bootstrap.min.css 파일을 다운로드 받은 파일로 변경한다.

3. 사용하고 싶은 요소 위에 마우스를 올리면 <> 버튼이 활성화 되는데,

이것을 눌러 소스코드를 복사하고 원하는 위치에 붙여넣기해서 사용한다.

Vue3 project 에서 bootswatch 적용하기

 

1. bootswatch 설치

npm install bootswatch

 

2. main.js 변경

[기존] 
import "bootstrap/dist/css/bootstrap.min.css";

[변경] 
import "../node_modules/bootswatch/dist/lux/bootstrap.min.css"