Commit dcccc194 authored by Alejandro De Maria Antolinos's avatar Alejandro De Maria Antolinos

Merge branch 'issue37' into 'master'

display beginning of the content in collapsed view. It fixes #37.

Closes #37

See merge request !28
parents f219c609 05928394
...@@ -104,18 +104,36 @@ class EventHeader extends React.Component { ...@@ -104,18 +104,36 @@ class EventHeader extends React.Component {
) )
} else if (this.props.mode === 'collapsed') { } else if (this.props.mode === 'collapsed') {
let numberOFCharactertoDisplay = 100;
let firstLettersOfContent;
if (this.props.event.content[0].text) {
let AllLettersOfContent = this.props.event.content[0].text
if (AllLettersOfContent.length > 100) {
firstLettersOfContent = AllLettersOfContent.slice(0, 100) + " ..."
} else {
firstLettersOfContent = AllLettersOfContent.slice(0, 100)
}
}
return ( return (
<Panel.Heading bsClass='collapsedEventPanel'> <Panel.Heading bsClass='collapsedEventPanel'>
<Row > <Row >
<Col xs={1}> <Col xs={1}>
{getEventCreationDate(originalEvent)} <div style={{ position: 'absolute', right: '30px' }} > {getEventCreationDate(originalEvent)} </div>
</Col> </Col>
<Col xs={1}> <Col xs={1}>
{eventCategoryIcon(originalEvent.category)} {eventCategoryIcon(originalEvent.category)}
</Col> </Col>
<Col xs={8}> <Col xs={2}>
<span style={{ cursor: 'pointer', color: '#007bff' }} onClick={() => { this.props.toggleMode(EXPANDED_VIEW_MODE) }}> {event.title || "User comment"} </span> <span style={{ cursor: 'pointer', color: '#007bff' }} onClick={() => { this.props.toggleMode(EXPANDED_VIEW_MODE) }}> {event.title || "User comment"} </span>
</Col> </Col>
<Col xs={6}>
<div style={{
background: 'linear-gradient(to right, #999999, #ffffff)', webkitBackgroundClip: 'text', webkitTextFillColor: 'transparent'
}}>
{firstLettersOfContent}
</div>
</Col>
<Col xs={2}> <Col xs={2}>
{this.props.event.tag[0]} {this.props.event.tag[0]}
</Col> </Col>
......
...@@ -150,7 +150,7 @@ const TimeAxisMarks = (props) => ( ...@@ -150,7 +150,7 @@ const TimeAxisMarks = (props) => (
<Col xs={1}> </Col> <Col xs={1}> </Col>
<Col xs={11}> <Col xs={11}>
<OverlayTrigger placement="right" overlay={<Tooltip id="tooltip"> <p> Events created on {props.value} </p> </Tooltip>}> <OverlayTrigger placement="right" overlay={<Tooltip id="tooltip"> <p> Events created on {props.value} </p> </Tooltip>}>
<span style={{ color: '#777777', marginLeft: '-30px', fontStyle: 'italic' }}> {Moment(props.value).format("MMM D")} </span> <span style={{ color: '#777777', marginLeft: '-100px', fontStyle: 'italic' }}> {Moment(props.value).format("MMM D")} </span>
</OverlayTrigger> </OverlayTrigger>
</Col> </Col>
</Row> </Row>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment