1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 09:23:13 +01:00
This commit is contained in:
diminator 2015-07-02 14:40:04 +02:00
parent 0391b99f1f
commit 3556e8c3c2
2 changed files with 25 additions and 1 deletions

View File

@ -46,7 +46,10 @@ let AccordionListItem = React.createClass({
</div> </div>
</div> </div>
<div className="col-xs-8 col-sm-9 col-md-9 col-lg-9 col-md-offset-1 col-lg-offset-1 accordion-list-item-header"> <div className="col-xs-8 col-sm-9 col-md-9 col-lg-9 col-md-offset-1 col-lg-offset-1 accordion-list-item-header">
<h1 onClick={this.handleClick}>{this.props.content.title}</h1> <OverlayTrigger delay={500} placement="left"
overlay={<Tooltip>{this.props.content.title}</Tooltip>}>
<h1 className="truncate" onClick={this.handleClick}>{this.props.content.title}</h1>
</OverlayTrigger>
<h3>{getLangText('by %s', this.props.content.artist_name)}</h3> <h3>{getLangText('by %s', this.props.content.artist_name)}</h3>
<div> <div>
<span>{this.props.content.date_created.split('-')[0]}</span> <span>{this.props.content.date_created.split('-')[0]}</span>

View File

@ -52,6 +52,27 @@ html {
border-color: #CCC border-color: #CCC
} }
.truncate {
white-space: nowrap;
width: 4em;
overflow: hidden;
text-overflow: ellipsis;
@media only screen and (min-width: 400px) {
width: 8em;
}
@media only screen and (min-width: 600px) {
width: 12em;
}
@media only screen and (min-width: 1000px) {
width: 14em;
}
@media only screen and (min-width: 1200px) {
width: 16em;
}
@media only screen and (min-width: 1400px) {
width: 18em;
}
}
.navbar-right { .navbar-right {
margin-right: 0; margin-right: 0;
} }