Overriding CSS styles with Jira 8+

Alexander Garanin October 15, 2019

Hi all,

We have a custom Jira plugin that overrides the "max-width" property of "long-field" fields in Jira (e.g. Summary) to remove 500px limit.

Here's the css:

form.aui .long-field {
max-width: none;
}

And here's the web-resource descriptor from the atlassian-plugin.xml:

<web-resource key="custom-jira-aui-override-css" name="Custom Jira AUI Override CSS">
<description>Provides AUI styling overrides required by The Company.</description>
<dependency>jira.webresources:jira-fields</dependency>
<resource type="download" name="custom-jira-aui-override.css" location="css/custom-jira-aui-override.css" />
<context>jira.general</context>
</web-resource>

This solution works great in Jira up to 7.13.5, but not in 8.4 I am evaluating now.

Checking the css inspector, I see that in both cases the "max-width" property comes from a number of resources, and in Jira 7 our "max-width: none" comes last, overriding the others.

However, in Jira 8 it's not the last one to be applied, making it ineffective, and the fields still have that 500px width limit.

Does anyone have any clue on what could cause this, and how could I fix it?

1 answer

1 accepted

0 votes
Answer accepted
Alexander Garanin October 15, 2019

Never mind, found the solution myself :)

Just needed to replace

form.aui .long-field {
...
}

with

form.aui.aui-legacy-forms .long-field, form.aui:not(.aui-legacy-forms) .long-field {
...
}

which is used by Jira 8 now.

Suggest an answer

Log in or Sign up to answer