Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Panel] Child elements of disabled fields can be click #2170

Closed
afbora opened this issue Oct 4, 2019 · 3 comments

Comments

@afbora
Copy link
Contributor

@afbora afbora commented Oct 4, 2019

Describe the bug
The disabled structure field can be clicked and the form opens.

To Reproduce
Steps to reproduce the behavior:

  1. Go to panel
  2. Add structure field with disabled and filled to any page
  3. Edit the page and click structure table
  4. Row form is opening

Blueprint:

fields:
  addresses:
    label: Addresses
    type: structure
    disabled: true
    fields:
      street:
        label: Street
        type: text
      zip:
        label: ZIP
        type: text
      city:
        label: City
        type: text

Expected behavior
Rows can't be clicked, so the field data shouldn't be opened.

Screenshots
disabled

Kirby Version
3.2.5

Related PR #2069

Desktop

  • Windows 10
  • Chrome 77.0.3865.90

Additional context
I have few tests on related PR. Maybe this can give you an idea.
This issue is related to the child elements of the disabled field.
The same issue exists for translate: false option on disabled field when switch the language.
Btw when you try to save that opened form, the data does not save and no problem there.

Issue line:
https://github.com/afbora/kirby/blob/develop/panel/src/components/Forms/Field.vue#L102-L104

Currently not working

k-field[data-disabled] *:not(.k-text[data-theme=help])

Structure field working (not clickable when disabled) but help links not working

k-field[data-disabled] *:not([data-theme=help])

I have no idea why it didn't work together.

@afbora

This comment has been minimized.

Copy link
Contributor Author

@afbora afbora commented Oct 5, 2019

I can fix this issue with following but i'm not sure its right way:

.k-field[data-disabled] * {
    pointer-events: none
}

.k-field[data-disabled] .k-text[data-theme=help] * {
    pointer-events: initial;
}
@distantnative

This comment has been minimized.

Copy link
Contributor

@distantnative distantnative commented Oct 5, 2019

LGTM.

afbora added a commit that referenced this issue Oct 5, 2019
Reverted `[data-disabled]` selector and add new selector for `[data-theme=help]`

Fixes #2170
@afbora afbora referenced this issue Oct 5, 2019
0 of 4 tasks complete
@afbora afbora self-assigned this Oct 5, 2019
distantnative added a commit that referenced this issue Oct 5, 2019
Reverted `[data-disabled]` selector and add new selector for `[data-theme=help]`

Fixes #2170
@distantnative

This comment has been minimized.

Copy link
Contributor

@distantnative distantnative commented Oct 5, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.