Merge pull request #3110 from Suvid-Singhal/ui-improvement-tooltip

UI Improvement: Improved tooltip styling in settings page
metabrainz · Jan 4, 2025 · 69e1e79 · 69e1e79
2 parents 8d5754a + d1f4cb6
commit 69e1e79
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 7 deletions.
diff --git a/frontend/css/listens-page.less b/frontend/css/listens-page.less
@@ -586,3 +586,8 @@
   color: unset !important;
   text-decoration: unset !important;
 }
+
+.link-listens-tooltip {
+  border-bottom: 1px dotted #000;
+  text-decoration: none;
+}
diff --git a/frontend/js/src/settings/link-listens/LinkListens.tsx b/frontend/js/src/settings/link-listens/LinkListens.tsx
@@ -249,15 +249,16 @@ export default function LinkListensPage() {
         first.
       </ReactTooltip>
       <p>
-        You will find below your top 1000 listens (grouped by album) that have
-        not been automatically linked
-        <FontAwesomeIcon
-          icon={faQuestionCircle}
-          size="sm"
+        You will find below your top 1000 listens (grouped by album) that
+        have&nbsp;
+        <u
+          className="link-listens-tooltip"
           data-tip
           data-for="matching-tooltip"
-        />{" "}
-        to a MusicBrainz recording. Link them below or&nbsp;
+        >
+          not been automatically linked
+        </u>
+        &nbsp; to a MusicBrainz recording. Link them below or&nbsp;
         <a href="https://wiki.musicbrainz.org/How_to_Contribute">
           submit new data to MusicBrainz
         </a>