WIP: apply bootstrap theme

* header and crowi-sidebar

lib/views/crowi-plus/widget/header.html

@@ -28,25 +28,25 @@
 
       <ul class="authors visible-md visible-lg">
         <li>
-          <div class="creator-picture">
-            <a href="{{ userPageRoot(page.creator) }}">
-              <img src="{{ page.creator|default(author)|picture }}" class="picture img-circle"><br>
+          <div class="d-flex align-items-center">
+            <a class="m-r-10" href="{{ userPageRoot(page.creator) }}">
+              <img src="{{ page.creator|default(author)|picture }}" class="picture img-circle">
             </a>
-          </div>
-          <div class="">
-            <div>Created by <a href="{{ userPageRoot(page.creator) }}">{{ page.creator.name|default(author.name) }}</a></div>
-            <div class="text-muted">{{ page.createdAt|datetz('Y/m/d H:i:s') }}</div>
+            <div>
+              <div>Created by <a href="{{ userPageRoot(page.creator) }}">{{ page.creator.name|default(author.name) }}</a></div>
+              <div class="text-muted">{{ page.createdAt|datetz('Y/m/d H:i:s') }}</div>
+            </div>
           </div>
         </li>
         <li class="m-t-5">
-          <div class="creator-picture">
-            <a href="{{ userPageRoot(page.lastUpdateUser) }}">
-              <img src="{{ page.lastUpdateUser|default(author)|picture }}" class="picture img-circle"><br>
+          <div class="d-flex align-items-center">
+            <a class="m-r-10" href="{{ userPageRoot(page.lastUpdateUser) }}">
+              <img src="{{ page.lastUpdateUser|default(author)|picture }}" class="picture img-circle">
             </a>
-          </div>
-          <div class="">
-            <div>Updated by <a href="{{ userPageRoot(page.lastUpdateUser) }}">{{ page.lastUpdateUser.name|default(author.name) }}</a></div>
-            <div class="text-muted">{{ page.updatedAt|datetz('Y/m/d H:i:s') }}</div>
+            <div>
+              <div>Updated by <a href="{{ userPageRoot(page.lastUpdateUser) }}">{{ page.lastUpdateUser.name|default(author.name) }}</a></div>
+              <div class="text-muted">{{ page.updatedAt|datetz('Y/m/d H:i:s') }}</div>
+            </div>
           </div>
         </li>
       </ul>

resource/styles/agile-admin/inverse/eliteadmin.scss

@@ -852,7 +852,7 @@ label{
 .bg-title{
   background: #fafafa;
   overflow:hidden;
-  padding: 4px 8px 4px;
+  padding: 6px 15px;
   margin-left:-25.5px;
   margin-right:-25.5px;
 

resource/styles/scss/_page.scss

@@ -89,7 +89,7 @@
       width: 100%;
       top: 0;
       left: 0;
-      padding: 5px 20px;
+      padding: 2px 20px;
       z-index: 15; // over the .sidebar
       background: rgba(white, .9);
       box-shadow: 0 0px 2px #999;

resource/styles/scss/_page_crowi-plus.scss

@@ -32,13 +32,13 @@
       margin: 0;
 
       li {
-        display: flex;
         list-style: none;
         font-size: 12px;
+      }
 
-        .creator-picture {
-          margin-right: 10px;
-        }
+      .picture {
+        width: 20px;
+        height: 20px;
       }
     }
 

resource/styles/scss/crowi-sidebar.scss

@@ -18,9 +18,13 @@
     padding: 15px 15px 5px 15px;
     color: #666;
     font-size: .9em;
-    line-height: 1.4em;
     border-bottom: solid 1px #ccc;
 
+    line-height: 1.4em;
+    p {
+      line-height: 1.4em;
+    }
+
     .creator-picture {
       text-align: center;
       img {