vuetify3 [Vuetify] v-btn hover effect circle -> square shape로 변경하기 다음처럼, v-btn을 사용해서 버튼을 생성하고, 브라우저에서 마우스를 올리면, 사각형 형태로 모양을 표시하고 싶었습니다. 을 사용한다면, 그림자가 아래 그림처럼 원형태로 보일겁니다. 를 사용하거나, tile 옵션을 주게되면, 으로 버튼을 표시하더라도, 사각형 형태의 그림자 효과를 줄 수 있습니다. 2022. 1. 4. [Vuetify] global font family 설정하는 방법 방법 src/sass/variables.scss 파일을 똑같이 생성해 줍니다. 내용에 다음 코드를 입력합니다. $body-font-family: 'jost-medium', 'sans-serif'; 폰트가 변경된 것을 확인할 수 있습니다. 참고 https://vuetifyjs.com/en/features/sass-variables/#example-variable-file SASS variables Customize Vuetify's internal styles by modifying SASS variables. vuetifyjs.com 2021. 12. 24. [Vue] Vuetify 템플릿 적용 개발 팁 개요 제가 실제 업무에서 담당하는 제품의 스타일 작업은 scss로 개발되었습니다. 전부요. style 코드가 script 코드보다 많은 컴포넌트 파일도 많았습니다. 유지보수에 적합하지 않다고 생각했습니다. 그래서, components 템플릿을 찾아서 사용하면서, 템플릿의 장점과 사용방법을 공유하려고 합니다. 직접 css로 style 작업 Vuetify 템플릿 사용 장점 🤔. - 개발 생산성 증가. 빠르게 개발 가능. - UX 좋아짐. - css 코드를 작성할 일이 거의 없음. 유지보수 관리에 좋음. - 얼마든지 디자인 요구사항대로 커스텀 가능. - 정적 파일 img를 사용하지 않고, icon을 넣을 수 있음. 단점 - 개발을 할 때, 작업 시간 많이 걸림. - css 코드가 많아져서 관리에 어려움. - .. 2021. 7. 18. 이전 1 다음
