Anyone knows how can I find the CSS element for the JIRA ticket description panel?
I’m trying to write a plugin which will change text alignment for right-to-left languages.
I was able to update the “issue title” field (using
#summary-val
tag) and “label” field (using ul.labels tag), but I can’t find the correct tag for the “issue description” field when in edit mode.
screenshot
1518×903 257 KB
The plugin code I wrote is in github here:
github.com
/* issue title in board */
#summary-val {
margin-left: -5px;
padding: 2px 30px 2px 5px;
z-index: 1;
direction: rtl;
/* issue title in board list*/
.ghx-issue-fields .ghx-summary .ghx-inner {
display: block;
line-height: 1.1;
max-height: 3.3em;
overflow: hidden;
word-wrap: break-word;
direction: rtl;
/* issue title in search results*/
.details-layout .split-view .list-results-panel .list-panel .issue-list>li .splitview-issue-link .issue-link-summary {
@remie is right. You need to get your CSS into the iframe somehow.
Judging by these docs you might be able to solve your problem by adding the editor-content context to your web resource.
EDIT: I totally lied. The linked docs are for Confluence. But there might be a similiar context for Jira.
EDIT 2: Okay second try - judging by these docs (this time they are in fact for Jira!) you might want to use the jira.rich.editor or jira.rich.editor.content context.
Hmmm we should have thought of that first @remie
require(["jira/editor/customizer"], function (Customizer) {
Customizer.customizeSettings(function(tinymceSettings, tinymce, SchemaBuilder) {
tinymceSettings.plugins.push("directionality");
tinymceSettings.directionality = "rtl";
I’m getting this:
image 1039×339 8.55 KB Yes! adding this section worked - thanks Sven!
For future generations, I’ve updated the files:
github.com
require(["jira/editor/customizer"], function (Customizer) {
Customizer.customizeSettings(function(tinymceSettings, tinymce, SchemaBuilder) {
tinymceSettings.plugins.push("directionality");
tinymceSettings.directionality = "rtl";
<?xml version="1.0" encoding="UTF-8"?>
<atlassian-plugin key="com.cal.jira.jira-rtl-plugin" name="jira-rtl-plugin" plugins-version="2">
<plugin-info>
<description>This is a fork of the right-to-left plugin for Atlassian JIRA for VISA CAL.</description>
<version>1.0.9</version>
<vendor name="Visa C.A.L." url="https://alm-prdappgit01:8443/projects/DEV/repos/jira-rtl-plugin/browse/" />
<param name="plugin-icon">images/pluginIcon.png</param>
<param name="plugin-logo">images/pluginLogo.png</param>
</plugin-info>
<resource type="i18n" name="i18n" location="jira_rtl" />
<web-resource name="Resources" key="css_resources">
<dependency>com.atlassian.auiplugin:ajs</dependency>
<dependency>com.atlassian.auiplugin:aui-table</dependency>
<dependency>com.atlassian.auiplugin:aui-restfultable</dependency>
<dependency>com.atlassian.auiplugin:aui-page-layout</dependency>
<resource name="rtl.css" type="download" location="/css/rtl.css" />
<context>atl.general</context>
</web-resource>
<web-resource key="customizations" name="JIRA Editor Reference Plugin Customizations">
<context>jira.rich.editor</context>
Hi Remie,
Yeah, we’ve tried this app - it switched the entire interface to Arabic.
Thanks,
