library-mirrors/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma.git synced 2024-11-14 11:14:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fixes #1992 - Disabled form elements hover state is overlapping, if control has add-ons elements (#1993)

Browse Source 
* <!-- PLEASE READ THE FOLLOWING INSTRUCTIONS -->
<!-- DO NOT REBUILD THE CSS OUTPUT IN YOUR PR -->

<!-- Choose one of the following: -->
This is a bugfix
<!-- New feature? Update the CHANGELOG.md too, and eventually the Docs. -->
<!-- Improvement? Explain how and why. -->
<!-- Bugfix? Reference that issue as well. -->
If a form field is disabled and that form field uses has add-on element ( has-addons ), hover state is overlapping to add-on element.

### Proposed solution
<!-- Which specific problem does this PR solve and how?  -->
<!-- If it fixes a particular Issue, add "Fixes #ISSUE_NUMBER" in your title -->
This solution excludes disabled form elements hover state which is used within has-addons fields wrapper.
Fixes #1992

### Tradeoffs
<!-- What are the drawbacks of this solution? Are there alternative ones? -->
<!-- Think of performance, build time, usability, complexity, coupling…) -->
No tradeoffs.

### Testing Done
I checkout out master and changed the lines.

* Disabled form elements hover state is overlapping, if control has add-ons elements
If a form field is disabled and that form field uses has add-on element ( has-addons ), hover state is overlapping to add-on element.

* Disabled form elements hover state is overlapping, if control has add-ons elements
If a form field is disabled and that form field uses has add-on element ( has-addons ), hover state is overlapping to add-on element.
This commit is contained in:
Kadir Doğan 2018-07-18 13:09:20 +01:00 committed by Jeremy Thomas
parent c1f06d1cc1
commit 5048a0d7fb
1 changed files with 11 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
sass/elements/form.sass
View File

@ -449,16 +449,17 @@ $help-size: $size-small !default
.button, .button,
.input, .input,
.select select .select select
&:hover, &:not([disabled])
&.is-hovered &:hover,
z-index: 2 &.is-hovered
&:focus, z-index: 2
&.is-focused, &:focus,
&:active, &.is-focused,
&.is-active &:active,
z-index: 3 &.is-active
&:hover z-index: 3
z-index: 4 &:hover
z-index: 4
&.is-expanded &.is-expanded
flex-grow: 1 flex-grow: 1
&.has-addons-centered &.has-addons-centered