OJS 3.1 Dropdown menu in Arabic

Dilan_Rostam · November 14, 2017, 3:23pm

I installed OJS 3.1, and we have a bilingual journal. The ABOUT sub menus are working fine in English but in Arabic the sub-menus are not showing. I tried all Navigation setting and across different browsers but still not working.

What can be the issue?

The web site

http://journals.cihanuniversity.edu.iq/index.php/cuejss/index

Azerilatama · November 15, 2017, 7:58pm

it is the style problem in the rtl mode.

edit the “/plugins/themes/default/styles/rtl.less” style file and add the fallowing line:

.pkp_navigation_primary ul {
left: auto;
right: auto;
}
.pkp_navigation_user ul {
left: auto;
right: auto;
}

remember to keep them inside body[dir=“rtl”] { … }

Dilan_Rostam · November 15, 2017, 10:50pm

Thank you. This did not help the case I can see that the tags are already there. The only differences is right: -9999px, I replaced this with right: auto; but still the same.

.pkp_navigation_primary {

	ul {
		left: auto;
		right: -9999px;
		text-align: right;
	}

	[aria-expanded="true"] > ul {
		right: 0;
		left: auto;
	}
}

.pkp_navigation_user {
	text-align: left;

	li {
		text-align: right;
	}

	ul {
		left: auto;
		right: -9999px;
	}

	[aria-expanded="true"] > ul {
		right: auto;
		left: 0;
	}
}

Azerilatama · November 16, 2017, 10:05am

are you sure ?
I test it on your website through browser inspector. and it work perfectly!!!

Capture

Dilan_Rostam · November 16, 2017, 11:44am

Yes that is right, it is working in Inspection but when I change the the data in

/plugins/themes/default/styles/rtl.less

It is not recorded. Am I looking at the correct file then?

This is how I did

.pkp_navigation_primary {

  ul {
  	left: auto;
  	right: auto;
  	text-align: right;
  }

  [aria-expanded="true"] > ul {
  	right: 0;
  	left: auto;
  }

}

.pkp_navigation_user {
text-align: left;

  li {
  	text-align: right;
  }

  ul {
  	left: auto;
  	right: auto;
  }

  [aria-expanded="true"] > ul {
  	right: auto;
  	left: 0;
  }

}

Azerilatama · November 16, 2017, 2:13pm

and are you delete the css files from the cache folder? its not applied until you delete the compiled css files which are located in the cache folder.