Epic: Redesign course and program about pages

[jkachel]

As a learner, I'd like to:

• know that I can enroll for free.
• see that I can pay for a certificate and how much it will cost, and when the upgrade deadline is
• know how I can apply for financial assistance
• be able to learn more about certificates
• be able to enroll in a course that is closed and understand that I can't get a certificate
• know when a course is part of a MicroMasters program or a Learning Path

Designs and Mockups

• Figma design: https://www.figma.com/proto/Gs4zIhOFv5gVvafawwl6PF/MITx-Online?page-id=37%3A4307&type=design&node-id=37-4311
• Updated design (whole thing): https://www.figma.com/proto/Gs4zIhOFv5gVvafawwl6PF/MITx-Online?page-id=0%3A1&type=design&node-id=558-2708&viewport=-1130%2C359%2C0.1&t=gwT4VDKtWVtv71cH-1&scaling=scale-down&mode=design

Acceptance Criteria:

These are high level requirements and split into functional areas. Items will link to individual tickets where they can.

• CMS Changes
  • [ ] Add "Show More" functionality to rich text content blocks
  • [ ] Make sure these context blocks are rich text: Course Intro, About (new), What You'll Learn
  • [ ] Add selectable Meet Your Instructors block
• Main Content
  • [ ] Add new CMS block for Course Intro
  • [ ] Implement "Show More" functionality within all content blocks
  • [ ] Add anchor tab
  • [ ] Update styling to match the design
• Infobox
  • [ ] Add container and styling for courseware object information
  • [ ] Add timing information
  • [ ] Add certificate track/pricing information
  • [ ] Add program path information
• Modals
  • [ ] Reformat upsell message for individual courses
  • [ ] Add upsell message for programs (this will contain an enrollment selector)
  • [ ] Any other modals
• Miscellaneous
  • [ ] Add feature flag to enable/disable the new design
  • [ ] Add feature flag to enable/disable program about pages

Out of Scope

• Feature flag implementation: this should not be done in the old manner and instead use the new infrastructure coming in https://github.com/mitodl/hq/issues/1981.

Related issues

Course About Page - https://github.com/mitodl/hq/issues/1542 Reusable Faculty Members - https://github.com/mitodl/hq/issues/1543 Program About Page - https://github.com/mitodl/hq/issues/1544 About Page Enrollment Dialogs - https://github.com/mitodl/hq/issues/1947 Feature Flag Support - https://github.com/mitodl/hq/issues/1981 Program Type Support - https://github.com/mitodl/hq/issues/1982

Related PRs

https://github.com/mitodl/mitxonline/pull/1778 https://github.com/mitodl/mitxonline/pull/1786

[collinpreston]

Spoke with James. He believes there is nothing left to do for this epic to be complete. Closing.