modify userpage and edit page layout

lib/views/layout-kibela/page_list.html

@@ -10,10 +10,7 @@
 
 
  {% block content_main %}
-<div class="page-content">
-
-
-
+<div class="row page-content">
 
 
   <div class="col-xs-12">
@@ -39,7 +36,7 @@
     </div> {# /.col- #}
 
 
-  <div class="row page-list bg-white round-corner {% if isPortal %}m-t-30{% endif %}">
+  <div class="row page-list bg-white round-corner m-20 {% if isPortal %}m-t-30{% endif %}">
     <div class="col-md-10 col-xs-12">
       {% include '../widget/page_list_and_timeline_kibela.html' %}
     </div>

lib/views/layout-kibela/user_page.html

@@ -17,7 +17,7 @@
 {% block content_main %}
   <div class="row pt-15">
 
-    <div class="col-lg-10 col-md-9">
+    <div class="col-xs-12 bg-white round-corner m-t-20 p-t-10">
 
       {#
         # ensure to insert 'user_page_content' widget to here

lib/views/layout-kibela/widget/header.html

@@ -13,7 +13,7 @@
       {% if page %}
       {% include '../../widget/header-buttons.html' %}
 
-      <ul class="authors hidden-sm hidden-xs text-nowrap p-t-10">
+      <ul class="authors hidden-sm hidden-xs text-nowrap">
         <li>
           <div class="d-flex align-items-center b">
             <a class="m-r-5" href="{{ userPageRoot(page.creator) }}">

lib/views/layout/layout.html

@@ -184,7 +184,7 @@ gh/highlightjs/cdn-release@9.12.0/build/languages/yaml.min.js
         </li>
         <li class="dropdown">
           <a class="dropdown-toggle waves-effect waves-light" data-toggle="dropdown">
-            <img src="{{ user|picture }}" class="picture img-circle" width="25" /> {{ user.name }}
+            <img src="{{ user|picture }}" class="picture img-circle" width="25" /> <span class="user-name">{{ user.name }}</span>
           </a>
           <ul class="dropdown-menu dropdown-menu-right">
             <li><a href="/user/{{ user.username }}"><i class="icon-fw icon-home"></i>{{ t('Home') }}</a></li>

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

@@ -665,10 +665,11 @@ Basic List
 }
 
 /*custom tab*/
-
+/*
 .tab-content{
   margin-top:30px;
 }
+*/
 .customtab{
   border-bottom:2px solid $extralight;
 }
@@ -686,7 +687,7 @@ Basic List
 
 
 /*custom tab2*/
-
+/*
 .customtab2{
   border-bottom:1px solid $extralight;
   border-top:1px solid $extralight;
@@ -702,10 +703,10 @@ Basic List
   border:0px;
 
 }
-
+*/
 
 /*Vertical tabs*/
-
+/*
 .vtabs{
     display:table;
     .tabs-vertical{
@@ -732,10 +733,10 @@ Basic List
   margin-right:-1px;
   color:$white;
 }
-
+*/
 
 /*Custom vertical tab*/
-
+/*
 .customvtab .tabs-vertical li.active a, .customvtab .tabs-vertical li.active a:hover,  .customvtab .tabs-vertical li.active a:focus{
   background:$white;
   border:0px;
@@ -743,7 +744,7 @@ Basic List
   margin-right:-1px;
   color:$dark;
 }
-
+*/
 
 /*Nav pills*/
 .nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover{
@@ -756,7 +757,7 @@ Basic List
 }
 
 /*Accordion*/
-
+/*
 .panel-group {
   .panel {
     .panel-heading {
@@ -805,7 +806,7 @@ Basic List
     padding: 12px 20px;
   }
 }
-
+*/
 
 /*Progressbars*/
 /*

resource/styles/scss/_layout_kibela.scss

@@ -63,8 +63,8 @@
       a {
         color: #3c4a60;
          .user-name {
-          display: none;
-        }
+          margin-right: 0.5em;
+          margin-left: 0.5em;        }
       }
       .img-circle {
         width: 36px;
@@ -101,11 +101,10 @@
     bottom: 0px;
     left: 0px;
     margin: auto;
+    height: 10em;
   }
   .bg-title {
     position: relative;
-    margin: none !important;
-    padding: none !important;
     background: transparent;
     border: none;
     svg {
@@ -214,6 +213,8 @@
       // コメントセクション
       .page-comment-main {
         @extend %comment-section;
+        background: #D8E2EB;
+        border-radius: 0.3em;
       }
 
       // コメント本文
@@ -264,9 +265,7 @@
       .comment-write {
         margin-bottom: 0.5em;
       }
-      .tab-content{
-        padding-top: 10px;
-      }
+
       .comment-form-comment {
         height: 80px;
         &:focus, &:not(:invalid) {
@@ -283,42 +282,55 @@
 /*
  * Tabs
  */
- .nav.nav-tabs {
-    border-bottom-color: #F4F5F6;
-  > li > a {
-    &, &:hover, &:focus {
-      background: transparent;
+  .nav.nav-tabs {
+      border-bottom-color: #F4F5F6;
+    > li > a {
+      &, &:hover, &:focus {
+        background: transparent;
+        border-top: none;
+        border-left: none;
+        border-right: none;
+      }
+    }
+    > li.active > a {
+      background: transparent !important;
+      border-bottom: solid 2.7px #5584E1;
       border-top: none;
       border-left: none;
       border-right: none;
     }
-  }
-  > li.active > a {
-    background: transparent !important;
-    border-bottom: solid 2.7px #5584E1;
-    border-top: none;
-    border-left: none;
-    border-right: none;
-  }
 
-  .wiki {
-    h1 {
-      border-bottom: solid 2px #5584E1 !important;
-    }
-    h2 {
-      border-color: solid 1px #5584E1;
+
+
+    .wiki {
+      h1 {
+        border-bottom: solid 2px #5584E1 !important;
+      }
+      h2 {
+        border-color: solid 1px #5584E1;
+      }
     }
+
   }
 
 
-body.on-edit {
-  padding: 100px;
+/* edit */
+.CodeMirror {
+  border: solid 2px lightgray;
 }
+  .tab-content {
+    padding: 1em;
+  }
+  .tab-pane {
 
+    .page-editor-editor-container {
+      padding: 0px;
+    }
+
+  }
 
 
 
-}