Andal.LND/frontend-app-learner-dashboard
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Lk/update responsive view (#58)

Browse Source
This commit is contained in:
leangseu-edx
2022-10-31 13:29:24 -04:00
committed by GitHub
parent 41df13b059
commit 0badf690a6
23 changed files with 485 additions and 301 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/containers/CourseCard/CourseCard.scss
View File

@@ -2,6 +2,10 @@
.course-card {
.card {
.pgn__card-wrapper-image-cap.vertical {
display: flex;
min-height: $card-image-vertical-max-height;
}
.pgn__card-image-cap {
border-bottom-left-radius: 0 !important;
}
@@ -11,6 +15,9 @@
.pgn__card-header-content {
margin-top: 1.5rem;
}
.pgn__card-footer .pgn__action-row {
white-space: nowrap;
}
.course-card-verify-ribbon-container {
width: 100%;

2
src/containers/CourseCard/components/CourseCardBanners/CertificateBanner.jsx
View File

@@ -50,7 +50,7 @@ export const CertificateBanner = ({ cardId }) => {
if (isArchived) {
return (
<Banner variant="warning">
{formatMessage(messages.notEligibleForCert)}.
{formatMessage(messages.notEligibleForCert)}
{' '}
<Hyperlink destination={progressUrl}>{formatMessage(messages.viewGrades)}</Hyperlink>
</Banner>

1
src/containers/CourseCard/components/CourseCardBanners/__snapshots__/CertificateBanner.test.jsx.snap
View File

@@ -101,7 +101,6 @@ exports[`CertificateBanner snapshot not passing and has finished 1`] = `
variant="warning"
>
You are not eligible for a certificate.
.
<Hyperlink
destination="progressUrl"

2
src/containers/CourseCard/components/CourseCardContent.jsx
View File

@@ -22,7 +22,7 @@ export const CourseCardContent = ({ cardId, orientation }) => {
const { isVerified } = appHooks.useCardEnrollmentData(cardId);
return (
<>
<a className="pgn__card-wrapper-image-cap horizontal overflow-visible" href={homeUrl}>
<a className={`pgn__card-wrapper-image-cap overflow-visible ${orientation}`} href={homeUrl}>
<img
className="pgn__card-image-cap"
src={bannerImgSrc}

34
src/containers/CourseCard/components/CourseCardMenu/__snapshots__/index.test.jsx.snap
View File

@@ -26,15 +26,14 @@ exports[`CourseCardMenu enrolled, share enabled, email setting enable snapshot 1
>
Email settings
</Dropdown.Item>
<Dropdown.Item>
<TwitterShareButton
className="w-100 text-left"
title="I'm taking test-course-name online with twitter-social-brand. Check it out!"
url="twitter-share-url"
>
Share to Twitter
</TwitterShareButton>
</Dropdown.Item>
<TwitterShareButton
className="pgn__dropdown-item dropdown-item"
resetButtonStyle={false}
title="I'm taking test-course-name online with twitter-social-brand. Check it out!"
url="twitter-share-url"
>
Share to Twitter
</TwitterShareButton>
</Dropdown.Menu>
</Dropdown>
<UnenrollConfirmModal
@@ -76,15 +75,14 @@ exports[`CourseCardMenu masquerading snapshot 1`] = `
>
Email settings
</Dropdown.Item>
<Dropdown.Item>
<TwitterShareButton
className="w-100 text-left"
title="I'm taking test-course-name online with twitter-social-brand. Check it out!"
url="twitter-share-url"
>
Share to Twitter
</TwitterShareButton>
</Dropdown.Item>
<TwitterShareButton
className="pgn__dropdown-item dropdown-item"
resetButtonStyle={false}
title="I'm taking test-course-name online with twitter-social-brand. Check it out!"
url="twitter-share-url"
>
Share to Twitter
</TwitterShareButton>
</Dropdown.Menu>
</Dropdown>
<UnenrollConfirmModal

23
src/containers/CourseCard/components/CourseCardMenu/index.jsx
View File

@@ -71,18 +71,17 @@ export const CourseCardMenu = ({ cardId }) => {
)}
*/}
{twitter.isEnabled && (
<Dropdown.Item>
<ReactShare.TwitterShareButton
url={twitter.shareUrl}
title={formatMessage(messages.shareQuote, {
courseName,
socialBrand: twitter.socialBrand,
})}
className="w-100 text-left"
>
{formatMessage(messages.shareToTwitter)}
</ReactShare.TwitterShareButton>
</Dropdown.Item>
<ReactShare.TwitterShareButton
url={twitter.shareUrl}
title={formatMessage(messages.shareQuote, {
courseName,
socialBrand: twitter.socialBrand,
})}
resetButtonStyle={false}
className="pgn__dropdown-item dropdown-item"
>
{formatMessage(messages.shareToTwitter)}
</ReactShare.TwitterShareButton>
)}
</Dropdown.Menu>
</Dropdown>

6
src/containers/CourseCard/components/__snapshots__/CourseCardContent.test.jsx.snap
View File

@@ -3,7 +3,7 @@
exports[`CourseCardContent snapshot not verified 1`] = `
<Fragment>
<a
className="pgn__card-wrapper-image-cap horizontal overflow-visible"
className="pgn__card-wrapper-image-cap overflow-visible vertical"
href="test-home-url"
>
<img
@@ -55,7 +55,7 @@ exports[`CourseCardContent snapshot not verified 1`] = `
exports[`CourseCardContent snapshot orientation horizontal 1`] = `
<Fragment>
<a
className="pgn__card-wrapper-image-cap horizontal overflow-visible"
className="pgn__card-wrapper-image-cap overflow-visible horizontal"
href="test-home-url"
>
<img
@@ -125,7 +125,7 @@ exports[`CourseCardContent snapshot orientation horizontal 1`] = `
exports[`CourseCardContent snapshot orientation vertical 1`] = `
<Fragment>
<a
className="pgn__card-wrapper-image-cap horizontal overflow-visible"
className="pgn__card-wrapper-image-cap overflow-visible vertical"
href="test-home-url"
>
<img