Quasar: Q-Btn-Dropdown split color is not inherited from color prop when used with outline design

Created on 30 Jun 2020  路  2Comments  路  Source: quasarframework/quasar

Describe the bug
When split prop is enabled on q-btn-dropdown with outline design its color (split's) is not inherited from q-btn-dropdown color prop.

Codepen/jsFiddle/Codesandbox (required)
Slightly modified codepen from https://quasar.dev/vue-components/button-dropdown#Example--Split
https://codepen.io/mv-go/pen/xxZPZeP

To Reproduce

  1. Set split prop to q-btn-dropdown
  2. Set outlineprop to q-btn-dropdown
  3. Set color prop to q-btn-dropdown to something noticeable (teal for example)
  4. Notice the split separator line has its own color of rgba(255, 255, 255, 0.3)

Expected behavior
Split line color to use the same color as set in the q-btn-dropdown color prop OR
Have a separate prop (like split-color) to control in directly

Screenshots
image

Additional context
This may only useful when outline design is used, however some issues with other design options may still arise (see the screenshot below)
image

bug

All 2 comments

That color was set so by design. I don't remember the reasons like now, but you can easily change it.
If you need to customize that color use some CSS, like here:
https://codepen.io/pdanpdan/pen/eYJegNL

Given that changing this would be a breaking change to existing styling in the current version and it can be easily rectified using CSS, I'm closing this for now.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

victorborgaco picture victorborgaco  路  3Comments

xereda picture xereda  路  3Comments

florensiuslaylim picture florensiuslaylim  路  3Comments

Bangood picture Bangood  路  3Comments

nueko picture nueko  路  3Comments