Revert sticky confidential header

2 files changed, 36 insertions, 30 deletions

diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index b3f310ff67d..4abad3f2697 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -729,33 +729,3 @@
     }
   }
 }
-
-.confidential-issue-warning {
-  background-color: $gl-gray;
-  border-radius: 3px;
-  padding: $gl-btn-padding $gl-padding;
-  margin-top: $gl-padding-top;
-  font-size: 14px;
-  color: $white-light;
-
-  .fa {
-    margin-right: 8px;
-  }
-
-  a {
-    color: $white-light;
-    text-decoration: underline;
-  }
-
-  &.affix {
-    position: static;
-    width: initial;
-
-    @media (min-width: $screen-sm-min) {
-      position: sticky;
-      position: -webkit-sticky;
-      top: 60px;
-      z-index: 200;
-    }
-  }
-}
diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss
index aa307414737..69fed4e6bf7 100644
--- a/app/assets/stylesheets/pages/note_form.scss
+++ b/app/assets/stylesheets/pages/note_form.scss
@@ -103,6 +103,42 @@
   }
 }
 
+.confidential-issue-warning {
+  background-color: $gray-normal;
+  border-radius: 3px;
+  padding: 3px 12px;
+  margin: auto;
+  margin-top: 0;
+  text-align: center;
+  font-size: 12px;
+  align-items: center;
+
+  @media (max-width: $screen-md-max) {
+    // On smaller devices the warning becomes the fourth item in the list,
+    // rather than centering, and grows to span the full width of the
+    // comment area.
+    order: 4;
+    margin: 6px auto;
+    width: 100%;
+  }
+
+  .fa {
+    margin-right: 8px;
+  }
+}
+
+.right-sidebar-expanded {
+  .confidential-issue-warning {
+    // When the sidebar is open the warning becomes the fourth item in the list,
+    // rather than centering, and grows to span the full width of the
+    // comment area.
+    order: 4;
+    margin: 6px auto;
+    width: 100%;
+  }
+}
+
+
 .discussion-form {
   padding: $gl-padding-top $gl-padding $gl-padding;
   background-color: $white-light;