Merge pull request #4140 from ilonagog/WV-594-TEAM-REVIEW

WV-594 and WV-518 [TEAM REVIEW]
wevote · Oct 24, 2024 · 2b2269a · 2b2269a
2 parents c8362e4 + 8fed685
commit 2b2269a
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 13 deletions.
diff --git a/src/js/common/components/Challenge/JoinChallengeAndLearnMoreButtons.jsx b/src/js/common/components/Challenge/JoinChallengeAndLearnMoreButtons.jsx
@@ -5,20 +5,22 @@ import styled from 'styled-components';
 import PropTypes from 'prop-types';
 import JoinChallengeButton from './JoinChallengeButton'
 
-const JoinChallengeAndLearnMoreButtons = ({ classes }) => {
+const JoinChallengeAndLearnMoreButtons = ({ challengeWeVoteId, classes }) => {
   return (
     <JoinChallengeButtonWrapper>
       <Button
         classes={{ root: classes.joinChallengeButton }}
         color="primary"
+        id={`challengeLearnMore-${challengeWeVoteId}`}
         variant="contained"
       >
        Join Challenge
       </Button>
       <Button
         classes={{ root: classes.learnMoreButton }}
         color="secondary"
-        variant="contained"
+        id={`challengeLearnMore-${challengeWeVoteId}`}
+        variant="outlined"
       >
         Learn More
       </Button>
@@ -30,23 +32,23 @@ const styles = () => ({
   joinChallengeButton: {
     borderRadius: 45,
     maxWidth: 300,
-    background: 'var(--Primary-600, #0858A1)',
-    border: '1px solid var(--Primary-400, #4187C6)',
-    color: 'var(--WhiteUI, #FFFFFF)',
+//     background: 'var(--Primary-600, #0858A1)',
+//     border: '1px solid var(--Primary-400, #4187C6)',
+//     color: 'var(--WhiteUI, #FFFFFF)',
     marginRight: '10px',
     marginTop: '10px',
   },
   learnMoreButton:{
     borderRadius: 45,
     maxWidth: 300,
-    background: 'white',
-    border: '1px solid var(--Primary-400, #4187C6)',
-    color: 'var(--Neutral-900, #2A2A2C)',
+//     background: 'white',
+//     border: '1px solid var(--Primary-400, #4187C6)',
+//     color: 'var(--Neutral-900, #2A2A2C)',
     marginTop: '10px',
-    '&:hover': {
-      backgroundColor: 'white',
-      color: 'var(--Neutral-900, #2A2A2C)',
-    },
+//     '&:hover': {
+//       backgroundColor: 'white',
+//       color: 'var(--Neutral-900, #2A2A2C)',
+//     },
   },
 });
 
@@ -57,6 +59,7 @@ const JoinChallengeButtonWrapper = styled('div')`
 `;
 
 JoinChallengeAndLearnMoreButtons.propTypes = {
+  challengeWeVoteId: PropTypes.string,
   classes: PropTypes.object.isRequired,
 };
 

diff --git a/src/js/common/components/Challenge/YourRank.jsx b/src/js/common/components/Challenge/YourRank.jsx
@@ -98,7 +98,7 @@ const YourRank = ({ classes, challengeWeVoteId }) => {
             classes={{ root: classes.buttonDesktop }}
             style={{
               backgroundColor: clicked ? '#AC5204' : 'white',
-              color: clicked ? '#FFFFFF' : '#AC5204' }}
+              color: clicked ? '#FFFFFF' : '#AC5204'}}
           >
             #
             {rankOfVoter}