11 files changed, 117 insertions, 73 deletions
diff --git a/app/assets/stylesheets/framework/awards.scss b/app/assets/stylesheets/framework/awards.scss
index e0d2ed80de5..a538b5a2946 100644
--- a/app/assets/stylesheets/framework/awards.scss
+++ b/app/assets/stylesheets/framework/awards.scss
@@ -174,12 +174,13 @@
 
   &.user-authored {
     cursor: default;
-    opacity: 0.65;
+    background-color: $gray-light;
+    border-color: $theme-gray-200;
+    color: $gl-text-color-disabled;
 
-    &:hover,
-    &:active {
-      background-color: $white-light;
-      border-color: $border-color;
+    gl-emoji {
+      opacity: 0.4;
+      filter: grayscale(100%);
     }
   }
 
diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index fcc420923f9..d0b0c69b18f 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/app/assets/stylesheets/framework/buttons.scss
@@ -220,14 +220,6 @@
     @include btn-with-margin;
   }
 
-  &.disabled {
-    pointer-events: auto !important;
-  }
-
-  &[disabled] {
-    pointer-events: none !important;
-  }
-
   .fa-caret-down,
   .fa-chevron-down {
     margin-left: 5px;
@@ -450,3 +442,28 @@
 .btn-svg svg {
   @include btn-svg;
 }
+
+// All disabled buttons, regardless of color, type, etc
+%disabled {
+  background-color: $gray-light !important;
+  border-color: $theme-gray-200 !important;
+  color: $gl-text-color-disabled !important;
+  opacity: 1 !important;
+  cursor: default !important;
+
+  i {
+    color: $gl-text-color-disabled !important;
+  }
+}
+
+.btn.disabled,
+.btn[disabled],
+fieldset[disabled] .btn,
+.dropdown-toggle[disabled],
+[disabled].dropdown-menu-toggle {
+  @extend %disabled;
+
+  &:hover {
+    @extend %disabled;
+  }
+}
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index 4c6b32630e1..691df098c70 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -63,11 +63,6 @@
   border-radius: $border-radius-base;
   white-space: nowrap;
 
-  &[disabled] {
-    opacity: .65;
-    cursor: not-allowed;
-  }
-
   &.no-outline {
     outline: 0;
   }
diff --git a/app/assets/stylesheets/framework/files.scss b/app/assets/stylesheets/framework/files.scss
index 1e91db5af9b..d835d49d8b2 100644
--- a/app/assets/stylesheets/framework/files.scss
+++ b/app/assets/stylesheets/framework/files.scss
@@ -124,6 +124,10 @@
 
     &.wiki {
       padding: $gl-padding;
+
+      @media (min-width: $screen-md-min) {
+        padding: $gl-padding * 2;
+      }
     }
 
     &.blob-no-preview {
diff --git a/app/assets/stylesheets/framework/issue_box.scss b/app/assets/stylesheets/framework/issue_box.scss
index 1d8bd26cf1a..d8c57a0e2d9 100644
--- a/app/assets/stylesheets/framework/issue_box.scss
+++ b/app/assets/stylesheets/framework/issue_box.scss
@@ -24,15 +24,13 @@
   font-size: $gl-font-size;
   line-height: 25px;
 
+  &.status-box-closed,
   &.status-box-mr-closed {
     background-color: $gl-danger;
   }
 
-  &.status-box-issue-closed {
-    background-color: $gl-primary;
-  }
-
-  &.status-box-merged {
+  &.status-box-issue-closed,
+  &.status-box-mr-merged {
     background-color: $gl-primary;
   }
 
diff --git a/app/assets/stylesheets/framework/modal.scss b/app/assets/stylesheets/framework/modal.scss
index 924472f2d7e..51ae09777fd 100644
--- a/app/assets/stylesheets/framework/modal.scss
+++ b/app/assets/stylesheets/framework/modal.scss
@@ -12,6 +12,7 @@
   min-height: $modal-body-height;
   position: relative;
   padding: #{3 * $grid-size} #{2 * $grid-size};
+  text-align: left;
 
   .form-actions {
     margin: #{2 * $grid-size} #{-2 * $grid-size} #{-2 * $grid-size};
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index da18ddf78d3..f76c6866463 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -164,6 +164,7 @@ $gl-text-color-tertiary: #949494;
 $gl-text-color-quaternary: #d6d6d6;
 $gl-text-color-inverted: rgba(255, 255, 255, 1);
 $gl-text-color-secondary-inverted: rgba(255, 255, 255, .85);
+$gl-text-color-disabled: #919191;
 $gl-text-green: $green-600;
 $gl-text-green-hover: $green-700;
 $gl-text-red: $red-500;
@@ -258,6 +259,8 @@ $general-hover-transition-duration: 100ms;
 $general-hover-transition-curve: linear;
 $highlight-changes-color: rgb(235, 255, 232);
 $performance-bar-height: 35px;
+$flash-height: 52px;
+$context-header-height: 60px;
 
 /*
 * Common component specific colors
diff --git a/app/assets/stylesheets/pages/cycle_analytics.scss b/app/assets/stylesheets/pages/cycle_analytics.scss
index 3b35beb7695..cfef6476d4d 100644
--- a/app/assets/stylesheets/pages/cycle_analytics.scss
+++ b/app/assets/stylesheets/pages/cycle_analytics.scss
@@ -117,47 +117,6 @@
     top: $gl-padding-top;
   }
 
-  .content-list {
-    li {
-      padding: 18px $gl-padding $gl-padding;
-
-      .container-fluid {
-        padding: 0;
-      }
-    }
-
-    .title-col {
-      p {
-        margin: 0;
-
-        &.title {
-          line-height: 19px;
-          font-size: 14px;
-          font-weight: $gl-font-weight-bold;
-          color: $gl-text-color;
-        }
-
-        &.text {
-          color: $layout-link-gray;
-
-          &.value-col {
-            color: $gl-text-color;
-          }
-        }
-      }
-    }
-
-    .value-col {
-      text-align: right;
-
-      span {
-        position: relative;
-        vertical-align: middle;
-        top: 3px;
-      }
-    }
-  }
-
   .fa-spinner {
     font-size: 28px;
     position: relative;
diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss
index 6d4ccd53e12..bf8eb4c1f06 100644
--- a/app/assets/stylesheets/pages/note_form.scss
+++ b/app/assets/stylesheets/pages/note_form.scss
@@ -391,11 +391,17 @@
   .dropdown-toggle {
     float: right;
 
-    .toggle-icon {
+    i {
       color: $white-light;
       padding-right: 2px;
       margin-top: 2px;
     }
+
+    &[disabled] {
+      i {
+        color: $gl-text-color-disabled;
+      }
+    }
   }
 
   .dropdown-menu {
diff --git a/app/assets/stylesheets/pages/pipelines.scss b/app/assets/stylesheets/pages/pipelines.scss
index 766e02b12ea..db88d4a16b7 100644
--- a/app/assets/stylesheets/pages/pipelines.scss
+++ b/app/assets/stylesheets/pages/pipelines.scss
@@ -228,7 +228,7 @@
 .stage-cell {
   &.table-section {
     @media (min-width: $screen-md-min) {
-      min-width: 148px;
+      min-width: 160px; /* Hack alert: Without this the mini graph pipeline won't work properly*/
       margin-right: -4px;
     }
   }
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index acbd9936706..8265b8370f7 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -107,6 +107,11 @@ table.table tr td.multi-file-table-name {
     vertical-align: middle;
     margin-right: 2px;
   }
+
+  .loading-container {
+    margin-right: 4px;
+    display: inline-block;
+  }
 }
 
 .multi-file-table-col-commit-message {
@@ -247,7 +252,6 @@ table.table tr td.multi-file-table-name {
   display: flex;
   position: relative;
   flex-direction: column;
-  height: 100%;
   width: 290px;
   padding: 0;
   background-color: $gray-light;
@@ -256,6 +260,11 @@ table.table tr td.multi-file-table-name {
   .projects-sidebar {
     display: flex;
     flex-direction: column;
+
+    .context-header {
+      width: auto;
+      margin-right: 0;
+    }
   }
 
   .multi-file-commit-panel-inner {
@@ -496,19 +505,70 @@ table.table tr td.multi-file-table-name {
   }
 }
 
-.ide-flash-container.flash-container {
-  margin-top: $header-height;
-  margin-bottom: 0;
+.ide.nav-only {
+  .flash-container {
+    margin-top: $header-height;
+    margin-bottom: 0;
+  }
+
+  .alert-wrapper .flash-container .flash-alert:last-child,
+  .alert-wrapper .flash-container .flash-notice:last-child {
+    margin-bottom: 0;
+  }
+
+  .content {
+    margin-top: $header-height;
+  }
+
+  .multi-file-commit-panel .multi-file-commit-panel-inner-scroll {
+    max-height: calc(100vh - #{$header-height + $context-header-height});
+  }
+
+  &.flash-shown {
+    .content {
+      margin-top: 0;
+    }
+
+    .ide-view {
+      height: calc(100vh - #{$header-height + $flash-height});
+    }
+
+    .multi-file-commit-panel .multi-file-commit-panel-inner-scroll {
+      max-height: calc(100vh - #{$header-height + $flash-height + $context-header-height});
+    }
+  }
 }
 
-.with-performance-bar {
-  .ide-flash-container.flash-container {
-    margin-top: $header-height + $performance-bar-height;
+.with-performance-bar .ide.nav-only {
+  .flash-container {
+    margin-top: #{$header-height + $performance-bar-height};
+  }
+
+  .content {
+    margin-top: #{$header-height + $performance-bar-height};
   }
 
   .ide-view {
     height: calc(100vh - #{$header-height + $performance-bar-height});
   }
+
+  .multi-file-commit-panel .multi-file-commit-panel-inner-scroll {
+    max-height: calc(100vh - #{$header-height + $performance-bar-height + 60});
+  }
+
+  &.flash-shown {
+    .content {
+      margin-top: 0;
+    }
+
+    .ide-view {
+      height: calc(100vh - #{$header-height + $performance-bar-height + $flash-height});
+    }
+
+    .multi-file-commit-panel .multi-file-commit-panel-inner-scroll {
+      max-height: calc(100vh - #{$header-height + $performance-bar-height + $flash-height + $context-header-height});
+    }
+  }
 }