resolved the hover effect

Signed-off-by: Vamshi Reddy <[email protected]>
layer5io · Sep 22, 2023 · 9fe9221 · 9fe9221
1 parent e52bf97
commit 9fe9221
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/src/components/ScenarioCard/ScenarioCard.style.js b/src/components/ScenarioCard/ScenarioCard.style.js
@@ -74,12 +74,19 @@ export const ScenarioCardWrapper = styled.div`
 	}
 
     .sub-content {
-        display:flex; 
+        display:flex;
+        color: white;
+        .ak {
+            color: ${props => props.theme.linkColor};
+            &:hover {
+                color: white;
+            }
+        } 
         justify-content:center; 
         margin-top:4rem;
         width:100%;
-        color: white;
     }
+    
 
 	.active {
 		display: blwock;

diff --git a/src/components/ScenarioCard/index.js b/src/components/ScenarioCard/index.js
@@ -59,7 +59,7 @@ const Card = ({ title, info, courseLink, link, cover, content, embed, subId, ID,
 
             <div className={content && subId === ID ? "active" : "text-contents"}>
               <div className="sub-content">
-              Sign into the&nbsp;<a href="https://playground.meshery.io">Meshery Playground</a>&nbsp;(free account) to continue your lab.
+              Sign into the&nbsp;<a className="ak" href="https://playground.meshery.io">Meshery Playground</a>&nbsp;(free account) to continue your lab.
                 {/*
                 <div id="katacoda-scenario"
                   data-katacoda-id={`${courseLink}/${embed}`}