From 341c058223ecf00510aeee4f4dcda8136185629f Mon Sep 17 00:00:00 2001
From: Mehak Nasir <67791278+mehaknasir@users.noreply.github.com>
Date: Fri, 15 Jul 2022 15:58:07 +0500
Subject: [PATCH] style: bootstrap tooltip added to fix text visibility issue
 (#30731)

---
 .../sass/discussion/_discussion-v1.scss       | 19 -------------------
 .../_switch_experience_fragment.html          |  4 +---
 2 files changed, 1 insertion(+), 22 deletions(-)

diff --git a/lms/static/sass/discussion/_discussion-v1.scss b/lms/static/sass/discussion/_discussion-v1.scss
index 24f3af44c9..0a6a26d6c1 100644
--- a/lms/static/sass/discussion/_discussion-v1.scss
+++ b/lms/static/sass/discussion/_discussion-v1.scss
@@ -71,25 +71,6 @@
   }
 }
 
-.legacy-tooltip {
-    position: absolute;
-    z-index: 1070;
-    display: none;
-    margin: 0;
-    line-height: 1.55556;
-    font-family: "Inter","Helvetica Neue",Arial,sans-serif;
-    background: white;
-    color: black;
-    padding: 10px;
-    border-radius: 5px;
-    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-    &:hover,
-    &:active,
-    &:focus {
-        display: block;
-    }
-}
-
 // Layout control for discussion modules that does not apply to the discussion board
 .discussion-module {
   .discussion {
diff --git a/lms/templates/discussion/_switch_experience_fragment.html b/lms/templates/discussion/_switch_experience_fragment.html
index 92d0f59a8d..b5acb9e9c8 100644
--- a/lms/templates/discussion/_switch_experience_fragment.html
+++ b/lms/templates/discussion/_switch_experience_fragment.html
@@ -12,9 +12,7 @@ from django.utils.translation import ugettext as _
     <div class="d-flex w-100 small align-items-center">
         ${_("Welcome to the new discussions experience. Please share your feedback.")}
         <a href="${legacy_url}" class="ml-2 text-white">
-            <i class="fa fa-info-circle">
-                <span class="legacy-tooltip">${_("View legacy experience")}</span>
-            </i>
+            <i class="fa fa-info-circle" data-toggle="tooltip" data-placement="bottom" title="${_('View legacy experience')}"> </i>
         </a>
     </div>
     % else: