In my application I'm using material design icons. I load them like so:
<link href="https://cdn.materialdesignicons.com/2.5.94/css/materialdesignicons.min.css" rel="stylesheet">
It works good in many parts of the application, but it does not work with checkboxes. This is how I create checkboxes in one of my methods:
return this.$createElement(VCheckbox, {
});
I do not get any error messages, but instead of checkboxes I see some text, when page is rendered:
I inspected the DOM and see this:
<div class="v-input__slot">
<div class="v-input--selection-controls__input">
<input aria-checked="false" role="checkbox" type="checkbox" value="">
<div class="v-input--selection-controls__ripple"></div>
<i aria-hidden="true" class="v-icon material-icons theme--light">check_box_outline_blank</i>
</div>
</div>
So, I see that instead of mdi
theme material-icons
theme is applied. I do not know how to fix it. What I want to get, is to have mdi-checkbox-marked-outline
class for checked checkboxes and mdi-checkbox-blank-outline
for unchecked.