Amelioration affichage colonnes fermees

client/src/components/BoardPage/BoardPage.tsx

@@ -195,17 +195,17 @@ export class BoardPage extends React.Component<BoardPageProps> {
             <div className="level-item">
               <span className="tag is-primary is-light is-normal">{lane.cards.length}</span>
             </div>
-            <h3 className="level-item is-size-5">
-              {lane.title}
-            </h3>
             <button className="button is-light level-item is-small expand"
               onClick={this.onMinimizeColumn}>
               <span className="icon">
                 <i className="fas fa-chevron-right" aria-hidden="true"></i>
               </span>
             </button>
+            <h3 className="level-item is-size-5">
+              {lane.title}
+            </h3>
           </div>
-          <div className="level-right">
+          <div className="level-right is-show-expand">
             <button className="button is-light level-item is-small"
               onClick={this.onNewCardClick.bind(this, lane.id)}>
               <span className="icon">
@@ -228,7 +228,7 @@ export class BoardPage extends React.Component<BoardPageProps> {
     e.currentTarget.closest('.react-kanban-column').classList.toggle('minimized');
   }
 
-  onCardDragEnd(b: any, card: any, source: any, dest: any) {
+  onCardDragEnd(card: any, source: any, dest: any) {
     const { board } = this.props;
     this.props.dispatch(moveCard(
       board.id,

client/src/sass/_kanboard.scss

@@ -101,23 +101,41 @@
     scrollbar-color: $grey-lighter, #f1f1f1;
     scrollbar-width: 5px;
 
+    .kanboard-card {
+        display: block;
+    }
+
     &.minimized {
-        max-width: 40px;
+        max-width: 70px;
-        min-width: 40px;
+        min-width: 70px;
         
         writing-mode: vertical-rl;
         text-orientation: sideways-right;
 
+        
+
+        .level-item {
+            margin-right: 0;
+        }
+
+        .level-left {
+            margin-right: 0;
+        }
+
+        .level-right.is-show-expand {
+            display: none;
+        }
+
         .kanboard-lane {
-            margin-right: -1em;
+            /*margin-right: -1em;*/
 
             h3 {
                 margin-top: .5em;
-                margin-right: -.5em;
+                /*margin-right: -.5em;*/
             }
 
             .tag {
-                margin-right: -1em;
+                writing-mode: horizontal-tb;
             }
 
             .expand {
@@ -126,8 +144,13 @@
             }
         }
 
+        .kanboard-card {
+            display: none;
+        }
+        
     }
     
+
     &::-webkit-scrollbar {
         width: 5px;
     }

client/src/store/reducers/kanboards.ts

@@ -37,22 +37,22 @@ function handleMoveCard(state: any, action: any) {
 
   const kanboard = state.byID[boardID];
 
-  const lanes = [ ...kanboard.columns ];
+  const columns = [ ...kanboard.columns ];
-  const fromLane = lanes[fromLaneID];
+  const fromLane = columns[fromLaneID];
-  const toLane = lanes[toLaneID];
+  const toLane = columns[toLaneID];
   const card = fromLane.cards[fromPosition];
 
   const fromCards = [ ...fromLane.cards ];
   if (fromLaneID !== toLaneID) {
     fromCards.splice(fromPosition, 1);
-    lanes[fromLaneID] = {
+    columns[fromLaneID] = {
       ...fromLane,
       cards: fromCards,
     };
   
     const toCards = [ ...toLane.cards ];
     toCards.splice(toPosition, 0, card);
-    lanes[toLaneID] = {
+    columns[toLaneID] = {
       ...toLane,
       cards: toCards,
     };
@@ -67,7 +67,7 @@ function handleMoveCard(state: any, action: any) {
       ...state.byID,
       [boardID]: {
         ...state.byID[boardID],
-        lanes,
+        columns,
       },
     }
   };

client/src/store/sagas/kanboards.ts

@@ -22,7 +22,7 @@ export function* moveCardSaga(action: any) {
     }
   });
 
-  const toLane = kanboard.lanes[toLaneID];
+  const toLane = kanboard.columns[toLaneID];
   const card = toLane.cards[toPosition];
 
   if (!card) return;