Bug 1600752 - changes based on feedback - TruncatedText and focus link

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

Hide file tree

Showing 2 changed files with 6 additions and 15 deletions.
diff --git a/ui/css/perf.css b/ui/css/perf.css
@@ -301,21 +301,11 @@ th {
   transition: visibility 150ms ease-in-out;
 }
 
-.compare-table tr .result-links span {
-  color: #333;
-}
-
-.compare-table tr .result-links a,
-.compare-table tr .result-links button {
+.compare-table tr:hover .result-links a,
+.compare-table tr:hover .result-links button,
+.compare-table tr:focus-within .result-links a,
+.compare-table tr:focus-within .result-links button {
   color: #23527c;
-  opacity: 0.5;
-}
-
-.compare-table tr .result-links a:hover,
-.compare-table tr .result-links button:hover,
-.compare-table tr .result-links a:focus,
-.compare-table tr .result-links button:focus {
-  opacity: 1;
 }
 
 .compare-table tr:hover .retrigger-btn {

diff --git a/ui/shared/TruncatedText.jsx b/ui/shared/TruncatedText.jsx
@@ -22,7 +22,8 @@ export default class TruncatedText extends React.Component {
         </p>
         {text.length > maxLength && (
           <Button
-            className={`${showMoreClass} bg-transparent border border-0 mb-0 text-right  pointer`}
+            color="link"
+            className={`${showMoreClass} d-block p-0 ml-auto`}
             onClick={() => this.setState({ showMoreResults: !showMoreResults })}
           >
             {`show ${showMoreResults ? 'less' : 'more'}`}