Merge branch 'last-green-master' into 18471-restrict-tag-pushes-protected-tags

10 files changed, 125 insertions, 11 deletions

diff --git a/app/assets/stylesheets/framework/awards.scss b/app/assets/stylesheets/framework/awards.scss
index 1ae144fb471..b849cc2d853 100644
--- a/app/assets/stylesheets/framework/awards.scss
+++ b/app/assets/stylesheets/framework/awards.scss
@@ -91,7 +91,7 @@
 
 .award-menu-holder {
   display: inline-block;
-  position: relative;
+  position: absolute;
 
   .tooltip {
     white-space: nowrap;
@@ -117,11 +117,41 @@
 
   &.active,
   &:hover,
-  &:active {
+  &:active,
+  &.is-active {
     background-color: $row-hover;
     border-color: $row-hover-border;
     box-shadow: none;
     outline: 0;
+
+    .award-control-icon svg {
+      background: $award-emoji-positive-add-bg;
+
+      path {
+        fill: $award-emoji-positive-add-lines;
+      }
+    }
+
+    .award-control-icon-neutral {
+      opacity: 0;
+    }
+
+    .award-control-icon-positive {
+      opacity: 1;
+      transform: scale(1.15);
+    }
+  }
+
+  &.is-active {
+    .award-control-icon-positive {
+      opacity: 0;
+      transform: scale(1);
+    }
+
+    .award-control-icon-super-positive {
+      opacity: 1;
+      transform: scale(1);
+    }
   }
 
   &.btn {
@@ -162,9 +192,33 @@
     color: $border-gray-normal;
     margin-top: 1px;
     padding: 0 2px;
+
+    svg {
+      margin-bottom: 1px;
+      height: 18px;
+      width: 18px;
+      border-radius: 50%;
+
+      path {
+        fill: $border-gray-normal;
+      }
+    }
+  }
+
+  .award-control-icon-positive,
+  .award-control-icon-super-positive {
+    position: absolute;
+    left: 7px;
+    bottom: 9px;
+    opacity: 0;
+    @include transition(opacity, transform);
   }
 
   .award-control-text {
     vertical-align: middle;
   }
 }
+
+.note-awards .award-control-icon-positive {
+  left: 6px;
+}
diff --git a/app/assets/stylesheets/framework/files.scss b/app/assets/stylesheets/framework/files.scss
index ffece53a093..ddea1cf540b 100644
--- a/app/assets/stylesheets/framework/files.scss
+++ b/app/assets/stylesheets/framework/files.scss
@@ -275,3 +275,9 @@ span.idiff {
     }
   }
 }
+
+.is-stl-loading {
+  .stl-controls {
+    display: none;
+  }
+}
diff --git a/app/assets/stylesheets/framework/modal.scss b/app/assets/stylesheets/framework/modal.scss
index 8cd49280e1c..7098203321d 100644
--- a/app/assets/stylesheets/framework/modal.scss
+++ b/app/assets/stylesheets/framework/modal.scss
@@ -16,6 +16,8 @@ body.modal-open {
   overflow: hidden;
 }
 
