Merge branch 'master' of github.com:tracim/tracim_front

package.json

@@ -8,6 +8,7 @@
     "servdev": "NODE_ENV=development webpack-dev-server --watch --colors --inline --hot --progress",
     "servdevwindoz": "webpack-dev-server --watch --colors --inline --hot --progress",
     "servdev-dashboard": "NODE_ENV=development webpack-dashboard -m -- webpack-dev-server --watch --colors --inline --hot --progress",
+    "buildwindoz": "set NODE_ENV=production&& webpack -p",
     "build": "NODE_ENV=production webpack -p",
     "test": "echo \"Error: no test specified\" && exit 1"
   },

src/component/Account/MenuSubComponent.jsx

@@ -8,7 +8,7 @@ export const Navbar = props => {
       <div className='account__userpreference__menu__responsive d-lg-none'>
         <button className='hamburger hamburger--spring account__userpreference__menu__responsive__hamburger' type='button'>
           <span className='hamburger-box account__userpreference__menu__responsive__hamburger__box'>
-            <span className='hamburger-inner account__userpreference__menu__responsive__hamburger__box__icon'></span>
+            <span className='hamburger-inner account__userpreference__menu__responsive__hamburger__box__icon' />
           </span>
         </button>
       </div>

src/component/Account/PersonalData.jsx

@@ -25,9 +25,9 @@ export const PersonalData = props => {
         </div>
         <input className='personaldata__form__txtinput form-control' type='email' placeholder='Ancienne adresse mail' />
         <input className='personaldata__form__txtinput form-control' type='email' placeholder='Nouvelle adresse mail' />
-        <div className='personaldata__form__button btn btn-primary'>
-          Envoyer
-        </div>
+      </div>
+      <div className='personaldata__form__button btn btn-primary'>
+        Envoyer
       </div>
     </div>
   )

src/container/Dashboard.jsx

@@ -1,6 +1,5 @@
 import React, { Component } from 'react'
 import Sidebar from './Sidebar.jsx'
-import listMemberBtn from '../img/listmemberbtn.png'
 import imgProfil from '../img/imgProfil.png'
 
 class Dashboard extends Component {

src/container/Sidebar.jsx

@@ -65,7 +65,12 @@ class Sidebar extends React.Component {
     return (
       <div className={classnames('sidebar d-none d-lg-block', {'sidebarclose': sidebarClose})}>
         <div className='sidebar__expand' onClick={this.handleClickToggleSidebar}>
-          <i className={classnames('fa fa-fw', {'fa-plus-square-o': sidebarClose, 'fa-minus-square-o': !sidebarClose})} />
+          { /* <i className={classnames('fa fa-fw', {'fa-plus-square-o': sidebarClose, 'fa-minus-square-o': !sidebarClose})} /> */ }
+          <button className='hamburger hamburger--spring sidebar__expand__btnHamburger' type='button'>
+            <span className='hamburger-box sidebar__expand__btnHamburger__box'>
+              <span className='hamburger-inner sidebar__expand__btnHamburger__box__icon' />
+            </span>
+          </button>
         </div>
 
         <nav className='sidebar__navigation'>

src/css/AccountPage.styl

@@ -166,11 +166,11 @@ settingText()
         min-height 60px
         &__responsive
           &__hamburger
-            margin 18px 0 0 10px
             padding 0
+            &:focus
+              outline none
             &__box
-              &:focus
-                outline none
+              margin-top 15px
               &__icon, &__icon::before, &__icon::after
                 width 30px
         &__list

src/css/Sidebar.styl

@@ -14,6 +14,19 @@
     &:hover
       color white
 
+/**** MENU HAMBURGER ON EXPAND BAR *****/
+
+.hamburger--spring .hamburger-inner
+  margin 2px 6px
+
+.hamburger--spring .hamburger-inner::before
+  top 8px
+
+.hamburger--spring .hamburger-inner::after
+  top 16px
+
+ /***************************************/
+
 .sidebar
   min-height 100%
   background-color secondColor
@@ -34,19 +47,42 @@ leftside()
   width sidebar-width
   &.sidebarclose
     width 0
-    .sidebar__expand
-      border-bottom-right-radius 0
+    .hamburger--spring
+      .hamburger-inner
+        transition-delay 0.22s
+        background-color transparent
+        &::before
+            top 0
+            transition top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1)
+            transform translate3d(0, 10px, 0) rotate(45deg)
+        &::after
+            top 0
+            transition top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1)
+            transform translate3d(0, 10px, 0) rotate(-45deg)
   &__expand
     position absolute
-    top 1px
-    right -44px
-    padding 5px 8px
-    border 3px solid transparent
+    top 0
+    right -49px
+    padding 4px
+    border-left 1px solid off-white
     border-bottom-right-radius 15px
     cursor pointer
     background-color blue
     color white
     transition all sidebar-animate-speed
+    &__btnHamburger
+      padding 0
+      &:focus
+        outline none
+      &__box
+        &__icon, &__icon::before, &__icon::after
+          width 25px
+          height 3px
+          background-color off-white
+        &__icon::before
+          top 8px
+        &__icon::after
+          top 16px
   &__btnnewworkspace
     margin 50px 0
     overflow hidden