Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-31 00:16:47 +01:00
Code Issues Projects Releases Wiki Activity

Fix: Toggle name length has visual issues

Browse Source
This commit is contained in:
ivaosthu 2016-12-17 16:57:27 +01:00
parent 24b0358113
commit d06be100d6
2 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/component/common/common.scss Normal file
View File

@ -0,0 +1,5 @@
.truncate {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

5
frontend/src/component/common/index.js
View File

@ -1,4 +1,7 @@
const React = require('react'); const React = require('react');
import styles from './common.scss';
const { const {
List, ListItem, ListItemContent, List, ListItem, ListItemContent,
Button, Icon, Button, Icon,
@ -57,7 +60,7 @@ export const SwitchWithLabel = ({ onChange, children, checked }) => (
); );
export const TogglesLinkList = ({ toggles }) => ( export const TogglesLinkList = ({ toggles }) => (
<List style={{ textAlign: 'left' }}> <List style={{ textAlign: 'left' }} className={styles.truncate}>
{toggles.length > 0 && toggles.map(({ name, description = '-', icon = 'toggle' }) => ( {toggles.length > 0 && toggles.map(({ name, description = '-', icon = 'toggle' }) => (
<ListItem twoLine key={name}> <ListItem twoLine key={name}>
<ListItemContent avatar={icon} subtitle={description}> <ListItemContent avatar={icon} subtitle={description}>