Merge pull request #50 from MITx/el-border-radius-course-content-fix

Fixes border radius overflow issue on course content wrapper

static/css/application.css

@@ -2694,7 +2694,19 @@ body.courseware {
 div.course-wrapper ul, div.course-wrapper ol {
   list-style: none; }
 div.course-wrapper section.course-content {
-  overflow: hidden; }
+  overflow: hidden;
+  -webkit-border-top-right-radius: 4px;
+  -moz-border-top-right-radius: 4px;
+  -moz-border-radius-topright: 4px;
+  -ms-border-top-right-radius: 4px;
+  -o-border-top-right-radius: 4px;
+  border-top-right-radius: 4px;
+  -webkit-border-bottom-right-radius: 4px;
+  -moz-border-bottom-right-radius: 4px;
+  -moz-border-radius-bottomright: 4px;
+  -ms-border-bottom-right-radius: 4px;
+  -o-border-bottom-right-radius: 4px;
+  border-bottom-right-radius: 4px; }
 div.course-wrapper section.course-content h1 {
   margin: 0 0 22.652px; }
 div.course-wrapper section.course-content p {
@@ -3569,7 +3581,13 @@ div.course-wrapper.closed section.course-content div.video-subtitles ol.subtitle
 nav.sequence-nav {
   border-bottom: 1px solid #e4d080;
   margin-bottom: 22.652px;
-  position: relative; }
+  position: relative;
+  -webkit-border-top-right-radius: 4px;
+  -moz-border-top-right-radius: 4px;
+  -moz-border-radius-topright: 4px;
+  -ms-border-top-right-radius: 4px;
+  -o-border-top-right-radius: 4px;
+  border-top-right-radius: 4px; }
 nav.sequence-nav ol {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
@@ -3754,7 +3772,13 @@ nav.sequence-nav ul li.prev a {
 nav.sequence-nav ul li.prev a:hover {
   background-color: none; }
 nav.sequence-nav ul li.next a {
-  background-image: url("/static/images/sequence-nav/next-icon.png"); }
+  background-image: url("/static/images/sequence-nav/next-icon.png");
+  -webkit-border-top-right-radius: 4px;
+  -moz-border-top-right-radius: 4px;
+  -moz-border-radius-topright: 4px;
+  -ms-border-top-right-radius: 4px;
+  -o-border-top-right-radius: 4px;
+  border-top-right-radius: 4px; }
 nav.sequence-nav ul li.next a:hover {
   background-color: none; }
 

templates/sass/courseware/_courseware.scss

@@ -18,6 +18,8 @@ div.course-wrapper {
   section.course-content {
     @extend .content;
     overflow: hidden;
+    @include border-top-right-radius(4px);
+    @include border-bottom-right-radius(4px);
 
     h1 {
       margin: 0 0 lh();

templates/sass/courseware/_sequence-nav.scss

@@ -3,6 +3,7 @@ nav.sequence-nav {
   border-bottom: 1px solid darken($cream, 20%);
   margin-bottom: $body-line-height;
   position: relative;
+  @include border-top-right-radius(4px);
 
   ol {
     @include box-sizing(border-box);
@@ -221,6 +222,7 @@ nav.sequence-nav {
       &.next {
         a {
           background-image: url('/static/images/sequence-nav/next-icon.png');
+          @include border-top-right-radius(4px);
 
           &:hover {
             background-color: none;