Refactor CSS of CI headers and terminal

Move to page specific CSS for headers and terminals, while removing a
duplicated rule.

app/assets/stylesheets/pages/builds.scss

@@ -123,20 +123,13 @@
 }
 
 .build-header {
-  .ci-header-container,
-  .header-action-buttons {
-    display: flex;
-  }
-
-  .ci-header-container {
-    min-height: 54px;
-  }
-
   .page-content-header {
     padding: 10px 0 9px;
   }
 
   .header-action-buttons {
+    display: flex;
+
     @include media-breakpoint-down(xs) {
       .sidebar-toggle-btn {
         margin-top: 0;

app/assets/stylesheets/pages/pipelines.scss

@@ -1013,31 +1013,35 @@ button.mini-pipeline-graph-dropdown-toggle {
 /**
  * Terminal
  */
-.terminal-icon {
-  margin-left: 3px;
-}
-
-.terminal-container {
-  .content-block {
-    border-bottom: 0;
-  }
+[data-page='projects:jobs:terminal'],
+[data-page='projects:environments:terminal'] {
+  .terminal-container {
+    .content-block {
+      border-bottom: 0;
+    }
 
-  #terminal {
-    margin-top: 10px;
-    min-height: 450px;
-    box-sizing: border-box;
+    #terminal {
+      margin-top: 10px;
 
-    > div {
-      min-height: 450px;
+      > div {
+        min-height: 450px;
+      }
     }
   }
 }
 
-.ci-header-container {
-  min-height: 55px;
-
-  .text-center {
-    padding-top: 12px;
+/**
+ * Pipelines / Jobs header
+ */
+[data-page='projects:pipelines:show'],
+[data-page='projects:jobs:show'] {
+  .ci-header-container {
+    min-height: $gl-spacing-scale-7;
+    display: flex;
+
+    .text-center {
+      padding-top: 12px;
+    }
   }
 }