From 30fe420abf9bc372f87b35802842bae6f7d0c26d Mon Sep 17 00:00:00 2001
From: Kristina Lim <kristinalim.ph@gmail.com>
Date: Wed, 15 Aug 2018 14:52:10 +0800
Subject: [PATCH 1/2] fix(modal): Fix duplicate quote in faux modal HTML

---
 src/modal/modal.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/modal/modal.js b/src/modal/modal.js
index 9e02fb3..3393fb3 100644
--- a/src/modal/modal.js
+++ b/src/modal/modal.js
@@ -242,7 +242,7 @@ angular.module('mm.foundation.modal', ['mm.foundation.transition'])
 
         // Create a faux modal div just to measure its
         // distance to top
-        var faux = angular.element('<div class="reveal-modal" style="z-index:-1""></div>');
+        var faux = angular.element('<div class="reveal-modal" style="z-index:-1"></div>');
         parent.append(faux[0]);
         cssTop = parseInt($window.getComputedStyle(faux[0]).top) || 0;
         var openAt = calculateModalTop(faux, cssTop);

From 93d3d87d926c736f637319e8bb9861dbee3acfdb Mon Sep 17 00:00:00 2001
From: Kristina Lim <kristinalim.ph@gmail.com>
Date: Wed, 15 Aug 2018 14:54:13 +0800
Subject: [PATCH 2/2] fix(modal): Fix calculation of top when % property

An absolute-positioned element with % "top" property that is hidden
through "display: none;" does not evaluate to the same value as a
visible one for the following JS:

    window.getComputedStyle(element).top

The computed "top" value for the hidden element is still the % value,
while it is the computed px value if the element is visible or when
using "visibility: hidden;". This is demonstrated in the following
Plunker:

    http://run.plnkr.co/preview/cjkut64np00072y6ccj3tmqem/

$modalStack.open expects the expression above to return the px value,
so a "10%" value gets treated as "10px". This is not the desired
behavior, and a big limitation now that people use a big range of screen
sizes.

The faux modal is temporarily inserted with "z-index: -1" (JS),
"display: none" (CSS), and "visibility: hidden;" (CSS).

As a workaround, this commit assigns "display: block" (JS) to the faux
modal.
---
 src/modal/modal.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/modal/modal.js b/src/modal/modal.js
index 3393fb3..a762c61 100644
--- a/src/modal/modal.js
+++ b/src/modal/modal.js
@@ -242,7 +242,7 @@ angular.module('mm.foundation.modal', ['mm.foundation.transition'])
 
         // Create a faux modal div just to measure its
         // distance to top
-        var faux = angular.element('<div class="reveal-modal" style="z-index:-1"></div>');
+        var faux = angular.element('<div class="reveal-modal" style="z-index:-1; display: block;"></div>');
         parent.append(faux[0]);
         cssTop = parseInt($window.getComputedStyle(faux[0]).top) || 0;
         var openAt = calculateModalTop(faux, cssTop);