Переопределить тему vue-formulate по умолчанию snow.scss

Английский не является моим родным языком, и я могу неправильно понять документацию vue-formulate, но я пытаюсь использовать модуль vue-formulate в проекте Nuxt.js. Я импортирую файл snow.scss по умолчанию, а затем свой глобальный стиль:

css: [
'@/node_modules/@braid/vue-formulate/themes/snow/snow.scss',
'@/assets/css/style.scss',

],

Затем я пытаюсь настроить класс глобально:

Vue.use(VueFormulate, {
  classes: {
    element: 'custom-element',
  },
})

В моем style.scss есть:

.custom-element input:focus {
  border: 1px solid $my-color;
}

Я вижу настраиваемый класс на оболочке вокруг фактического элемента, но мой стиль переопределяется .formulate-input[data-classification="text"] input:focus если я не добавлю !important

Так что мне интересно, что я здесь делаю не так? Любая помощь будет оценена по достоинству! Я не хочу создавать свой собственный scss, вариант по умолчанию - хороший стартер, где мне просто нужно сделать некоторые обновления и использовать !important не кажется хорошей практикой.

Заранее спасибо:)

0 ответов

Другие вопросы по тегам