q-input color won't work correctly.
-
I have big problem with q-input. I need to gray border, that will be change to orange after click. But, if I add color=“secondary” to my q-input border is orange whole time, not only after focused.
Maybe this is because I have to use quasar plugin, maybe this is because I have custom colors in my quasar.variables, it’s hard to say. I would try to change it manually, but I even can’t find some class responsible for it. There is no something like
border: xpx solid secondary color hex or rgb
or something like that, then you defined my secondary color for border. So I even don’t know which class I should to overwritten. Maybe someone can help?
-
Woohoo
I found answer. The problem was cause by giving input inside q-dialog. I solved it by overwritten classes:
.q-field–outlined .q-field__control {
border: 1px solid $primary !important //then is not focused keep gray (primary) color
}.q-field–focused.q-field–outlined .q-field__control,
.q-field–focused.q-field–outlined .q-field__control:before {
border: none !important; //then is focused remove default border
}and my q-input have color=“secondary”
So, for future, be carefully then you give your input inside dialog.