adjust css

src/client/js/components/PageTagForm.jsx

@@ -40,7 +40,7 @@ export default class PageTagForm extends React.Component {
   render() {
     return (
       <div className="input-group-sm mx-1">
-        <input className="form-control" type="text" value={this.state.pageTags} placeholder="tag name"
+        <input className="form-control page-tag-form" type="text" value={this.state.pageTags} placeholder="tag name"
           data-toggle="popover"
           title="タグ"
           data-content="タグ付けによりページをカテゴライズすることができます。"

src/client/styles/scss/_on-edit.scss

@@ -100,22 +100,27 @@ body.on-edit {
     .header-wrap {
       overflow-x: hidden;
     }
-    h1#revision-path {
-      @include variable-font-size(20px);
-      line-height: 1em;
-      float: left;
-
-      // nowrap even if the path is too long
-      .d-flex {
-        flex-wrap: nowrap;
-      }
-      .path-segment {
-        white-space: nowrap;
+    div.title-container {
+      margin-right: 0px;
+      h1#revision-path {
+        @include variable-font-size(20px);
+        line-height: 1em;
+
+        // nowrap even if the path is too long
+        .d-flex {
+          flex-wrap: nowrap;
+        }
+        .path-segment {
+          white-space: nowrap;
+        }
       }
     }
     div#page-tag {
-      float: right;
+      margin-right: auto;
       display: inline;
+      .page-tag-form {
+        border-radius: 5px;
+      }
     }
 
     // hide if screen size is less than tablet

src/client/styles/scss/_page.scss

@@ -11,10 +11,11 @@
     // the container of h1
     div.title-container {
       margin-right: auto;
-      // hide unnecessary element
-      div#page-tag {
-        display: none;
-      }
+    }
+
+    // hide unnecessary element
+    div#page-tag {
+      display: none;
     }
 
     .btn-copy, .btn-copy-link, .btn-edit {

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

@@ -8,9 +8,9 @@
       </div>
       <div class="title-container">
         <h1 class="title" id="revision-path"></h1>
-        <div class="tag" id="page-tag"></div>
         <div id="revision-url" class="url-line"></div>
       </div>
+      <div class="tag" id="page-tag"></div>
       {% if page %}
       {% include '../../widget/header-buttons.html' %}