ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2025-01-03 18:35:09 +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 AclProxy from '../acl_proxy';
import { getLangText } from '../../utils/lang_utils'; import { getLangText } from '../../utils/lang_utils';
import { mergeOptions } from '../../utils/general_utils'; import { mergeOptions, wrapTextAtCharIndex } from '../../utils/general_utils';
let ContractSettings = React.createClass({ let ContractSettings = React.createClass({
@ -109,7 +109,7 @@ let ContractSettings = React.createClass({
<ActionPanel <ActionPanel
key={i} key={i}
title={contract.name} title={contract.name}
content={contract.name} content={wrapTextAtCharIndex(contract.name, 120, '(...).pdf')}
buttons={ buttons={
<div className="pull-right"> <div className="pull-right">
<AclProxy <AclProxy
@ -151,7 +151,7 @@ let ContractSettings = React.createClass({
<ActionPanel <ActionPanel
key={i} key={i}
title={contract.name} title={contract.name}
content={contract.name} content={wrapTextAtCharIndex(contract.name, 120, '(...).pdf')}
buttons={ buttons={
<div className="pull-right"> <div className="pull-right">
<AclProxy <AclProxy
@ -172,8 +172,8 @@ let ContractSettings = React.createClass({
</button> </button>
</div> </div>
} }
leftColumnWidth="40%" leftColumnWidth="60%"
rightColumnWidth="60%"/> rightColumnWidth="40%"/>
); );
})} })}
</div> </div>

17
js/utils/general_utils.js
View File

@ -205,3 +205,20 @@ export function excludePropFromObject(obj, propList){
} }
return clonedObj; 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 { > .ascribe-panel-content {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;
&:first-child {
font-size: .9em;
}
} }
@media(max-width:767px) { @media(max-width:767px) {