How to override vue-owl-carousel2 styles?

Question

Owl Carousel

Trying to override styles for carousel

<style scoped lang="sass">
.owl-theme .owl-dots .owl-dot span
  width: 33px !important
  margin: 5px !important

.post-detail
  &-carousel
    & .owl-dots .owl-dot span
      width: 33px !important
      margin: 5px !important

As a result, nothing changes, the styles are not even registered, as if there were no selector matches. Who met with this? I use webPack 3, vue2, owl2

Answer 1

Try adding styles globally rather than in the component.