tab revice fixed

src/client/styles/scss/_layout.scss

@@ -107,12 +107,28 @@ $nav-main-left-tab-width: 95px;
 
 .nav.nav-tabs {
   .nav-main-left-tab {
-    width: $nav-main-left-tab-width;
+    position: relative;
+    min-width: $nav-main-left-tab-width;
     text-align: center;
     a {
       padding-right: 0;
       padding-left: 0;
     }
+    &.active {
+      border-top: 1px solid $grw-line-light-gray;
+      border-right: 1px solid $grw-line-light-gray;
+      border-left: 1px solid $grw-line-light-gray;
+    }
+    &.active::before {
+      // TODO activeを移動できるようにするべき
+      position: absolute;
+      top: 40px;
+      left: 0;
+      display: block;
+      width: $nav-main-left-tab-width - 2px;
+      content: '';
+      border-bottom: 3px solid white;
+    }
   }
 }
 
@@ -181,8 +197,3 @@ $nav-main-left-tab-width: 95px;
     }
   }
 }
-
-// tab style
-.nav.nav-tabs .nav-main-left-tab {
-  width: 120px;
-}

src/client/styles/scss/_layout_variable.scss

@@ -5,6 +5,7 @@ $grw-base-green: rgb(7, 146, 72);
 $grw-mos-green: rgb(5, 70, 35);
 $grw-light-green: rgb(204, 238, 220);
 $grw-white-green: #f8fffb;
+$grw-sea-green: seagreen;
 
 .bg-grw-green {
   background: $grw-base-green;
@@ -20,3 +21,6 @@ $grw-white-green: #f8fffb;
 
 /* blue */
 $grw-alice-blue: aliceblue;
+
+/* gray */
+$grw-line-light-gray: #ddd;

src/client/styles/scss/_wiki.scss

@@ -1,3 +1,5 @@
+@import 'layout_variable';
+
 div.body {
   padding: 10px;
 }
@@ -26,11 +28,12 @@ div.body {
   }
 
   h1 {
-    padding-bottom: 0.3em;
+    padding: 0.5em 0;
     margin-top: 2em;
     font-size: 1.8em;
     line-height: 1.1em;
-    border-bottom: solid 1px transparent;
+    color: $grw-sea-green;
+    border-bottom: solid 1px $grw-line-light-gray;
   }
   h2 {
     padding-bottom: 0.5em;

src/server/views/layout-growi/base/layout.html

@@ -16,7 +16,7 @@
   </div><!-- /.bg-title -->
 
   <div class="row">
-    <div id="main" class="main m-t-15 col-md-12 {% if page %}{{ css.grant(page) }}{% endif %} {% block main_css_class %}{% endblock %}">
+    <div id="main" class="main m-t-15 col-md-12 mt-2 {% if page %}{{ css.grant(page) }}{% endif %} {% block main_css_class %}{% endblock %}">
       {% block content_main_before %}
       {% endblock %}
 

src/server/views/widget/page_alerts.html

@@ -1,4 +1,4 @@
-<div class="row row-alerts">
+<div class="row">
   <div class="col-xs-12">
     {% if page && page.grant && page.grant > 1 %}
 

src/server/views/widget/page_tabs.html

@@ -29,7 +29,7 @@
     Right Tabs
   #}
 
-  <li class="nav-main-right-tab ml-auto px-3 py-2">
+  <li class="nav-main-right-tab ml-md-auto px-3 py-2">
     <a href="#revision-history" data-toggle="tab">
       <i class="icon-layers"></i><span class="hidden-xs"> {{ t('History') }}</span>
     </a>
@@ -53,7 +53,7 @@
       </ul>
     </li>
     {% else %}
-    <li class="nav-main-right-tab dropdown ml-auto px-3 py-2">
+    <li class="nav-main-right-tab dropdown px-3 py-2">
       <a class="dropdown-toggle {% if not user %}dropdown-disabled{% endif %}" {% if user %}data-toggle="dropdown" href="#"{% endif %}>
         <i class="icon-options-vertical"></i>
       </a>