adjust button style

src/client/js/components/BookmarkButton.jsx

@@ -78,7 +78,7 @@ export default class BookmarkButton extends React.Component {
         href="#"
         title="Bookmark"
         onClick={this.handleClick}
-        className={`btn-bookmark btn btn-circle btn-outline-secondary ${addedClassName}`}
+        className={`btn-bookmark btn btn-circle btn-outline-secondary border-0 ${addedClassName}`}
       >
         <i className="icon-star"></i>
       </button>

src/client/js/components/LikeButton.jsx

@@ -59,7 +59,7 @@ class LikeButton extends React.Component {
         href="#"
         title="Like"
         onClick={this.handleClick}
-        className={`btn-like btn btn-circle btn-outline-secondary ${addedClassName}`}
+        className={`btn-like btn btn-circle btn-outline-secondary border-0 ${addedClassName}`}
       >
         <i className="icon-like"></i>
       </button>

src/client/styles/scss/_page.scss

@@ -60,13 +60,31 @@
 
   .btn-like {
     &.active {
-      @extend .btn-info;
+      background-color: $info;
+      border: 1px solid $info;
+
+      &:hover,
+      &:focus,
+      &.focus {
+        background-color: $info;
+        border: 1px solid $info;
+        opacity: 0.8;
+      }
     }
   }
 
   .btn-bookmark {
     &.active {
-      @extend .btn-warning;
+      background: $warning;
+      border: 1px solid $warning;
+
+      &:hover,
+      &:focus,
+      &.focus {
+        background: $warning;
+        border: 1px solid $warning;
+        opacity: 0.8;
+      }
     }
   }
 

src/server/views/layout-growi/widget/header.html

@@ -8,7 +8,7 @@
         </a>
       </div><!-- /.title-logo-container -->
 
-      <div class="title-container">
+      <div class="title-container mr-auto">
         <h1 class="title" id="revision-path"></h1>
         {% if not forbidden and not isTrashPage() %}
           <div id="tag-label"></div>