Updated UI for CORE-292

topcoder-platform · Feb 13, 2024 · fdf9859 · fdf9859
1 parent aee9dbc
commit fdf9859
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 8 deletions.
diff --git a/src/shared/components/DateRangePicker/style.scss b/src/shared/components/DateRangePicker/style.scss
@@ -123,7 +123,7 @@
       position: relative;
 
       &::after {
-        content: "\f078";
+        content: "\f08e";
         display: inline-flex;
         align-items: center;
         justify-content: center;

diff --git a/src/shared/components/challenge-detail/Header/index.jsx b/src/shared/components/challenge-detail/Header/index.jsx
@@ -469,13 +469,18 @@ export default function ChallengeHeader(props) {
                 }
               </div>
             ) : (
-              <div styleName="challenge-ops-container">
-                <PrimaryButton
-                  theme={{ button: style.submitButton }}
-                  to={`${topcrowdLink}`}
-                >
-                  Go to Topcrowd
-                </PrimaryButton>
+              <div styleName="topcrowd-container">
+                This challenge is hosted on the <br />
+                new Topcoder Platform
+
+                <div>
+                  <Link
+                    openNewTab
+                    to={`${topcrowdLink}`}
+                  >
+                    Visit Challenge Registration
+                  </Link>
+                </div>
               </div>
             )}
           </div>

diff --git a/src/shared/components/challenge-detail/Header/style.scss b/src/shared/components/challenge-detail/Header/style.scss
@@ -10,6 +10,38 @@
   padding: 0 25px !important;
 }
 
+.topcrowd-container {
+  display: block;
+  margin-top: 32px;
+  margin-right: 50px;
+  margin-left: 50px;
+  font-size: 12px;
+  font-family: 'Roboto', sans-serif;
+  line-height: 1.2em;
+
+  a {
+    color: $tc-dark-blue;
+    display: block;
+    padding-top: 20px;
+
+    &::after {
+      content: "\f08e";
+      display: inline;
+      align-items: center;
+      justify-content: center;
+      right: 6px;
+      top: 46%;
+      height: 34px;
+      font-family: "FontAwesome", serif;
+      font-size: 12px;
+      color: $tc-dark-blue;
+      transform: translateY(-50%);
+      pointer-events: none;
+      margin-left: 5px;
+    }
+  }
+}
+
 .challenge-ops-container .submitButton {
   margin: 5px;
   min-width: 0;