[
https://issues.jboss.org/browse/ISPN-6747?page=com.atlassian.jira.plugin....
]
Jiří Holuša updated ISPN-6747:
------------------------------
Description:
For example, on cache detail page, in "Actions" dropdown menu, if cache is
enabled than the "Enable" option is disabled. Currently, the button is grey, but
when you try clicking on it, it will execute the operation anyway. Please note that this
affects every button in the dropdown menus, more specifically every <a> link,
because you cannot use disabled="disabled" (therefore ng-disabled) on the
<a> link as you do with the <button> elements.
I found a root cause and also a fix, however, I wasn't able to find a place, where to
modify the CSS style, since the hierarchy is quite complicated. To fix the issue, you have
to add
{code}
li.disabled {
cursor: not-allowed;
}
{code}
to the CSS of the directly encapsulating <li>, and following
{code}
li.disabled a {
pointer-events: none;
}
{code}
to the CSS of the disabled <a> tag. The reason to split this two is that the cursor
and pointer-events don't work well together and we want to have both
"not-allowed" cursor and not-clickable link. See
https://github.com/twbs/bootstrap/issues/16088 for details.
I would be happy to implement the fix and send a PR, just give me a hint which one is the
CSS style to be modified. I essentially need to modify the CSS on the URL
http://localhost:9990/console/built_components/patternfly/dist/css/patter... . Or
should it be overwritten somewhere else?
I've tested the fix via modifying the CSS directly in the browser on the fly, so I can
confirm that it works.
was:
For example, on cache detail page, in "Actions" dropdown menu, if cache is
enabled than the "Enable" option is disabled. Currently, the button is grey, but
when you try clicking on it, it will execute the operation anyway. Please note that this
affects every button in the dropdown menus, more specifically every <a> link,
because you cannot use disabled="disabled" (therefore ng-disabled) on the
<a> link as you do with the <button> elements.
I found a root cause and also a fix, however, I wasn't able to find a place, where to
modify the CSS style, since the hierarchy is quite complicated. To fix the issue, you have
to add
{code}
li.disabled {
cursor: not-allowed;
}
{code}
to the CSS of the directly encapsulating <li>, and following
{code}
li.disabled a {
pointer-events: none;
}
{code}
to the CSS of the disabled <a> tag. The reason to split this two is that the cursor
and pointer-events don't work well together and we want to have both
"not-allowed" cursor and not-clickable link. See
https://github.com/twbs/bootstrap/issues/16088 for details.
I would be happy to implement the fix and send a PR, just give me a hint which one is the
CSS style to be modified. I essentially need to modify the CSS on the URL
http://localhost:9990/console/built_components/patternfly/dist/css/patter... . Or
should it be overwritten somewhere else?
Disabled buttons in dropdown menus are still functional
-------------------------------------------------------
Key: ISPN-6747
URL:
https://issues.jboss.org/browse/ISPN-6747
Project: Infinispan
Issue Type: Bug
Components: Console
Affects Versions: 8.2.2.Final
Reporter: Jiří Holuša
Assignee: Vladimir Blagojevic
For example, on cache detail page, in "Actions" dropdown menu, if cache is
enabled than the "Enable" option is disabled. Currently, the button is grey, but
when you try clicking on it, it will execute the operation anyway. Please note that this
affects every button in the dropdown menus, more specifically every <a> link,
because you cannot use disabled="disabled" (therefore ng-disabled) on the
<a> link as you do with the <button> elements.
I found a root cause and also a fix, however, I wasn't able to find a place, where to
modify the CSS style, since the hierarchy is quite complicated. To fix the issue, you have
to add
{code}
li.disabled {
cursor: not-allowed;
}
{code}
to the CSS of the directly encapsulating <li>, and following
{code}
li.disabled a {
pointer-events: none;
}
{code}
to the CSS of the disabled <a> tag. The reason to split this two is that the cursor
and pointer-events don't work well together and we want to have both
"not-allowed" cursor and not-clickable link. See
https://github.com/twbs/bootstrap/issues/16088 for details.
I would be happy to implement the fix and send a PR, just give me a hint which one is the
CSS style to be modified. I essentially need to modify the CSS on the URL
http://localhost:9990/console/built_components/patternfly/dist/css/patter... . Or
should it be overwritten somewhere else?
I've tested the fix via modifying the CSS directly in the browser on the fly, so I
can confirm that it works.
--
This message was sent by Atlassian JIRA
(v6.4.11#64026)