Merge pull request #75 from Brightspace/Responsive_flaoting_behavior

Responsive floating behavior
BrightspaceUI · Oct 3, 2016 · 1baf6bd · 1baf6bd
2 parents 0ca8f11 + 8888cf9
commit 1baf6bd
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 8 deletions.
diff --git a/d2l-floating-buttons.html b/d2l-floating-buttons.html
@@ -68,8 +68,7 @@
 			}
 		</style>
 
-		<iron-media-query query="(max-width: 555px)" query-matches="{{_widthAtMost555px}}"></iron-media-query>
-		<iron-media-query query="(max-height: 300px)" query-matches="{{_heightAtMost300px}}"></iron-media-query>
+		<iron-media-query query="(max-height: 500px)" query-matches="{{_heightAtMost500px}}"></iron-media-query>
 
 		<div class="d2l-floating-buttons-container">
 			<div><content></content></div>
@@ -83,8 +82,7 @@
 			is: 'd2l-floating-buttons',
 
 			properties: {
-				_heightAtMost300px: Boolean,
-				_widthAtMost555px: Boolean
+				_heightAtMost500px: Boolean
 			},
 
 			_container: null,
@@ -141,8 +139,7 @@
 
 				var innerContainer = this._container.querySelector('div');
 
-				if (this._widthAtMost555px ||
-						this._heightAtMost300px ||
+				if (	this._heightAtMost500px ||
 						((containerTop + containerRect.height) <= viewBottom)
 					) {
 

diff --git a/test/index-mobile.html b/test/index-mobile.html
@@ -7,7 +7,7 @@
 		<script src="../../web-component-tester/browser.js"></script>
 		<style>
 		  #subsuites {
-		    width: 300px;
+		    height: 250px;
 		  }
 		</style>
 	</head>

diff --git a/test/index.html b/test/index.html
@@ -7,7 +7,8 @@
 		<script src="../../web-component-tester/browser.js"></script>
 		<style>
 		  #subsuites {
-		    width: 900px;
+				height: 800px;
+				width: 800px;
 		  }
 		</style>
 	</head>