Bw/design fixes2 (#28)

This commit is contained in:
Ben Warzeski
2022-09-28 15:47:51 -04:00
committed by GitHub
parent 9aa7d665c2
commit b570a9228f
30 changed files with 419 additions and 255 deletions

View File

@@ -21,14 +21,20 @@ exports[`SuggestedCourses snapshot has 3 suggested courses 1`] = `
srcAlt="Course image banner"
/>
<Card.Header
className="mb-2"
title="Suggested course 1"
/>
<Card.Body
className="h-100"
/>
<Card.Footer>
<Button
as="a"
>
View Course
</Button>
<ActionRow>
<Button
as="a"
>
View Course
</Button>
</ActionRow>
</Card.Footer>
</Card>
<Card
@@ -40,14 +46,20 @@ exports[`SuggestedCourses snapshot has 3 suggested courses 1`] = `
srcAlt="Course image banner"
/>
<Card.Header
className="mb-2"
title="Suggested course 2"
/>
<Card.Body
className="h-100"
/>
<Card.Footer>
<Button
as="a"
>
View Course
</Button>
<ActionRow>
<Button
as="a"
>
View Course
</Button>
</ActionRow>
</Card.Footer>
</Card>
<Card
@@ -59,14 +71,20 @@ exports[`SuggestedCourses snapshot has 3 suggested courses 1`] = `
srcAlt="Course image banner"
/>
<Card.Header
className="mb-2"
title="Suggested course 3"
/>
<Card.Body
className="h-100"
/>
<Card.Footer>
<Button
as="a"
>
View Course
</Button>
<ActionRow>
<Button
as="a"
>
View Course
</Button>
</ActionRow>
</Card.Footer>
</Card>
</div>

View File

@@ -1,7 +1,12 @@
import React from 'react';
import { useIntl } from '@edx/frontend-platform/i18n';
import { Card, Button, Container } from '@edx/paragon';
import {
ActionRow,
Card,
Button,
Container,
} from '@edx/paragon';
import { hooks as appHooks } from 'data/redux';
import messages from './messages';
@@ -20,9 +25,12 @@ export const SuggestedCourses = () => {
src={course.bannerImgSrc}
srcAlt={formatMessage(messages.courseImageAlt)}
/>
<Card.Header title={course.courseName} />
<Card.Header title={course.courseName} className="mb-2" />
<Card.Body className="h-100" />
<Card.Footer>
<Button as="a">{formatMessage(messages.viewCourseButton)}</Button>
<ActionRow>
<Button as="a">{formatMessage(messages.viewCourseButton)}</Button>
</ActionRow>
</Card.Footer>
</Card>
))}