Difference highlighting styles missing

[michael-valdron]

Which area this feature is related to?

/kind bug

Which area this bug is related to?

/area landing-page

What versions of software are you using?

Node.js project

Operating System and version: N/A

Node.js version: 16

Yarn version: 1.22.18

Project.json: 15.2.1

Bug Summary

Describe the bug:

When using a markdown diff fence to showcase changes in source the highlighting of the changes is missing. This is due to the site css missing styling for these kinds of elements.

To Reproduce:

1. Checkout what is the latest commit at the time of writing this
2. Create a new markdown doc page file and place a diff fence in that file with source changes
3. Run a local server of the landing page, yarn nx serve landing-page
4. Visit this doc page under http://localhost:4200/docs/<version>/<filename-without-ext>
5. Rendered diff fence will not have highlighting for changed lines

Expected behavior

Should show appropriate highlighting on changes, deleted line changes should be some form of red, and inserted line changes should be some form of green.

Any logs, error output, screenshots etc? Provide the devfile that sees this bug, if applicable

Additional context

Any workaround?

None.

Suggestion on how to fix the bug

Add styling blocks to site css which creates what is expected for changed lines under diff fences.

Target Date: 05-16-2023

[michael-valdron]

Diff change highlighting styles have been added and approved, just waiting on additional reviews for tied issue: #1057 (comment)

[michael-valdron]

#1057 (comment)

[michael-valdron]

Blocked for the same reason as #1113 (comment).

[michael-valdron]

No longer being blocked by #1057 and is now open for review in PR devfile/devfile-web#88.