From 58ac249df7e4614e81d66470a17e7ab65df89b88 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=B8ren=20Debois?= <soren.debois@gmail.com>
Date: Fri, 12 Aug 2016 16:55:29 +0200
Subject: [PATCH] Make Menu apply styling to top-level div; position same

In the interest of controlling placement of the menu, styling supplied
to menu is now applied to the top-level div.

The top-level div is also styled `position: relative;` to fix placement
issues, and the activating menu button now closes the menu when pressed
if its active to work around yet more bugs due to bad
getBoundingClientRect.

Fix #143.
---
 src/Material/Menu.elm | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/Material/Menu.elm b/src/Material/Menu.elm
index 20cb035..be89fbb 100644
--- a/src/Material/Menu.elm
+++ b/src/Material/Menu.elm
@@ -540,7 +540,8 @@ view lift model properties items =
     itemSummaries =
       List.map (Options.collect defaultItemConfig << .options) items
   in
-    div
+    Options.apply summary div
+      ( css "position" "relative" :: properties)
       []
       [ styled button
           [ cs "mdl-button"
@@ -548,6 +549,7 @@ view lift model properties items =
           , cs "mdl-button--icon"
           , attribute (onKeyDown (Key itemSummaries)) `when` isActive model
           , attribute (onClick Geometry.decode (Open)) `when` (model.animationState /= Opened)
+          , attribute (Html.Events.onClick Close) `when` isActive model
           ]
           [ Icon.view config.icon
             [ cs "material-icons"