We need to implement a new Topic Card component in our React application to display information about different topics on the site. The Topic Card component should be reusable.
Screenshot
The TopicCard is the section highlighted in red
Tasks:
Create a new file TopicCard.js for the Topic Card component.
Implement the Topic Card component in TopicCard.js. The component should render a card with the topic's title, description, and image and look correct on desktop and mobile
Write tests for the Topic Card component in TopicCard.test.js. The tests should ensure that the component renders the correct information based on the props passed to it.
If no image is available show a placeholder image
For styling use SASS
Acceptance Criteria:
The Topic Card component should be implemented in its own file TopicCard.js.
The Topic Card component should be tested in TopicCard.test.js, and the tests should pass.
The Topic Card component should render a card with the topic's title, description and image and look correct across different screen sizes
The 'Tell me more' button doesn't need to be functional
We need to implement a new Topic Card component in our React application to display information about different topics on the site. The Topic Card component should be reusable.
Screenshot
The TopicCard is the section highlighted in red
Tasks:
Acceptance Criteria: