From 73455ac378097d02e622fae44ec4e078545b9176 Mon Sep 17 00:00:00 2001
From: Harry Rein <hrein@edx.org>
Date: Tue, 24 Oct 2017 13:28:16 -0400
Subject: [PATCH] Updating bookmarks and updates pages to be responsive.

---
 lms/static/sass/features/_bookmarks.scss      | 116 ++++++++++--------
 .../sass/features/_course-experience.scss     |   2 +
 2 files changed, 70 insertions(+), 48 deletions(-)

diff --git a/lms/static/sass/features/_bookmarks.scss b/lms/static/sass/features/_bookmarks.scss
index 6b899f41aa..62de513469 100644
--- a/lms/static/sass/features/_bookmarks.scss
+++ b/lms/static/sass/features/_bookmarks.scss
@@ -9,64 +9,84 @@ $bookmarked-icon: "\f02e"; // .fa-bookmark
 }
 
 // Rules for Bookmarks Results
-.bookmarks-results-list {
-  padding-top: ($baseline/2);
+.course-bookmarks {
+  flex-grow: 1;
 
-  .bookmarks-results-list-item {
-    @include padding(0, $baseline, ($baseline/4), $baseline);
+  .bookmarks-results-list {
+    padding-top: ($baseline/2);
 
-    display: block;
-    border: 1px solid $lms-border-color;
-    margin-bottom: $baseline;
+    .bookmarks-results-list-item {
+      @include padding(0, $baseline, ($baseline/4), $baseline);
 
-    &:hover {
-      border-color: palette(primary, base);
+      display: block;
+      border: 1px solid theme-color("light");
+      margin-bottom: $baseline;
 
-      .list-item-breadcrumbtrail {
-        color: palette(primary, base);
+      &:hover {
+        border-color: palette(primary, base);
+
+        .list-item-breadcrumbtrail {
+          color: palette(primary, base);
+        }
+      }
+    }
+
+    .results-list-item-view {
+      @include float(right);
+
+      margin-top: $baseline;
+    }
+
+    .list-item-date {
+      margin-top: ($baseline/4);
+      color: theme-color("dark");
+      font-size: font-size(small);
+    }
+
+    .bookmarks-results-list-item::before {
+      content: $bookmarked-icon;
+      position: relative;
+      top: -7px;
+      font-family: FontAwesome;
+      color: palette(primary, base);
+    }
+
+    .list-item-content {
+      overflow: hidden;
+      position: relative;
+    }
+
+    .list-item-left-section {
+      display: inline-block;
+      vertical-align: middle;
+      width: 90%;
+    }
+
+    .list-item-right-section {
+      @include right(0);
+
+      bottom: $baseline*-0.75;
+      position: absolute;
+      vertical-align: middle;
+
+      .fa-arrow-right {
+        @include rtl {
+          @include transform(rotate(180deg));
+        }
       }
     }
   }
 
-  .results-list-item-view {
-    @include float(right);
-
-    margin-top: $baseline;
+  // Override the search count styling
+  .search-results .search-count {
+    font-size: $font-size-base;
+    font-weight: $font-weight-bold;
   }
 
-  .list-item-date {
-    margin-top: ($baseline/4);
-    color: $lms-gray;
-    font-size: font-size(small);
-  }
-
-  .bookmarks-results-list-item::before {
-    content: $bookmarked-icon;
-    position: relative;
-    top: -7px;
-    font-family: FontAwesome;
-    color: palette(primary, base);
-  }
-
-  .list-item-content {
-    overflow: hidden;
-  }
-
-  .list-item-left-section {
-    display: inline-block;
-    vertical-align: middle;
-    width: 90%;
-  }
-
-  .list-item-right-section {
-    display: inline-block;
-    vertical-align: middle;
-
-    .fa-arrow-right {
-      @include rtl {
-        @include transform(rotate(180deg));
-      }
-    }
+  // Override the pagination behavior
+  .pagination.pagination-full {
+    width: 100%;
+    text-align: center;
   }
 }
 
diff --git a/lms/static/sass/features/_course-experience.scss b/lms/static/sass/features/_course-experience.scss
index 5d6eb8f714..d1593bafef 100644
--- a/lms/static/sass/features/_course-experience.scss
+++ b/lms/static/sass/features/_course-experience.scss
@@ -438,6 +438,8 @@
 // Course Updates Page
 .course-updates {
   .all-updates {
+    flex-grow: 1;
+
     .updates-article {
       margin: ($baseline*6/5) 0;
       padding-bottom: ($baseline*6/5);