-.modal .modal-dialog {
-  width: 860px;
+@media (min-width: $screen-md-min) {
+  .modal-dialog {
+    width: 860px;
+  }
 }
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 97794a47df8..712eb7caf33 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -293,6 +293,8 @@ $badge-color: $gl-text-color-secondary;
  *  Award emoji
  */
 $award-emoji-menu-shadow: rgba(0,0,0,.175);
+$award-emoji-positive-add-bg: #fed159;
+$award-emoji-positive-add-lines: #bb9c13;
 
 /*
  * Search Box
diff --git a/app/assets/stylesheets/pages/environments.scss b/app/assets/stylesheets/pages/environments.scss
index 6faa3794c83..72e7d42858d 100644
--- a/app/assets/stylesheets/pages/environments.scss
+++ b/app/assets/stylesheets/pages/environments.scss
@@ -233,6 +233,15 @@
   stroke-width: 1;
 }
 
+.prometheus-state {
+  margin-top: 10px;
+  display: none;
+
+  .state-button-section {
+    margin-top: 10px;
+  }
+}
+
 .environments-actions {
   .external-url,
   .monitoring-url,
diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss
index 566dcc64802..2f946ab2f59 100644
--- a/app/assets/stylesheets/pages/merge_requests.scss
+++ b/app/assets/stylesheets/pages/merge_requests.scss
@@ -329,8 +329,6 @@
 }
 
 #modal_merge_info .modal-dialog {
-  width: 600px;
-
   .dark {
     margin-right: 40px;
   }
diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss
index 57cf8e136e2..603ef461ffe 100644
--- a/app/assets/stylesheets/pages/notes.scss
+++ b/app/assets/stylesheets/pages/notes.scss
@@ -398,13 +398,50 @@ ul.notes {
     font-size: 17px;
   }
 
-  &:hover {
+  svg {
+    height: 16px;
+    width: 16px;
+    fill: $gray-darkest;
+    vertical-align: text-top;
+  }
+
+  .award-control-icon-positive,
+  .award-control-icon-super-positive {
+    position: absolute;
+    margin-left: -20px;
+    opacity: 0;
+  }
+
+  &:hover,
+  &.is-active {
     .danger-highlight {
       color: $gl-text-red;
     }
 
     .link-highlight {
       color: $gl-link-color;
+
+      svg {
+        fill: $gl-link-color;
+      }
+    }
+
+    .award-control-icon-neutral {
+      opacity: 0;
+    }
+
+    .award-control-icon-positive {
+      opacity: 1;
+    }
+  }
+
+  &.is-active {
+    .award-control-icon-positive {
+      opacity: 0;
+    }
+
+    .award-control-icon-super-positive {
+      opacity: 1;
     }
   }
 }
@@ -508,7 +545,6 @@ ul.notes {
 }
 
 .line-resolve-all-container {
-
   .btn-group {
     margin-left: -4px;
   }
@@ -537,7 +573,6 @@ ul.notes {
       fill: $gray-darkest;
     }
   }
-
 }
 
 .line-resolve-all {
diff --git a/app/assets/stylesheets/pages/profile.scss b/app/assets/stylesheets/pages/profile.scss
index 703c5fc8869..8c6dd392865 100644
--- a/app/assets/stylesheets/pages/profile.scss
+++ b/app/assets/stylesheets/pages/profile.scss
@@ -230,6 +230,14 @@
     font-size: 0;
   }
 
+  .fade-right {
+    right: 0;
+  }
+
+  .fade-left {
+    left: 0;
+  }
+
   @media (max-width: $screen-xs-max) {
     .cover-block {
       padding-top: 20px;
diff --git a/app/assets/stylesheets/pages/settings_ci_cd.scss b/app/assets/stylesheets/pages/settings_ci_cd.scss
index b97a29cd1a0..fe22d186af1 100644
--- a/app/assets/stylesheets/pages/settings_ci_cd.scss
+++ b/app/assets/stylesheets/pages/settings_ci_cd.scss
@@ -6,6 +6,8 @@
 }
 
 .trigger-actions {
+  white-space: nowrap;
+
   .btn {
     margin-left: 10px;
   }
diff --git a/app/assets/stylesheets/pages/tree.scss b/app/assets/stylesheets/pages/tree.scss
index fc4da4c495f..f3916622b6f 100644
--- a/app/assets/stylesheets/pages/tree.scss
+++ b/app/assets/stylesheets/pages/tree.scss
@@ -145,8 +145,6 @@
   margin: 0;
 }
 
-#modal-remove-blob > .modal-dialog { width: 850px; }
-
 .blob-upload-dropzone-previews {
   text-align: center;
   border: 2px;