Skip to content

Commit

Permalink
(NUI) Speedgrader becomes unresponsive in IE11
Browse files Browse the repository at this point in the history
Fixes: CNVS-22751

Removes the flexbox layout used in the New UI
because it is not needed for Speedgrader's full-screen
absolutely positioned layout (and is causing issues
with IE11)

Test Plan:
- Go into Speedgrader in IE11
- You should now be able to click on everything in
  the main content area and use Speedgrader to
  successfully grade an assignment/quiz.

Change-Id: I3536ff08b7672e46365cde52c1d4d80ceb5a5b3c
Reviewed-on: https://gerrit.instructure.com/62470
Reviewed-by: Jennifer Stern <[email protected]>
Product-Review: Jennifer Stern <[email protected]>
Product-Review: Josh Simpson <[email protected]>
Tested-by: Jenkins
QA-Review: Adam Stone <[email protected]>
  • Loading branch information
Chris Hart authored and maneframe committed Sep 8, 2015
1 parent 1bec7b2 commit 3409da7
Show file tree
Hide file tree
Showing 3 changed files with 33 additions and 19 deletions.
27 changes: 27 additions & 0 deletions app/stylesheets/base/mixins/_misc.scss
Original file line number Diff line number Diff line change
Expand Up @@ -50,4 +50,31 @@
top: 0;
}
}
}

// Some layouts in Canvas (Speedgrader and Conversations)
// are absolutely positioned full-screen, which can cause problems when
// they are contained by the New UI flexbox-based layout.
// This mixin removes the un-neeeded flex in the layout containers.
@mixin remove-nui-flex-layout {
@if $use_new_styles {
.ic-app-main-layout-vertical { display: block; }
.ic-app-main-layout-horizontal {
transition: none;
transform: none;
flex: none;
display: block;
position: static;
min-height: 100vh;
body.course-menu-expanded & { transform: none; }
@include breakpoint(wide) { display: block; }
}
.ic-app-main-content {
flex: none;
display: block;
}
.ic-app-main-content__primary {
flex: none;
}
}
}
4 changes: 4 additions & 0 deletions app/stylesheets/bundles/speed_grader.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,14 @@
@import "components/ui.selectmenu";
@import "vendor/_xflex.scss";


#content {
padding: 0;
}

// Get rid of all the new-style flexbox layout, so it doesn't break Speedgrader in IE11
@include remove-nui-flex-layout;

$gradebook_header_height: 52px;

#gradebook_header_container {
Expand Down
21 changes: 2 additions & 19 deletions app/stylesheets/pages/conversations/_conversations_new.scss
Original file line number Diff line number Diff line change
Expand Up @@ -21,29 +21,12 @@
}
}
@else {
width: 100%;
width: 100%;
}
}

// Get rid of all the new-style flexbox layout for Conversations
// To do: rebuild Conversations using flex
@if $use_new_styles {
.ic-app-main-layout-vertical { display: block; }
.ic-app-main-layout-horizontal {
transition: none;
transform: none;
flex: none;
display: block;
position: static;
min-height: 100vh;
body.course-menu-expanded & { transform: none; }
@include breakpoint(wide) { display: block; }
}
.ic-app-main-content {
flex: none;
display: block;
}
}
@include remove-nui-flex-layout;

#footer {
display: none;
Expand Down

0 comments on commit 3409da7

Please sign in to comment.