Compare commits
2 Commits
fbad143bed
...
3eb96fc75e
Author | SHA1 | Date |
---|---|---|
Benjamin Gaudé | 3eb96fc75e | |
Benjamin Gaudé | d6597270dd |
|
@ -195,17 +195,17 @@ export class BoardPage extends React.Component<BoardPageProps> {
|
||||||
<div className="level-item">
|
<div className="level-item">
|
||||||
<span className="tag is-primary is-light is-normal">{lane.cards.length}</span>
|
<span className="tag is-primary is-light is-normal">{lane.cards.length}</span>
|
||||||
</div>
|
</div>
|
||||||
<h3 className="level-item is-size-5">
|
|
||||||
{lane.title}
|
|
||||||
</h3>
|
|
||||||
<button className="button is-light level-item is-small expand"
|
<button className="button is-light level-item is-small expand"
|
||||||
onClick={this.onMinimizeColumn}>
|
onClick={this.onMinimizeColumn}>
|
||||||
<span className="icon">
|
<span className="icon">
|
||||||
<i className="fas fa-chevron-right" aria-hidden="true"></i>
|
<i className="fas fa-chevron-right" aria-hidden="true"></i>
|
||||||
</span>
|
</span>
|
||||||
</button>
|
</button>
|
||||||
|
<h3 className="level-item is-size-5">
|
||||||
|
{lane.title}
|
||||||
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
<div className="level-right">
|
<div className="level-right is-show-expand">
|
||||||
<button className="button is-light level-item is-small"
|
<button className="button is-light level-item is-small"
|
||||||
onClick={this.onNewCardClick.bind(this, lane.id)}>
|
onClick={this.onNewCardClick.bind(this, lane.id)}>
|
||||||
<span className="icon">
|
<span className="icon">
|
||||||
|
@ -228,7 +228,7 @@ export class BoardPage extends React.Component<BoardPageProps> {
|
||||||
e.currentTarget.closest('.react-kanban-column').classList.toggle('minimized');
|
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;
|
const { board } = this.props;
|
||||||
this.props.dispatch(moveCard(
|
this.props.dispatch(moveCard(
|
||||||
board.id,
|
board.id,
|
||||||
|
|
|
@ -101,23 +101,41 @@
|
||||||
scrollbar-color: $grey-lighter, #f1f1f1;
|
scrollbar-color: $grey-lighter, #f1f1f1;
|
||||||
scrollbar-width: 5px;
|
scrollbar-width: 5px;
|
||||||
|
|
||||||
|
.kanboard-card {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
&.minimized {
|
&.minimized {
|
||||||
max-width: 40px;
|
max-width: 70px;
|
||||||
min-width: 40px;
|
min-width: 70px;
|
||||||
|
|
||||||
writing-mode: vertical-rl;
|
writing-mode: vertical-rl;
|
||||||
text-orientation: sideways-right;
|
text-orientation: sideways-right;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.level-item {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-left {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-right.is-show-expand {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.kanboard-lane {
|
.kanboard-lane {
|
||||||
margin-right: -1em;
|
/*margin-right: -1em;*/
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
margin-top: .5em;
|
margin-top: .5em;
|
||||||
margin-right: -.5em;
|
/*margin-right: -.5em;*/
|
||||||
}
|
}
|
||||||
|
|
||||||
.tag {
|
.tag {
|
||||||
margin-right: -1em;
|
writing-mode: horizontal-tb;
|
||||||
}
|
}
|
||||||
|
|
||||||
.expand {
|
.expand {
|
||||||
|
@ -126,8 +144,13 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.kanboard-card {
|
||||||
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
&::-webkit-scrollbar {
|
&::-webkit-scrollbar {
|
||||||
width: 5px;
|
width: 5px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -37,22 +37,22 @@ function handleMoveCard(state: any, action: any) {
|
||||||
|
|
||||||
const kanboard = state.byID[boardID];
|
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 card = fromLane.cards[fromPosition];
|
||||||
|
|
||||||
const fromCards = [ ...fromLane.cards ];
|
const fromCards = [ ...fromLane.cards ];
|
||||||
if (fromLaneID !== toLaneID) {
|
if (fromLaneID !== toLaneID) {
|
||||||
fromCards.splice(fromPosition, 1);
|
fromCards.splice(fromPosition, 1);
|
||||||
lanes[fromLaneID] = {
|
columns[fromLaneID] = {
|
||||||
...fromLane,
|
...fromLane,
|
||||||
cards: fromCards,
|
cards: fromCards,
|
||||||
};
|
};
|
||||||
|
|
||||||
const toCards = [ ...toLane.cards ];
|
const toCards = [ ...toLane.cards ];
|
||||||
toCards.splice(toPosition, 0, card);
|
toCards.splice(toPosition, 0, card);
|
||||||
lanes[toLaneID] = {
|
columns[toLaneID] = {
|
||||||
...toLane,
|
...toLane,
|
||||||
cards: toCards,
|
cards: toCards,
|
||||||
};
|
};
|
||||||
|
@ -67,7 +67,7 @@ function handleMoveCard(state: any, action: any) {
|
||||||
...state.byID,
|
...state.byID,
|
||||||
[boardID]: {
|
[boardID]: {
|
||||||
...state.byID[boardID],
|
...state.byID[boardID],
|
||||||
lanes,
|
columns,
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -22,7 +22,7 @@ export function* moveCardSaga(action: any) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const toLane = kanboard.lanes[toLaneID];
|
const toLane = kanboard.columns[toLaneID];
|
||||||
const card = toLane.cards[toPosition];
|
const card = toLane.cards[toPosition];
|
||||||
|
|
||||||
if (!card) return;
|
if (!card) return;
|
||||||
|
|
Loading…
Reference in New Issue