1768377 - Anchor elements with code inside are not readable in current style on extension workshop site

Status: RESOLVED MOVED

(WebExtensions :: General, defect)

Description

[akaabdullahmateen]

Attachment: screenshot.png

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:99.0) Gecko/20100101 Firefox/99.0

Steps to reproduce:

1. Open any page under the domain: https://extensionworkshop.com/documentation/develop - that contains a code element inside an anchor element.
   1*) An example page that has this issue is: https://extensionworkshop.com/documentation/develop/extensions-and-the-add-on-id/
2. On this page, scroll down to the section: When do you need an add-on ID?
   2*) The issue can be seen all over the page, but this particular section has a list of code elements that are also external links.

Actual results:

Any text contained in <a><code> is hard to read because "code" elements are colored blue - #015fdf, while anchor "a" elements have a dark blue background color - #20123a, resulting in blue text over dark blue background. The contrast is negligible, so the text is really hard to read.

Expected results:

There are two solutions:

1. Either the code (only if inside an anchor element) should have white (or some shade of white) colored text, with the default dark blue background color of anchor element.
2. Or, the anchor element (only if some code element is a child) should have no background color, i.e., transparent (or some color that has a high contrast to blue).

Comment 1

[Alex Cornestean]

Hello,

I can confirm the issue is present and occurs as described in Comment 0.

Tested on the latest Nightly (102.0a1/20220509190429), Beta (101.0b4/20220508185621) and Release (100.0/20220428192727) under Windows 10 x64 and Ubuntu 16.04 LTS as well as the latest Google Chrome release version to eliminate any compatibility concerns. The issue occurs regardless of the used browser.

However, the component of this bug is not correct as the issue itself does not affect extensions.

I will set the bug to New and afterwards, hopefully, corresponding product/component will be set as I'm not sure which ones to assign.

Comment 2

[akaabdullahmateen]

Thanks for confirming!

I would really love to solve this bug as I am learning web development, and I would really appreciate if someone can explain me how to set up the correct repository for this, and create an issue, pull request etc. :)