FB対応完了

src/client/js/components/HeaderSearchBox.jsx

@@ -67,7 +67,7 @@ class HeaderSearchBox extends React.Component {
 
     return (
       <FormGroup>
-        <InputGroup>
+        <InputGroup className="flex-nowrap">
           <InputGroup.Button className="btn-group-dropdown-scope" data-toggle="dropdown">
             <DropdownButton id="dbScope" className="pl-3 py-0" title={scopeLabel}>
               <MenuItem onClick={this.onClickAllPages}>All pages</MenuItem>

src/client/styles/scss/_layout.scss

@@ -179,50 +179,9 @@ $nav-main-left-tab-width: 95px;
   }
 }
 
-// dropdown menu for search
-// inherited from elite.admin.scss //TODO:SCSSの分離
-.dropdown-menu {
-  $grw-dropdown-margin-top: 0.5em;
-  padding-bottom: 8px;
-  margin-top: $grw-dropdown-margin-top;
-  border: 1px solid $border;
-  border-radius: $radius;
-  -webkit-box-shadow: 0px !important;
-  -moz-box-shadow: 0px !important;
-  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05) !important;
-  li > a {
-    display: block;
-    padding: 0.25em 0.75em;
-    color: #333;
-    text-decoration: none;
-    white-space: nowrap;
-    &:focus,
-    &:hover {
-      background: aliceblue;
-    }
-  }
-
-  .search-typeahead & {
-    margin-top: $grw-dropdown-margin-top !important;
-  }
-}
-
-//TODO:SCSSの分離（search 関連のスタイル）
-.grw-search-table {
-  caption {
-    display: table-header-group;
-  }
-  code {
-    padding: 0.25em;
-    background: aliceblue;
-  }
-}
-
-//TODO:SCSSの分離（user action 関連のスタイル）
-.nav-item-user {
-  .dropdown-toggle {
-    &::after {
-      margin: 0.75em 0 0 0.75em;
-    }
+// nav bar user name
+.user-name {
+  @media screen and (max-width: 380px) {
+    font-size: 14px;
   }
 }

src/client/styles/scss/_search.scss

@@ -218,3 +218,14 @@
     padding: 0px 10px;
   }
 }
+
+// support for your search
+.grw-search-table {
+  caption {
+    display: table-header-group;
+  }
+  code {
+    padding: 0.25em;
+    background: aliceblue;
+  }
+}

src/client/styles/scss/style-app.scss

@@ -29,6 +29,7 @@
 @import 'layout_growi';
 @import 'layout_kibela';
 @import 'layout_variable';
+@import 'theme/override-agileadmin';
 @import 'login';
 @import 'notification';
 @import 'on-edit';

src/client/styles/scss/theme/_override-agileadmin.scss

@@ -146,6 +146,40 @@ button.btn.btn-link:hover {
   }
 }
 
+// dropdown menu for search
+// inherited from elite.admin.scss
+.dropdown-menu {
+  $grw-dropdown-margin-top: 0.5em;
+  margin-top: $grw-dropdown-margin-top;
+  border: 1px solid $border;
+  border-radius: $radius;
+  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
+  li > a {
+    display: block;
+    padding: 0.25em 0.75em;
+    color: #333;
+    text-decoration: none;
+    white-space: nowrap;
+    &:focus,
+    &:hover {
+      background: aliceblue;
+    }
+  }
+
+  .search-typeahead & {
+    margin-top: $grw-dropdown-margin-top !important;
+  }
+}
+
+.nav-item-user {
+  .dropdown-toggle {
+    &::after {
+      //caret position
+      margin: 0.75em 0 0 0.75em;
+    }
+  }
+}
+
 /*
  * Modal
  */
@@ -190,8 +224,10 @@ button.btn.btn-link:hover {
   }
 }
 
+/*
 .panel.panel-primary .panel-heading {
 }
+*/
 
 /*
  * Label

src/server/views/layout/layout.html

@@ -80,7 +80,7 @@
 
       <!--1 GROWI logo-->
       <a class="logo d-block top-left-part bg-grw-mos-green my-auto px-3" href="/">
-        <div class="logo-mark _white d-inline-block py-2">{% include '../widget/logo.html' %}</div>
+        <div class="logo-mark _white d-inline-block">{% include '../widget/logo.html' %}</div>
         <span class="logo-text mx-3 text-white">
           {% set appTitle = appService.getAppTitle() %}
           {% set appTitleFontSize = getAppTitleFontSize(appTitle) %}
@@ -101,7 +101,7 @@
       </a>
 
       <!--4 search nav-->
-      <ul class="nav navbar-top-links d-none d-md-block bg-grw-light-green ml-3 my-auto">
+      <ul class="nav navbar-top-links d-none d-md-block bg-grw-light-green ml-3 my-auto text-nowrap">
         {#  disabled temporary -- 2019.05.13 Yuki Takei
         <li class="nav-item-admin">
           <a href="/tags">
@@ -119,7 +119,7 @@
       <!--5 user action-->
       <ul class="nav navbar-top-links flex-nowrap ml-auto my-auto">
         {% if user and user.admin %}
-        <li class="nav-item-admin mr-3">
+        <li class="nav-item-admin mr-2 mr-lg-3 my-auto">
           <a class="text-white" href="/admin">
             <i class="icon-settings mr-2"></i>
             <span class="d-none d-md-inline-block">{{ t('Admin') }}</span>
@@ -128,7 +128,7 @@
         {% endif %}
 
         {% if user %}
-        <li class="nav-item-create-page mr-3">
+        <li class="nav-item-create-page mr-2 mr-lg-3 my-auto">
           <a class="text-white" href="#" data-target="#create-page" data-toggle="modal">
             <i class="icon-pencil mr-2"></i>
             <span class="d-none d-md-inline-block">{{ t('New') }}</span>