Bug 1600752 - changes based on feedback: TruncatedText button style

mozilla · Dec 18, 2019 · cba10de · cba10de
1 parent fffb79f
commit cba10de
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/ui/perfherder/alerts/AlertTable.jsx b/ui/perfherder/alerts/AlertTable.jsx
@@ -307,10 +307,10 @@ export default class AlertTable extends React.Component {
                   {alertSummary.notes && (
                     <div className="bg-white px-3 py-4">
                       <TruncatedText
+                        color="info"
                         title="Notes: "
                         maxLength={167}
                         text={alertSummary.notes}
-                        showMoreClass="text-info"
                       />
                     </div>
                   )}

diff --git a/ui/shared/TruncatedText.jsx b/ui/shared/TruncatedText.jsx
@@ -11,7 +11,7 @@ export default class TruncatedText extends React.Component {
   }
 
   render() {
-    const { text, maxLength, title, showMoreClass } = this.props;
+    const { text, maxLength, title, color } = this.props;
     const { showMoreResults } = this.state;
 
     return (
@@ -22,8 +22,10 @@ export default class TruncatedText extends React.Component {
         </p>
         {text.length > maxLength && (
           <Button
-            color="link"
-            className={`${showMoreClass} d-block p-0 ml-auto`}
+            color={color || 'link'}
+            outline={color}
+            className={`${color ||
+              'font-weight-bold text-reset'} d-block ml-auto`}
             onClick={() => this.setState({ showMoreResults: !showMoreResults })}
           >
             {`show ${showMoreResults ? 'less' : 'more'}`}
@@ -38,10 +40,8 @@ TruncatedText.propTypes = {
   text: PropTypes.string.isRequired,
   title: PropTypes.string,
   maxLength: PropTypes.number.isRequired,
-  showMoreClass: PropTypes.string,
 };
 
 TruncatedText.defaultProps = {
-  showMoreClass: 'font-weight-bold',
   title: '',
 };