diff --git a/package.json b/package.json index e8bbee511..6b1315452 100644 --- a/package.json +++ b/package.json @@ -77,7 +77,6 @@ "lodash.merge": "3.3.2", "lodash.omit": "3.1.0", "lodash.range": "3.0.1", - "lodash.truncate": "4.4.2", "minilog": "2.0.8", "node-dir": "0.1.16", "node-sass": "4.6.1", diff --git a/src/components/modal/addtostudio/modal.scss b/src/components/modal/addtostudio/modal.scss index 08b4c1abc..3719b1e57 100644 --- a/src/components/modal/addtostudio/modal.scss +++ b/src/components/modal/addtostudio/modal.scss @@ -112,8 +112,11 @@ */ margin: .575rem 2.18375rem .175rem .6875rem; width: 13.3125rem; - height: 1rem; /* diff from spec, in case we ever do valign to middle */ + height: 1.25rem; /* diff from spec, in case we ever do valign to middle; changed to match line-height because else with overflow hidden it cuts off some letters */ + overflow: hidden; + text-overflow: ellipsis; line-height: 1.25rem; + white-space: nowrap; font-family: "Helvetica Neue"; font-size: .875rem; font-weight: regular; diff --git a/src/components/modal/addtostudio/studio-button.jsx b/src/components/modal/addtostudio/studio-button.jsx index 137c4cc8a..3a19ac5de 100644 --- a/src/components/modal/addtostudio/studio-button.jsx +++ b/src/components/modal/addtostudio/studio-button.jsx @@ -1,4 +1,3 @@ -const truncateAtWordBoundary = require('../../../lib/truncate').truncateAtWordBoundary; const PropTypes = require('prop-types'); const React = require('react'); const classNames = require('classnames'); @@ -44,8 +43,9 @@ const StudioButton = ({ {'studio-selector-button-text-selected': includesProject || hasRequestOutstanding}, {'studio-selector-button-text-unselected': !includesProject && !hasRequestOutstanding} )} + title={title} > - {truncateAtWordBoundary(title, 25)} + {title}