Подчеркивание текстового поля Vue Material Design не отображается

Question

Я использую инфраструктуру Material Design для Vue, но когда я добавляю текстовое поле на страницу, анимация работает, но подчеркивание не отображается.

Я добавил следующее в свой файл main.js:

import 'vue-material/dist/vue-material.min.css'
import {MdField, MdButton} from 'vue-material/dist/components'

Answer 1

Вы пропускаете какие-то классы где-нибудь?Смотря на их документы для ввода и на пример, который они дают, подчеркивание устанавливается с использованием элементов pseudo :: after и :: before:

# ::before
.md-field.md-theme-demo-light:before {
  background-color: #448aff;
  background-color: var(--md-theme-demo-light-primary,#448aff)
}

# ::after
.md-field.md-theme-demo-light:after {
  background-color: rgba(0,0,0,.42);
}

, который, похоже, устанавливает цвета с помощью 'md-тема-демо-лайт 'класс.