Skip to content

[BB-2218] Build the LMS theme preview component

Created by: Agrendalath

This adds the preview component to Preview & colors sectionof the new Ocim frontend.

Notes:

  • the tests are currently failing due to extra dependencies needed by PreviewComponent in ThemePreviewAndColors; I'll fix them in the meantime,
  • there is no "course preview" component, so I used a dummy image fo this and added TODO there,
  • I used standard instance as a reference for the preview component, because there were some differences between mockups and actual look of the Open edX instance (e.g. navbar was missing the left part, which was already present in the Navigation customization, Hero was missing padding at the sides and top, footer didn't have the top border, etc.); the styling is not "pixel-perfect", but I tried making it as close to the real one as possible.

Testing instructions:

  1. Checkout this branch.
  2. Run Ocim (inside vagrant with make run.dev).
  3. Go to frontend/ and build the new API client with ./scripts/build-api-client.sh
  4. Run the new frontend: npm start.
  5. Create a new account in console or use an exiting one.
  6. Go to Theme -> Preview & colors.
  7. Check that the theme preview is displaying correctly.

Reviewers:

Merge request reports