Fix detach call and Fix css height when not reloading on resize (#269)

Author: schloerke

inst/rmarkdown/templates/flex_dashboard/resources/flexdashboard.js

@@ -149,6 +149,18 @@ var FlexDashboard = (function () {
           window.location.reload();
         }
       });
+    } else {
+      // if in desktop mode and resizing to mobile, make sure the heights are 100%
+      // This enforces what `fillpage.css` does for "wider" pages.
+      // Since we are not reloading once the page becomes small, we need to force the height to 100%
+      // This is a new situation introduced when `_options.resize_reload` is `false`
+      if (! _options.isMobile) {
+        // only add if `fillpage.css` was added in the first place
+        if (_options.fillPage) {
+          // fillpage.css
+          $("html,body,#dashboard").css("height", "100%");
+        }
+      }
     }
     // trigger layoutcomplete event
     dashboardContainer.trigger('flexdashboard:layoutcomplete');
@@ -404,7 +416,7 @@ var FlexDashboard = (function () {
       var h3 = $('<h3></h3>');
       h3.append(h2.contents());
       h3.insertBefore(h2);
-      h2.detatch();
+      h2.detach();
 
       // wipeout h2 elements then enclose them in a single h2
       var level2 = page.find('div.section.level2');