v-text-fields are not styled when used in a v-data-table footer slot

[robokozo]

Steps to reproduce

Create a v-data-table
Add footer slot
Have footer cell contain a v-text-field

Versions

Vue.js v2.4.2
Vuetify v0.14.8
Chrome v59.0.3071.115
Firefox v54.0.1

What is expected ?

I would expect the inputs within the tfoot to appear in the same consistent way across various components.

What is actually happening ?

The input fields are missing the the underline. It does not appear correctly when the cursor is within the input element either.

Reproduction Link

https://jsfiddle.net/tgpfhn8m/

[jacekkarczmarczyk]

There's a following rule that changes the styling of the input:

.datatable tfoot .input-group__details {
    display: none;
}

Not sure why it's there, but for now you can try to override it in you css

EDIT: Actually I think that inputs that are added by datatable component (text fields in footer, checkboxes for selecting rows) should have additional class describing what kind of input it is (.checkbox--table-row or similar) and their styling should be done by adding rules to this particular class instead of using selectors like in the rule above.
It will allow devs to easly use the default styling as well as special styling designed for special cases, it will be also more "BEM-like"

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. Please direct any non-bug questions to our Discord