Description
Describe the bug
The !important tag applied to the CSS for the markdown external link icon causes the icon to appear white, blending into the white background. This makes the icon invisible. Removing the !important tag or the overriding CSS resolves the issue by restoring the expected behavior.
To Reproduce
- Navigate to: reach out @yelz03 for a link
- Click the "Click to Chat" button to launch the chat interface.
- Type "careplan enquiry" and wait for the Virtual Assistant (VA) response with quick reply options.
- Select the option "What payment methods do you have available?" and then click "Online" in the next prompt.
- The VA response will include a link labeled "click here." Next to the link, observe the markdown icon, which is white and blends into the background.
- Inspect the CSS using browser developer tools to confirm the issue.
Observed Behavior
The white markdown icon is barely visible against the white background due to CSS overriding the default styling with the !important tag.
Expected Behavior
Disabling the overriding CSS allows the default markdown icon styling to display correctly. This ensures the icon is visible against the background.
Screenshots
Issue: White icon blending with the background
CSS inspection showing the overriding styles
Expected behavior
Disabling the CSS that is overriding the default markdown icon, shows the expected behaviour:
Desktop (please complete the following information):
- OS: Windows
- Browser: Chrome
- Version: 131.0
Additional Information
This issue affects all browsers. Please let me know if further details are required.
Kind regards,
Yele Alade