Vuetify: определение основного цвета для всего текста - PullRequest
Новая
       67

Vuetify: определение основного цвета для всего текста

0 голосов
/ 22 февраля 2020

Мне нужно определить основной цвет для всего текста в проекте Vue + Vuetify. Я попытался изменить основной цвет темы на vuetify.ts: 

export default new Vuetify({
  theme: {
    themes: {
      light: {
        primary: "#E53935",
      },
    },
  },
})

Это, однако, применяется только в некоторых случаях; Ярлыки ввода v-text и текст вне компонентов Vuetify, среди прочего, не будут использовать это значение. Есть ли хорошая альтернатива явной стилизации через css?

1 Ответ

1 голос
/ 27 февраля 2020

Для обновления переменных используйте css. вам нужно настроить webpack.config. js, как показано ниже. 

{
        test: /\.sass$/,
        use: [
          'vue-style-loader',
          'css-loader',
          {
            loader: 'sass-loader',
            // Requires sass-loader@^7.0.0
            options: {
              // This is the path to your variables
              data: "@import '@/styles/variables.scss'"
            },
            // Requires sass-loader@^8.0.0
            options: {
              // This is the path to your variables
              prependData: "@import '@/styles/variables.scss'"
            },
          },
        ],
      },

Внутри, папка styles, файл variables.scss содержит переменные, которые необходимо переопределить.

Там список переменных, определенных в приведенной ниже ссылке, т. е. глобальный, компонентный и т. д. c

Vuetify CSS Переменные

Надеюсь, это поможет!

...