Hide the close element to prevent overlay of other elements in IE

drublic · Jan 7, 2015 · 0631b4d · ixisio · Jan 7, 2015 · drublic
1 parent 673a756
commit 0631b4d
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 0 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,6 +1,8 @@
 # Changelog
 
 ## HEAD
+* Hide the close element to prevent overlay of other elements in IE
+* Remove close handler to unset window
 * Include a build of the spinner CSS
 * Include a modal--fade by default to the output
 * Bugfix: Use jQuery to subscribe to events to prevent errors with trigger

diff --git a/_modal-core.scss b/_modal-core.scss
@@ -194,6 +194,11 @@ html {
 		&.is-active {
 			width: 100%;
 			height: 100%;
+
+			// For IE we need to hide the close element to prevent overlay of other elements
+			.modal-close {
+				display: block;
+			}
 		}
 
 		.modal-inner {
@@ -221,6 +226,7 @@ html {
 		}
 
 		.modal-close {
+			display: none;
 			right: auto;
 
 			&:before {

diff --git a/build/modal.css b/build/modal.css
@@ -141,6 +141,8 @@ html {
       .modal--fade:target, .modal--show:target, .is-active.modal--fade, .is-active.modal--show {
         width: 100%;
         height: 100%; }
+        .modal--fade:target .modal-close, .modal--show:target .modal-close, .is-active.modal--fade .modal-close, .is-active.modal--show .modal-close {
+          display: block; }
       .modal--fade .modal-inner, .modal--show .modal-inner {
         -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
@@ -159,6 +161,7 @@ html {
         -moz-hyphens: auto;
         hyphens: auto; }
       .modal--fade .modal-close, .modal--show .modal-close {
+        display: none;
         right: auto; }
         .modal--fade .modal-close:before, .modal--show .modal-close:before {
           content: '';