vue.js - 如何使用vuetify在scss文件中创建断点？

Question

如何在vuetify应用程序中但在scss文件中使用媒体查询断点？

例如bootstrap使我能够在scss文件中执行以下操作:

@include media-breakpoint-up(sm) {
  .custom-class {
    display: block;
  }
}

vuetify中的等效项是什么？我找不到任何documention in vuetify website

Answer 1

您可以在scss中执行此操作:

@import '~vuetify/src/styles/settings/_variables';

@media #{map-get($display-breakpoints, 'sm-and-down')} {
    .custom-class {
        display: block;
    }
}

...而您是对的，关于vuetify中的断点的文档很少