mirror of
https://github.com/silverstripe/silverstripe-framework
synced 2024-10-22 14:05:37 +02:00
Use bootstrap mixing text-truncate instead of custom styles
This commit is contained in:
parent
02bb158a27
commit
9b5430a80c
@ -24,7 +24,7 @@ class BreadcrumbComponent extends SilverStripeComponent {
|
||||
]),
|
||||
this.props.crumbs.slice(-1).map((crumb, index) => [
|
||||
<li className="breadcrumb__item breadcrumb__item--last">
|
||||
<h2 className="breadcrumb__item-title breadcrumb__item-title--last text-truncate" key={index}>
|
||||
<h2 className="breadcrumb__item-title breadcrumb__item-title--last" key={index}>
|
||||
{crumb.text}
|
||||
</h2>
|
||||
</li>,
|
||||
|
@ -25,4 +25,5 @@
|
||||
font-size: $font-size-lg;
|
||||
font-weight: normal;
|
||||
line-height: 24px;
|
||||
@include text-truncate;
|
||||
}
|
||||
|
@ -58,16 +58,3 @@
|
||||
font-family: 'Bitstream Vera Sans Mono','Courier', monospace;
|
||||
}
|
||||
}
|
||||
|
||||
// Used for long sentences where you would like to truncate them with an ellipsis (requires a set width)
|
||||
.truncate {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
// Used for breaking text so it doesn't run horizontally, useful for breaking URLs
|
||||
.break-string {
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user