Better card informations display

This commit is contained in:
wpetit 2019-12-05 17:09:11 +01:00
parent b9ebf29711
commit d510116c4b
5 changed files with 37 additions and 10 deletions

View File

@ -43,9 +43,34 @@ export class BoardPage extends React.Component {
<div className="kanboard-card">
<div className="box">
<div className="media">
{
card.issue.assignee ?
<div class="media-left">
<figure class="image is-64x64">
<img src={card.issue.assignee.avatar_url} alt="Image" />
<small>{`@${card.issue.assignee.login}`}</small>
</figure>
</div>
: null
}
<div className="media-content">
<div className="content">
<h5 className="is-size-5 is-marginless">{card.title}</h5>
<p>
<strong>{`#${card.issue.number}`}</strong>&nbsp;
{ card.issue.milestone ? <small>{`- ${card.issue.milestone.title}`}</small> : null }
<br />
<span className="is-size-6">{card.issue.title}</span>
</p>
<div className="level is-mobile">
<div className="level-left"></div>
<div className="level-right">
<a className="level-item" target="_blank" href={card.issue.url.replace('/api/v1/repos', '')}>
<span className="icon is-small has-text-info">
<i className="fas fa-search" aria-hidden="true"></i>
</span>
</a>
</div>
</div>
</div>
</div>
</div>

View File

@ -8,9 +8,13 @@ export class BoardCard extends React.PureComponent {
<div className="media">
<div className="media-content">
<div className="content">
<a href={`#/boards/${board.id}`}>
<h3 className="is-size-3">{board.title}</h3>
</a>
<p>
<a href={`#/boards/${board.id}`}>
<strong className="is-size-4">{board.title}</strong>
</a>
<br />
{board.description}
</p>
</div>
</div>
</div>

View File

@ -3,7 +3,7 @@ import React from 'react';
export class Navbar extends React.Component {
render() {
return (
<nav className="navbar" role="navigation" aria-label="main navigation">
<nav className="navbar" role="navigation" aria-label="main navigation" style={{marginBottom: '1.5rem'}}>
<div className="container is-fluid">
<div className="navbar-brand">
<a className="navbar-item" href="#/">

View File

@ -1,5 +1,6 @@
html, body {
height: 100%;
background-color: #f7f7f7;
}
.is-fullheight {

View File

@ -64,12 +64,9 @@ function createCards(projects, issues, lane) {
if (hasLabel) {
projectCards.push({
id: issue.id,
title: `#${issue.number} - ${issue.title}`,
description: "",
title: issue.title,
project: p,
labels: issue.labels,
assignee: issue.assignee,
number: issue.number
issue: issue,
});
}