ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 09:23:13 +01:00
Code Issues Releases Wiki Activity

ellipsis

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
js/components/ascribe_accordion_list/accordion_list_item.js
View File

@ -46,7 +46,10 @@ let AccordionListItem = React.createClass({
</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">
<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>
<div>
<span>{this.props.content.date_created.split('-')[0]}</span>

21
sass/main.scss
View File

@ -52,6 +52,27 @@ html {
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 {
margin-right: 0;
}