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

Implement word wrap for ContractSettings

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-09-25 11:20:12 +02:00
parent a6f09c8f35
commit 9080c84fa9
3 changed files with 26 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
js/components/ascribe_settings/contract_settings.js
View File

@ -23,7 +23,7 @@ import GlobalNotificationActions from '../../actions/global_notification_actions
import AclProxy from '../acl_proxy';
import { getLangText } from '../../utils/lang_utils';
import { mergeOptions } from '../../utils/general_utils';
import { mergeOptions, wrapTextAtCharIndex } from '../../utils/general_utils';
let ContractSettings = React.createClass({
@ -109,7 +109,7 @@ let ContractSettings = React.createClass({
<ActionPanel
key={i}
title={contract.name}
content={contract.name}
content={wrapTextAtCharIndex(contract.name, 120, '(...).pdf')}
buttons={
<div className="pull-right">
<AclProxy
@ -151,7 +151,7 @@ let ContractSettings = React.createClass({
<ActionPanel
key={i}
title={contract.name}
content={contract.name}
content={wrapTextAtCharIndex(contract.name, 120, '(...).pdf')}
buttons={
<div className="pull-right">
<AclProxy
@ -172,8 +172,8 @@ let ContractSettings = React.createClass({
</button>
</div>
}
leftColumnWidth="40%"
rightColumnWidth="60%"/>
leftColumnWidth="60%"
rightColumnWidth="40%"/>
);
})}
</div>

17
js/utils/general_utils.js
View File

@ -205,3 +205,20 @@ export function excludePropFromObject(obj, propList){
}
return clonedObj;
}
/**
* Takes a string and breaks it at the supplied index and replaces it
* with a (potentially) short string that also has been provided
* @param {string} text The string to wrap
* @param {number} charIndex The char number at which the text should be wrapped
* @param {String} replacement All text after charIndex will be replaced with this string
* @return {string} The wrapped text
*/
export function wrapTextAtCharIndex(text, charIndex, replacement = '...') {
let wrappedText = '';
wrappedText = text.slice(0, charIndex);
wrappedText += text.length > charIndex ? replacement : '';
return wrappedText;
}

4
sass/ascribe_panel.scss
View File

@ -24,6 +24,10 @@
> .ascribe-panel-content {
display: table-cell;
vertical-align: middle;
&:first-child {
font-size: .9em;
}
}
@media(max-width:767px) {