header

src/client/styles/scss/_layout.scss

@@ -50,6 +50,42 @@
 
   header {
     line-height: 1em;
+    // the container of h1
+    div.title-container {
+      padding-right: 5px;
+      padding-left: 5px;
+      margin-right: auto;
+    }
+
+    .btn-copy,
+    .btn-copy-link,
+    .btn-edit {
+      display: block;
+      color: $text-muted;
+      border: none;
+      opacity: 0.3;
+
+      &:not(:hover) {
+        background-color: transparent;
+      }
+      // change button opacity
+      &:hover {
+        opacity: unset;
+      }
+    }
+
+    .btn-edit-tags {
+      color: $text-muted;
+      opacity: 0.5;
+
+      &.no-tags {
+        opacity: 0.7;
+      }
+      // change button opacity
+      &:hover {
+        opacity: unset;
+      }
+    }
 
     h1 {
       @include variable-font-size(28px);

src/client/styles/scss/_override-bootstrap.scss

@@ -86,6 +86,10 @@ h5 {
   .dropdown-toggle.btn.disabled {
     cursor: not-allowed;
   }
+  button {
+    background: transparent;
+    border: none;
+  }
 }
 
 // agile-admin style

src/client/styles/scss/_page.scss

@@ -4,49 +4,6 @@
 .main-container {
   // padding controll of .header-wrap and .content-main are moved to _layout and _form
 
-  /*
-   * header
-   */
-  header {
-    // the container of h1
-    div.title-container {
-      padding-right: 5px;
-      padding-left: 5px;
-      margin-right: auto;
-    }
-
-    .btn-copy,
-    .btn-copy-link,
-    .btn-edit {
-      color: $text-muted;
-      border: none;
-      opacity: 0.3;
-
-      &:not(:hover) {
-        background-color: transparent;
-      }
-    }
-
-    .btn-edit-tags {
-      color: $text-muted;
-      opacity: 0.5;
-
-      &.no-tags {
-        opacity: 0.7;
-      }
-    }
-
-    // change button opacity
-    &:hover {
-      .btn.btn-copy,
-      .btn-copy-link,
-      .btn.btn-edit,
-      .btn.btn-edit-tags {
-        opacity: unset;
-      }
-    }
-  }
-
   .url-line {
     font-size: 1rem;
     color: #999;