Prevent page from jumping when opening a modal

This CSS prevents the page from jumping when a modal is opened but still causing the background to be not scrollable for the user. Closes drublic#24.
jecabrac · May 10, 2013 · 73e1390 · 73e1390
1 parent 1256405
commit 73e1390
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 4 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,7 @@
 
 ## HEAD
 
+* Prevent page from jumping when opening a modal (#24)
 * Remove an error when a hash has no HTML element associate (#27)
 * Remove check if modal contains an id on focus - it is not necessary (#25)
 * Rename component.json to bower.json to match new bower spec

diff --git a/modal.scss b/modal.scss
@@ -23,11 +23,11 @@ html {
 }
 
 .has-overlay {
-	height: 100%;
+	overflow: hidden;
 
 	> body {
 		height: 100%;
-		overflow-y: hidden;
+		overflow-y: scroll;
 	}
 }
 

diff --git a/site/css/main.css b/site/css/main.css
@@ -787,11 +787,11 @@ html {
 }
 
 .has-overlay {
-  height: 100%;
+  overflow: hidden;
 }
 .has-overlay > body {
   height: 100%;
-  overflow-y: hidden;
+  overflow-y: scroll;
 }
 
 .semantic-content {