Cull SpeedGrader scroll bars/resizing

fixes GRADE-1115

Test plan:

DocViewer caveat:
The DocViewer frame--which is not directly controlled by us--will
produce a horizontal scroll bar if resized to a small enough width,
even though it also zooms the document out to compensate. This isn't
something we have control over from SG, so it's not an issue for the
purposes of this change.

Viewing documents:
- Create an assignment with online submissions
- As a student, submit a multi-page PDF (or a similar longish
  document) for the assignment
- As a teacher, open SpeedGrader for the assignment
- The DocViewer frame should *not* be resizeable independently
  from the rest of the page.
- Check that there are no superfluous scrollbars on the page.
  Scrollbars should *only* be present for the following:
  - On the left side, you should be able to scroll vertically
    through the document assuming it is long enough
  - If you resize the window to a small enough height that the
    contents of the right side are not all visible, a vertical
    scroll bar should appear
  - If you resize the window to a small enough width that not
    everything is visible, a horizontal scroll bar should appear
    to let you scroll the window from left to right
  - (Note that, per the caveat above, a horizontal scroll bar
    specific to the DocViewer frame may also appear)
  - Changing the sizes of the left/right divs using the divider,
    or clicking on the divider to hide the right side entirely,
    should behave sanely with respect to scroll bars

Grading with a rubric:
  - Create an assignment with a rubric
    - Give at least one criterion several possible "ratings" so it extends
      far out horizontally when edited
  - Open the assignment in SpeedGrader
  - Click the "View Rubric" button and ensure that a horizontal scroll
    bar appears if the rubric is too wide to show in the existing width
    (and does not appear otherwise)

Change-Id: I25930c4100827f6a29bca2f220a4fc266a069e18
Reviewed-on: https://gerrit.instructure.com/154763
Tested-by: Jenkins
Reviewed-by: Spencer Olson <solson@instructure.com>
Reviewed-by: Gary Mei <gmei@instructure.com>
QA-Review: Anju Reddy <areddy@instructure.com>
Product-Review: Sidharth Oberoi <soberoi@instructure.com>

app/stylesheets/bundles/speed_grader.scss

@@ -231,14 +231,17 @@ $icon-size: 1.4rem;
 
 .full_width {
   #left_side {
-    width: 100%;
+    width: calc(100% + 1px); // i.e., 100% + 8px (margin-left) - 7px (right_side width)
+    overflow-x: hidden;
     margin-#{direction(left)}: -8px;
     #left_side_inner {
       margin-#{direction(left)}: 8px;
+      width: calc(100% - 7px);
     }
   }
   #right_side {
     width: 7px;
+    overflow: hidden;
   }
   #rightside_inner {
     display: none;
@@ -247,7 +250,7 @@ $icon-size: 1.4rem;
 
 .full_height {
   height: 100%;
-  overflow-x: scroll;
+  overflow-x: auto;
 }
 
 .media_comments_visible {
@@ -343,6 +346,7 @@ $icon-size: 1.4rem;
   position: absolute;
   top: 0;
   bottom: 0;
+  overflow-y: hidden;
   #{direction(left)}: 0;
   #{direction(right)}: 25%;
   #submissions_container, #left_side_inner, iframe, #doc_preview_holder, #iframe_holder, #resize_overlay {

public/javascripts/jquery.doc_previews.js

@@ -103,14 +103,13 @@ import './jquery.loadingImg'
         });
       }
       else if (opts.canvadoc_session_url) {
-        const canvadocWrapper = $('<div style="overflow: auto; resize: vertical;\
-        border: 1px solid transparent; height: 100%;"/>')
+        const canvadocWrapper = $('<div style="overflow: auto; border: 1px solid transparent; height: 100%;"/>')
         canvadocWrapper.appendTo($this)
         var iframe = $('<iframe/>', {
           src: opts.canvadoc_session_url,
           width: opts.width,
           allowfullscreen: '1',
-          css: {border: 0, overflow: 'auto', height: '99%', 'min-height': '800px'},
+          css: {border: 0, overflow: 'auto', height: '99%'},
           id: opts.id
         });
         iframe.appendTo(canvadocWrapper)