Styleguide.js changes for small screens

Author: bradfrost

public/styleguide/css/styleguide.css

@@ -347,6 +347,11 @@
     -o-transition: all 40s linear;
     transition: all 40s linear; }
 
+.no-resize #sg-cover, .no-resize #sg-rightpull-container {
+  display: none; }
+.no-resize #sg-viewport {
+  overflow: hidden !important; }
+
 #sg-cover {
   width: 100%;
   height: 100%;

public/styleguide/css/styleguide.scss

@@ -503,6 +503,17 @@ $animate-quick: 0.2s;
 	}
 }
 
+.no-resize {
+	#sg-cover, #sg-rightpull-container {
+		display: none;
+	}
+
+	#sg-viewport {
+		overflow: hidden !important;
+	}
+	
+}
+
 #sg-cover {
 	width: 100%; 
 	height: 100%; 

public/styleguide/js/code-viewer-ck.js

@@ -307,7 +307,10 @@
 
 	//Detect larger screen and no touch support
 	if('ontouchstart' in document.documentElement && window.matchMedia("(max-width: 700px)").matches) {
-		console.log('touch and less than 700px');
+		$('body').addClass('no-resize');
+		$('#sg-viewport ').width(sw);
+
+		alert('workit');
 	} else {
 
 	}