fixing code view to suppprt CSS view

Author: dmolsen

public/styleguide/js/code-viewer.js

@@ -55,7 +55,7 @@ var codeViewer = {
 	codeContainerInit: function() {
 
 		if (document.getElementById("sg-code-container") == undefined) {
-			$('<div id="sg-code-container" style="display: none;"></div>').html('<a href="#" id="sg-code-close-btn">Close</a><div id="sg-code-lineage" style="display: none;"><h2>Lineage</h2><p>This pattern contains the following patterns: <span id="sg-code-lineage-fill"></span></p></div><div id="sg-code-html"><h2>HTML</h2><pre><code id="sg-code-html-fill" class="language-markup"></code></pre></div>').appendTo('body').css('bottom',-$(document).outerHeight());
+			$('<div id="sg-code-container" style="display: none;"></div>').html('<a href="#" id="sg-code-close-btn">Close</a><div id="sg-code-lineage" style="display: none;"><h2>Lineage</h2><p>This pattern contains the following patterns: <span id="sg-code-lineage-fill"></span></p></div><div id="sg-code-html"><h2>HTML</h2><pre><code id="sg-code-html-fill" class="language-markup"></code></pre></div><div id="sg-code-css" class="with-css" style="display: none;"><h2>CSS</h2><pre><code id="sg-code-css-fill" class="language-css"></code></pre></div>').appendTo('body').css('bottom',-$(document).outerHeight());
 		}
 
 		if (codeViewer.sw < codeViewer.breakpoint) {
@@ -111,6 +111,7 @@ var codeViewer = {
 
 			// draw CSS
 			if (css.indexOf("{{ patternCSS }}") == -1) {
+				$("#sg-code-html").addClass("with-css");
 				$("#sg-code-css").css("display","block");
 				$("#sg-code-css-fill").text(css);
 				Prism.highlightElement(document.getElementById("sg-code-css-fill"));