Fix bug causing Notebook report and FAB button to scroll with page on unit plan. #2836

Author: breity

src/main/webapp/wise5/themes/default/vle.html

@@ -3,23 +3,30 @@
 <link rel="stylesheet" href="/wise5/themes/default/style/vle.css" />
 <style ng-bind-html="::vleController.projectStyle"></style>
 <disable-delete-keypress>
-    <listen-for-delete-keypress>
-        <div class="app-styles" role="main" layout="column" layout-fill
-             ng-controller="ThemeController as themeCtrl" ng-mousemove="themeCtrl.mouseMoved()"
-             ng-class="::{'notebook-enabled': vleController.notebookEnabled}">
-            <ng-include src="::vleController.themePath + '/templates/topbar.html'"></ng-include>
-            <step-tools show-position="themeCtrl.numberProject"
-                        ng-if="themeCtrl.layoutState === 'node'"></step-tools>
-            <md-content id="content" flex role="main" ui-scrollpoint-target
-                        ng-class="{'l-nav': themeCtrl.layoutState === 'nav', 'l-node': themeCtrl.layoutState === 'node'}" layout="column">
-                <div id="nav" ng-include="::vleController.themePath + '/navigation/navigation.html'" ng-show="themeCtrl.layoutState === 'nav'"></div>
-                <div ng-if="themeCtrl.isEndedAndLocked" style="color: red; display: flex; justify-content: center; align-items: center; height: 30px;">
-                  <span style="border: 1px solid black; border-radius: 3px; padding-left: 8px; padding-right: 8px; background-color: white;">{{ themeCtrl.endedAndLockedMessage }}</span>
-                </div>
-                <div id="node" ng-cloak ui-view="nodeView" ng-if="themeCtrl.layoutState === 'node'"></div>
-            </md-content>
-            <global-annotations></global-annotations>
-            <notebook workgroup-id="::vleController.workgroupId"></notebook>
+  <listen-for-delete-keypress>
+    <div class="app-styles" role="main" layout="column" layout-fill
+         ng-controller="ThemeController as themeCtrl" ng-mousemove="themeCtrl.mouseMoved()"
+         ng-class="::{'notebook-enabled': vleController.notebookEnabled}"
+         style="position: absolute;">
+      <ng-include src="::vleController.themePath + '/templates/topbar.html'"></ng-include>
+      <step-tools show-position="themeCtrl.numberProject" ng-if="themeCtrl.layoutState === 'node'">
+      </step-tools>
+      <md-content id="content" flex role="main" ui-scrollpoint-target
+                  ng-class="{'l-nav': themeCtrl.layoutState === 'nav', 'l-node': themeCtrl.layoutState === 'node'}"
+                  layout="column">
+        <div id="nav" ng-include="::vleController.themePath + '/navigation/navigation.html'"
+             ng-show="themeCtrl.layoutState === 'nav'"></div>
+        <div ng-if="themeCtrl.isEndedAndLocked"
+             style="color: red; display: flex; justify-content: center; align-items: center; height: 30px;">
+          <span
+                style="border: 1px solid black; border-radius: 3px; padding-left: 8px; padding-right: 8px; background-color: white;">{{
+            themeCtrl.endedAndLockedMessage }}</span>
         </div>
-    </listen-for-delete-keypress>
+        <div id="node" ng-cloak ui-view="nodeView" ng-if="themeCtrl.layoutState === 'node'">
+        </div>
+      </md-content>
+      <global-annotations></global-annotations>
+      <notebook workgroup-id="::vleController.workgroupId"></notebook>
+    </div>
+  </listen-for-delete-keypress>
 </disable-delete-keypress>