-
Bug
-
Resolution: Unresolved
-
High
-
None
-
8.5.11, 9.1.0, 9.0.1, 9.0.2, 9.0.0, 9.0.3, 9.0.4, 9.1.1, 9.2.0, 9.1.2, 9.2.1, 9.3.1
-
23
-
Severity 3 - Minor
-
106
-
Issue Summary
When using the Jira Issue/Filter Macro on a Confluence page, the Epic Links are rendered in colors that match the background, making the text unreadable. This issue is observed when displaying the Epic Link column and affects visibility due to color rendering issues. It appears to be related to changes introduced with the "Dark Mode" feature, first released in Confluence 9.0, although it occurs regardless of whether dark mode is enabled. Notably, the issue is not reproducible in earlier versions such as Confluence 8.7 and 8.9, supporting the hypothesis that the problem is associated with the Dark Mode feature introduced in Confluence 9.0.
Steps to Reproduce
- Create a Confluence page and insert a Jira Issue/Filter Macro.
- Configure the macro to display the Epic Link column.
- Save the page.
- Confirm that the Epic Link column appears empty.
- Highlight the content of the cells in the Epic Link column.
Expected Results
Epic Links should be clearly visible against the background, regardless of the color theme or mode used. For example, in an ideal scenario, the epic would be displayed in the preview, and the link would be easily readable without needing to highlight the text.
Actual Results
Epic Links are rendered in colors that match the background, making them unreadable. The text in the Epic Link column appears empty until highlighted, revealing a visibility issue with the current color scheme. This indicates a rendering issue where the text color is not appropriately adjusted for visibility against the background.
Workaround
- In Jira, navigate to the main issue of the affected epic.
- Click on Admin > Add field, and look for the Epic Colour field.
- This field will contain a value in the format ghx-label-##. Empty this field and save the changes.
Note: Modifying the Epic Colour will alter how Jira users see the epic's visual representation in the user interface. - Refresh the Confluence affected page to validate that the epic link is now visible.
- is duplicated by
-
-
- Gathering Impact
-
[CONFSERVER-99080] Epic Link text is rendered in unreadable colors in the Jira Issues macro in Confluence 9.0.1 and later versions
I am currently looking at this ticket. While I am working on it would like to propose a temporary workaround while we try to get this fix out.
- Go to Settings -> General Configuration -> Custom HTML
- In the "At end of the HEAD" section paste the piece of code provided below at the end of any existing code that you may have in there already.
- Save your changes
This workaround should fix the problem immediately for any affected page.
<style >
.refresh-module-id.jira-table {
& .aui-lozenge.ghx-label-1 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-2 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-3 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-4 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-5 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-6 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-7 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-8 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-9 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-10 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-11 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-12 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-13 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-14 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-0 {
background-color: var(--ds-text, #fff) !important;
}
}
</style>
All comments
Franco Skrzypczak, the custom HTML works fine, thanks. Should I remember to remove the custom HTML, once the bug is resolved in a newer version of Confluence?
I am currently looking at this ticket. While I am working on it would like to propose a temporary workaround while we try to get this fix out.
- Go to Settings -> General Configuration -> Custom HTML
- In the "At end of the HEAD" section paste the piece of code provided below at the end of any existing code that you may have in there already.
- Save your changes
This workaround should fix the problem immediately for any affected page.
<style >
.refresh-module-id.jira-table {
& .aui-lozenge.ghx-label-1 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-2 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-3 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-4 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-5 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-6 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-7 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-8 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-9 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-10 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-11 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-12 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-13 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-14 {
color: var(--ds-text, #fff) !important;
}
& .aui-lozenge.ghx-label-0 {
background-color: var(--ds-text, #fff) !important;
}
}
</style>
Hi Atlassian Team,
this is having major impat on multiple level for Hutchison. Proposed solution with workaround to edit all the pages manually is not an option in a large enterprise installation. Looking forward, that this is fixed in a professional way and soon.
We were forced by Atlassian to do a "Security Upgrade" and we were forced to use a newer LTS Version, though the old one was still under support, but security fix not availaible (why then LTS... no idea). And now mess with disruption of the user experience.
br Karl
Hi Atlassian team,
This is having major impact on multiple levels for Axway. Can this be escalated and fixed with priority. Thanks a lot in advance.
Yavor Christov
Director | R&D Operations
Hey Pedram, I am working on a proper fix for this issue so yes in the future this code can be removed again. I will update the "fix versions" field in this ticket when I am done with the fix.