Permettre la réduction des colonnes d'un tableau

This commit is contained in:
Benjamin Gaudé 2020-06-05 17:14:55 +02:00
parent 832cca1c66
commit 0e93e7c52f
3 changed files with 38 additions and 7 deletions

View File

@ -185,6 +185,12 @@ export class BoardPage extends React.Component<BoardPageProps> {
<h3 className="level-item is-size-5">
{lane.title}
</h3>
<button className="button is-light level-item is-small expand"
onClick={(e) => { console.log(e.currentTarget.parentNode.parentNode.parentNode.parentNode.parentNode.classList.toggle('minimized'))}}>
<span className="icon">
<i className="fas fa-chevron-right" aria-hidden="true"></i>
</span>
</button>
</div>
<div className="level-right">
<button className="button is-light level-item is-small"
@ -194,7 +200,7 @@ export class BoardPage extends React.Component<BoardPageProps> {
</span>
</button>
<button className="button is-light level-item is-small"
onClick={this.onNewCardClick.bind(this, lane.id)}>
onClick={(e) => { console.log(e.currentTarget.parentNode.parentNode.parentNode.parentNode.parentNode.classList.toggle('minimized'))}}>
<span className="icon">
<i className="fas fa-chevron-left" aria-hidden="true"></i>
</span>

View File

@ -39,14 +39,14 @@ export class IssueCard extends React.PureComponent<IssueCardProps> {
}
</div>
</nav>
<span>{card.issue.title}</span>
<span>{card.issue.title ? card.issue.title : ''}</span>
</div>
{
<nav className="level">
<div className="level-left"></div>
<div className="level-right">
<div className="level-item is-size-7">
{card.issue.milestone.title}
{card.issue.milestone ? card.issue.milestone.title : ''}
</div>
</div>
</nav>

View File

@ -45,9 +45,11 @@
.kanboard-lane {
margin-bottom: $size-small;
background: $white;
position: sticky;
position: -webkit-sticky;
top: 0;
.expand {
display: none;
}
}
}
@ -87,6 +89,7 @@
}
.react-kanban-column {
transition: width ease .2s;
max-width: 305px;
min-width: 305px;
position: relative;
@ -99,8 +102,30 @@
scrollbar-width: 5px;
&.minimized {
max-width: 30px;
min-width: 30px;
max-width: 40px;
min-width: 40px;
writing-mode: vertical-rl;
text-orientation: sideways-right;
.kanboard-lane {
margin-right: -1em;
h3 {
margin-top: .5em;
margin-right: -.5em;
}
.tag {
margin-right: -1em;
}
.expand {
display: block !important;
margin-top: .5em;
}
}
}
&::-webkit-scrollbar {