Merge pull request #5240 from layer5io/leecalcote/home/topbanner

[Home] Change blog link
layer5io · Dec 27, 2023 · 1828b75 · 1828b75
2 parents a8e36f8 + 4a936bd
commit 1828b75
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/src/components/TopPromotionalBanner/index.js b/src/components/TopPromotionalBanner/index.js
@@ -6,7 +6,8 @@ const TopPromotionalBanner = () => {
   return (
     <>
       <TopBannercontainer>
-        <a href="https://meshery.io/blog/meshery-v07-release-announcement" rel="noreferrer" target="_blank"><p className="content"><img src={Rocket} alt="Five on rocket" />Soar to New Heights with Meshery v0.7.0 <a href="https://play.meshery.io/" rel="noreferrer" target="_blank">Try it now &rarr;</a></p></a>
+        <a href="https://meshery.io/blog/meshery-v07-release-announcement" rel="noreferrer" target="_blank"><p className="content"><img src={Rocket} alt="Five on rocket" /><span>Soar to New Heights with Meshery v0.7.0 &rarr;</span>{/* <span>Try it now &rarr;</span> */}
+        </p></a>
       </TopBannercontainer>
     </>
   );

diff --git a/src/components/TopPromotionalBanner/style.js b/src/components/TopPromotionalBanner/style.js
@@ -3,23 +3,29 @@ import styled from "styled-components";
 export const TopBannercontainer = styled.div`
     background: ${props => props.theme.saffronColor};
     position: sticky;
+    a {
+        color: #000 !important,
+    }
     .content {
         display: flex;
         align-items: center;
         justify-content: center;
         padding: 0 1rem;
         font-weight: 500;
         line-height: 1.1875rem;
-        color: ${props => props.theme.body};
+        color: #000 !important;
+        /* color: ${props => props.theme.body}; */
         padding: 0.75rem 1rem;
-
+        &:hover {
+            text-decoration: underline;
+        }
        & > img {
         width: 3rem;
         margin-right: 0.5rem;
        }
 
-       & > a {
-        font-weight: 700;
+       & > span {
+        font-weight: normal;
         margin-left: 0.5rem;
         color: ${props => props.theme.body};
         &:hover {