Vue

Quasar CSS를 Override 하는 방법

milliwonkim 2022. 6. 18. 22:25
반응형
SMALL

라이브러리의 경우, scoped CSS, CSS Modules 다 안됨

해싱이 되기 때문임

 

따라서 plain CSS 혹은 plain SCSS / SASS를 사용해야합니다.

 

/* TeacherCard.scss */

.q-date__view {
  padding: 0;
}
// @/views/TeacherPage/TeacherPage.vue

<template>
...
</template>

<script lang="ts">
// CSS module일 경우, class가 암호화되기 때문에
// class가 잡히지 않는다
// 따라서 override하고 싶은 CSS는 CSS module이 아닌
// plain SCSS, SASS로 작성해야함

import '@/views/TeacherCard.scss';
</script>

// 이 부분은 Quasar를 override할 부분이 아니기 때문에
// CSS Module로 해도 됨
<style lang="scss" module>
...
</style>
반응형
LIST