elm-ui icon indicating copy to clipboard operation
elm-ui copied to clipboard

Published 20 hours ago • verified publisher icon mdgriffith

transparent button still issues onPress message

Open bburdette opened this issue 7 years ago • 3 comments

Un-expected behavior is that a transparent button still issues an event if you click on it. Easy enough to work around, but not what's indicated in the docs.

https://ellie-app.com/3CFndNgGLWya1

Expected behavior

According to the docs transparent elements ought to ignore mouse events.

Versions

  • OS: nixos
  • Browser: firefox
  • Browser Version: 62.0.03
  • Elm Version 0.19.0
  • Elm UI Version 1.1.0

bburdette avatar Oct 15 '18 14:10 bburdette

This happens on Safari Version 12.0.1, macOS 10.14.1. So most likely an elm-ui bug.

This works :

transparent : Element.Attribute msg
transparent =
    Html.Attributes.style "visibility" "hidden"
        |> Element.htmlAttribute

z5h avatar Nov 28 '18 21:11 z5h

Also happens with elm-ui 1.1.5. #bug #has-ellie

alexkorban avatar Apr 30 '20 03:04 alexkorban

I am seeing this in elm-ui 1.1.8 in both Firefox and Chromium. The transparent class added by elm-ui attaches opacity: 0 to the element. It seems like it should also/instead add visibility: hidden to prevent mouse events?

I'll be happy to provide an up-to-date Ellie if that helps, but updating the elm-ui version in @bburdette's Ellie above shows that the problem persists.

Is there a recommended workaround?

adamnfish avatar Jul 09 '21 12:07 adamnfish