Compare commits

...

2 Commits

Author SHA1 Message Date
Benjamin Gaudé e3459d136e Ajout mode compacté 2020-06-16 11:23:57 +02:00
Benjamin Gaudé fe0e2667a0 Correction affichage issue ajouter depuis l'UI 2020-06-16 10:54:11 +02:00
4 changed files with 63 additions and 22 deletions

View File

@ -66,7 +66,7 @@ export class BoardPage extends React.Component<BoardPageProps> {
return (
<Fragment>
<nav className="navbar is-info">
<nav className="navbar is-light">
<div className="container is-fluid">
<div className="navbar-start">
<div className="navbar-item">
@ -74,6 +74,19 @@ export class BoardPage extends React.Component<BoardPageProps> {
</div>
</div>
<div className="navbar-end">
<div className="navbar-item">
<div className="field">
<input id="compactMode"
checked={this.state.compactMode}
onChange={this.onCompactModeChange.bind(this)}
type="checkbox"
className="switch is-outlined is-success"
name="compactMode"
/>
<label htmlFor="compactMode">Mode compact</label>
</div>
</div>
<a href={`#/boards/${board.id}/edit`} className="navbar-item">
<span className="icon">
<i className="fa fa-edit fa-fw"></i>
@ -86,13 +99,13 @@ export class BoardPage extends React.Component<BoardPageProps> {
<div className="container is-fluid">
<div className="kanboard-container is-fullheight">
<Board
initialBoard={kanboard}
renderCard={this.renderCard.bind(this)}
renderColumnHeader={this.renderLaneHeader.bind(this)}
onCardDragEnd={this.onCardDragEnd.bind(this)}
disableColumnDrag={true}
/>
>
{kanboard}
</Board>
{ this.renderNewCardModal() }
</div>
</div>

View File

@ -20,18 +20,21 @@ export class IssueCard extends React.PureComponent<IssueCardProps> {
<div className="media">
<div className="media-content">
<div className="content">
{ !compact &&
<nav className="level">
<div className="level-left">
<div className="level-item">
<a target="_blank" href={issueURL}><strong>{`#${card.issue.number}`}</strong></a>
</div>
{ !compact &&
<div className="level-item">
<a target="_blank" href={projectURL}>{card.project}</a>
</div>
}
</div>
<div className="level-right">
{
card.issue.assignee ?
card.issue.assignee && !compact ?
<div className="level-item">
<small>{`@${card.issue.assignee.login}`}</small>
</div>
@ -39,9 +42,13 @@ export class IssueCard extends React.PureComponent<IssueCardProps> {
}
</div>
</nav>
}
{ compact &&
<a target="_blank" className="mr-1" href={issueURL}><strong>{`#${card.issue.number}`}</strong></a>
}
<span>{card.issue.title ? card.issue.title : ''}</span>
</div>
{
{ !compact &&
<nav className="level">
<div className="level-left"></div>
<div className="level-right">

View File

@ -19,3 +19,7 @@ html, body {
display: flex;
flex-direction: column;
}
.mr-1 {
margin-right: 5px;
}

View File

@ -156,3 +156,20 @@
.react-kanban-column {
background: white !important;
}
.kanboard-card {
overflow-wrap: break-word;
a {
display: inline-block;
}
.level {
margin-bottom: 0;
}
.level-item {
max-width: 100%;
}
}