9 files changed, 61 insertions, 17 deletions

diff --git a/app/assets/stylesheets/bootstrap_migration.scss b/app/assets/stylesheets/bootstrap_migration.scss
index e3c63ae5e1a..88d6bae349a 100644
--- a/app/assets/stylesheets/bootstrap_migration.scss
+++ b/app/assets/stylesheets/bootstrap_migration.scss
@@ -89,6 +89,10 @@ a {
   color: $gl-link-color;
 }
 
+hr {
+  overflow: hidden;
+}
+
 .form-group.row .col-form-label {
   // Bootstrap 4 aligns labels to the left
   // for horizontal forms
@@ -209,6 +213,10 @@ table {
       border-bottom: 1px solid $well-inner-border;
     }
   }
+
+  .badge.badge-gray {
+    background-color: $well-expand-item;
+  }
 }
 
 .card {
@@ -258,9 +266,17 @@ pre code {
 .alert-danger {
   background-color: $red-500;
   border-color: $red-500;
+}
+
+.alert-warning,
+.alert-danger,
+.flash-notice {
+  border-radius: 0;
   color: $white-light;
 
-  h4 {
+  h4,
+  a,
+  .alert-link {
     color: $white-light;
   }
 }
@@ -268,3 +284,11 @@ pre code {
 input[type=color].form-control {
   height: $input-height;
 }
+
+.toggle-sidebar-button {
+  .collapse-text,
+  .icon-angle-double-left,
+  .icon-angle-double-right {
+    color: $gl-text-color-secondary;
+  }
+}
diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss
index 996e5c1512d..e5197e27b82 100644
--- a/app/assets/stylesheets/framework/common.scss
+++ b/app/assets/stylesheets/framework/common.scss
@@ -305,14 +305,6 @@ img.emoji {
   margin-bottom: 10px;
 }
 
-.btn-sign-in {
-  text-shadow: none;
-
-  @include media-breakpoint-up(sm) {
-    margin-top: 8px;
-  }
-}
-
 .side-filters {
   fieldset {
     margin-bottom: 15px;
diff --git a/app/assets/stylesheets/framework/forms.scss b/app/assets/stylesheets/framework/forms.scss
index c76ea532912..03520f42997 100644
--- a/app/assets/stylesheets/framework/forms.scss
+++ b/app/assets/stylesheets/framework/forms.scss
@@ -170,7 +170,7 @@ label {
 }
 
 .form-control::-webkit-input-placeholder {
-  color: $gl-text-color-secondary;
+  color: $placeholder-text-color;
 }
 
 .input-group {
diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss
index 6fbc624dee4..1d5bdaa8961 100644
--- a/app/assets/stylesheets/framework/header.scss
+++ b/app/assets/stylesheets/framework/header.scss
@@ -447,12 +447,16 @@
 .btn-sign-in {
   background-color: $indigo-100;
   color: $indigo-900;
-  margin-top: 3px;
   font-weight: $gl-font-weight-bold;
+  line-height: 18px;
 
   &:hover {
     background-color: $white-light;
   }
+
+  @include media-breakpoint-down(xs) {
+    margin-top: $gl-padding-4;
+  }
 }
 
 .navbar-nav {
diff --git a/app/assets/stylesheets/framework/pagination.scss b/app/assets/stylesheets/framework/pagination.scss
index 50a1b1c446d..61d02511ff4 100644
--- a/app/assets/stylesheets/framework/pagination.scss
+++ b/app/assets/stylesheets/framework/pagination.scss
@@ -4,3 +4,11 @@
     text-decoration: none;
   }
 }
+
+.page-item {
+  &.active {
+    .page-link {
+      z-index: 3;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/framework/timeline.scss b/app/assets/stylesheets/framework/timeline.scss
index 75c11590547..dfb145debe7 100644
--- a/app/assets/stylesheets/framework/timeline.scss
+++ b/app/assets/stylesheets/framework/timeline.scss
@@ -4,7 +4,7 @@
   padding: 0;
 
   &::before {
-    @include notes-media('max', map-get($grid-breakpoints, xs)) {
+    @include notes-media('max', map-get($grid-breakpoints, sm)) {
       background: none;
     }
   }
@@ -34,7 +34,7 @@
   .timeline-entry-inner {
     position: relative;
 
-    @include notes-media('max', map-get($grid-breakpoints, xs)) {
+    @include notes-media('max', map-get($grid-breakpoints, sm)) {
       .timeline-icon {
         display: none;
       }
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 497261f938f..d1179df96a9 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -99,7 +99,7 @@ $theme-gray-200: #dfdfdf;
 $theme-gray-300: #cccccc;
 $theme-gray-400: #bababa;
 $theme-gray-500: #a7a7a7;
-$theme-gray-600: #949494;
+$theme-gray-600: #919191;
 $theme-gray-700: #707070;
 $theme-gray-800: #4f4f4f;
 $theme-gray-900: #2e2e2e;
@@ -191,7 +191,7 @@ $gl-font-weight-normal: 400;
 $gl-font-weight-bold: 600;
 $gl-text-color: #2e2e2e;
 $gl-text-color-secondary: #707070;
-$gl-text-color-tertiary: #949494;
+$gl-text-color-tertiary: #919191;
 $gl-text-color-quaternary: #d6d6d6;
 $gl-text-color-inverted: rgba(255, 255, 255, 1);
 $gl-text-color-secondary-inverted: rgba(255, 255, 255, 0.85);
@@ -435,6 +435,22 @@ $badge-bg: rgba(0, 0, 0, 0.07);
 $badge-color: $gl-text-color-secondary;
 
 /*
+* Pagination
+*/
+$pagination-padding-y: 6px;
+$pagination-padding-x: 16px;
+$pagination-line-height: 20px;
+$pagination-border-color: $border-color;
+$pagination-active-bg: $blue-600;
+$pagination-active-border-color: $blue-600;
+$pagination-hover-bg: $blue-50;
+$pagination-hover-border-color: $border-color;
+$pagination-hover-color: $gl-text-color;
+$pagination-disabled-color: #cdcdcd;
+$pagination-disabled-bg: $gray-light;
+$pagination-disabled-border-color: $border-color;
+
+/*
  *  Status icons
  */
 $status-icon-size: 22px;
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index 3c7edb0d4bb..6e7fc50c63d 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -1129,7 +1129,7 @@
 
 .ide-context-header {
   .avatar {
-    flex: 0 0 40px;
+    flex: 0 0 38px;
   }
 
   .ide-merge-requests-dropdown.dropdown-menu {
diff --git a/app/assets/stylesheets/pages/search.scss b/app/assets/stylesheets/pages/search.scss
index 5f15795a8e3..765c926751a 100644
--- a/app/assets/stylesheets/pages/search.scss
+++ b/app/assets/stylesheets/pages/search.scss
@@ -29,7 +29,7 @@ input[type="checkbox"]:hover {
 }
 
 .search {
-  margin: 4px 8px 0;
+  margin: 0 8px;
 
   form {
     @extend .form-control;