Moodle 2.3 Theme Aaradyha designed for RTL languages

Moodle 2.3 Theme Aaradyha designed for RTL languages

by Mary Evans -
Number of replies: 23

Coinciding with the release of Moodle 2.3 I have added a new theme to the Moodle Themes directory.

Aaradyha (Pronounced Aradia - meaning Wisdom in Hindu) is a three column Moodle theme built specifically with RTL (right to left) languages in mind. The pagelayout is based on Matthew James Taylors Perfect Holy Grail (percentage) Layout, and works pretty well in Internet Explorer 7, for those who are forced to use the older browser. This is not to say there wont be any display issues with IE7, as there undoubtedly will be.

Although this theme is designed for Moodle 2.3 it is possible it will work in other versions of Moodle such as Moodle 2.1.x and Moodle 2.2.x. Aaradyha is built on Base theme so that any future CSS updates in Base with be picked up automatically by this theme, with the exception of pagelayout.css. This is because of the specific layout of this theme, that it was necessary to EXCLUDE base theme's pagelayout.css. That said, it is not envisaged that the layout for this theme will alter, but if it does then you will need to update to a newer version of Aaradyha from the Moodle plugins Directory at http://Moodle.org/plugins/.

You will be pleased to learn that Aaradyha has a Custom settings page where you can change the look of the header and footer and also add custom CSS. This means you can add background images to your header and footer using CSS, and also add a logo directly into the header, and/or the footer, at the same time as well as add some text. If you want to use a specific font-family, or change font-size and color, you can do all that too by adding the CSS rules for these changes. Of course you will need to know a fair bit about CSS, but if you don't then help is always at hand in the Moodle themes forum. http://Moodle.org/mod/forum/view.php?id=46

Last but now the least, in Moodle 2.3 you can add a custom menu in the Custom settings page of Aaradyha. This means that were you to duplicate this theme, to use as a course theme, you could in effect have different menus in different course pages. All very new and exciting! So all the places where you can allow theme changes by course, category, or user you have the potential to change the menu for all these duplicate themes. This is advanced themeing for those wanting the challenge.

Credits: My special thanks to Nadav Kavalerchik http://moodlemagic.info/moodle/ for all the RTL CSS fixes.

Here is a screen shot.Aaradyha

Average of ratings: Useful (3)
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Richard Oelmann -
Picture of Core developers Picture of Plugin developers Picture of Testers

That's fantastic Mary - It's great to see all the hard work and effort you've put into rtl fixes over the last few months come to fruition in another of your beautiful themes. I look forward to 'playing' with it and exploring the new features.

Richard

Average of ratings: -
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Siddharth Patel -

Nice name..
Really loved it smile

and theme looks very pretty..

Average of ratings: -
In reply to Siddharth Patel

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by James Cracknell -

Wow - beautiful....

Thinking of writing and calling a theme just A to get to the top of the list smile

Average of ratings: -
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Miriam Laidlaw -

Hooray! A nice Moodle 2.3 theme to play with. Thanks, Mary. It looks great. smile

Average of ratings: -
In reply to Mary Evans

This forum post has been removed

The content of this forum post has been removed and can no longer be accessed.
In reply to Deleted user

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Mary Evans -

CheersHi Dietmar yes isn't it great!

I think the only problem with the RTL is the Calendar when in Arabic. The Lang $strings need changing.  I think I will need to set up a Moodle Tracker to fix it.

Cheers

Mary

Average of ratings: -
In reply to Mary Evans

This forum post has been removed

The content of this forum post has been removed and can no longer be accessed.
In reply to Deleted user

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Mary Evans -

ROFL

@mastheaddesc in the footer? hilarious!

Will do fix in GITHUB - thanks for spotting that typo!

Average of ratings: -
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Fred Nasri -

Dear Mary,

I found this theme quite suitable for RTL languages. Thank you. The main problem (read my problem) is that the theme is a basic one (as you yourself stated).

I wonder if it is possible to effectivlely integrate this theme with another RTL-supported theme (like Afterburner).

What I mean is: "to have the full functinality of Aaradyha in supporting RTL along with the design and styling of Afterburner."

I don't have much knowledge of finding a solution for this but I hope there is a way to, for example, use css parameteres of one theme without doing any damage to the basic structure of the theme.

I know I could safely use Afterburner as an RTL theme but I'm sure Aaradyha is even more supportive of RTL.

I'm sure you, as the creator of the theme, have an effective (and perhaps easy and down-to-earth!) way of getting around this.

Thank you very much for your time.

Average of ratings: -
In reply to Fred Nasri

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Mary Evans -

Hi Fred,

Afterburner and Aaradyha are virtually the same theme, at least they share the same layout, so there would be no problem copying the Afterburner theme CSS to Aaradyha to git it a similar look, although the header (masthead) is different in Aaradyha, the look should be the same. The only difference is that the menu is above the header rather than below as in Afterburner.

If you would like, I could customise Aaradyha to make it look like Afterburner for you?

Cheers

Mary

Average of ratings: Useful (1)
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Fred Nasri -

Hi Mary,

Thanks a lot for your reply.

I greatly appreciate it if you could possiblly do me such a big favor.

Thanks again for your time.

 

 

 

Average of ratings: -
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Fred Nasri -

Hi Mary,

I guess it took a bit longer than expected for you to customize Aaradyha.

I know you're so busy making comments in most topics in the forum.

I just wanted to make sure that you're working on the customization or....

I'm awfully sorry for the bother.

Average of ratings: -
In reply to Fred Nasri

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Mary Evans -

Sorry Fred, I started doing some work on the Aaradyha theme, by making it a child theme of Afterburner, then I realised that your version of Afterburner may be the old version, as this changed in Moodle 2.4.

If you are using Moodle 2.3 then you need to upgrade to Moodle 2.4 and that version of Afterburner is almost the same as Aaradyha, apart from the top menu and the header.

Hope this helps?

Average of ratings: -
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Fred Nasri -

Hi Mary,

No problem. My moodle is 2.4.2. 

I want Aaradyha as the main theme because of its great RTL support. What I need is to add the stylying of Afterburner (block colors and background images, button effects and such stuff related to how the page looks).

I don't know which direction and how: "Aaradyha as a child theme of Afterburner or the other way round?"

Please don't bother if you don't have the time.  Just direct me to the related moodle docs and/or posts you know of.

OR, if you just tell me that I could safely use moodle 2.4 Afterburner without losing anything of RTL support as embedded in Aaradyha, I'll easily forget about all this trouble of "making one a child of another" and go for Afterburner.

 Thanks a lot.

Average of ratings: -
In reply to Fred Nasri

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Mary Evans -

OK...

Open aaradyha/config.php using Notepad and where you see $THEME->parents add afterburner to the array like so...

$THEME->parents = array('afterburner','base');

Save it and upload back to your server and then remember to Purge all cache

Next select Aaradyha from the theme selector and amke it you default theme. You will need to see first what is filtering through from Afterburner before you start to add CSS to style it further.

I'm rushing to go out but will be back later then I can explain more how to changes things.

Cheers

Mary

Average of ratings: -
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Fred Nasri -

Hi Mary,

I did that. But, as you said, it looks something between Afterburner and Aaradyha.

I'm looking forward to learning more in this regard.

Thanks.

Average of ratings: -
In reply to Fred Nasri

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Mary Evans -

Hi Fred,

The thing is now to decide which elements you need to make more like Afterburner.

If it is the side columns then you need to change the CSS in Aaradyha that governs these columns.

To do this add the following CSS to Aaradyah's Custom CSS box...

#page {width: 90%; margin: 0 auto;}
#page-content {background-color: #eee;}
#region-main-box {background-color: #fff;}
#region-pre-box { background-color: #d1e0e7}
.navbar { margin: 0 0 1px; padding: 4px 10px;}

This works OK on my version, however you will need to replace the pagelayout.css as that needed changing slightly.

I have attached that file to this post. See the top-right of this comment.

Hope this all helps?

Mary

Average of ratings: Useful (1)
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Fred Nasri -

Hi Mary,

Of course it does help.

Two questions came to my mind:

1. Could we just override CSS rules in pagelayout.css in the theme's Custom CSS box instead of replacing it?

2. If we have included Afterburner as Aaradyah's parent theme, what's the use of this replacement? 

 

Average of ratings: -
In reply to Fred Nasri

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Mary Evans -

It's important for Aaradyha to have the correct pagelayout.css if you intend to use this theme with newer versions of Moodle. It just matches up better to the way I wrote Afterburner.  I had written some of the ID selectors in such away that it make it difficult for the CSS to pass from Afterburner to Aaradyah with the old pagelayout.css.

Mary

Average of ratings: Useful (1)
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Fred Nasri -

Hi Mary,

Thanks a million for your great help.

I definitely let you know if I have any theme-related problems later on.

 

Average of ratings: -
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Fred Nasri -

Hi Mary,

Following previous posts, I want you to help me have three features of Afterburner enabled when using Aaradhya:

1. The page background with color gradient behind the header in Afterburner moves by scrolling down (the picture). This does not work now.

2. The block header stretches to the full width of the block in Afterburner (the left block in the picture). But it's shorter now (the right block for Aaradhya). With firebug, I tried to increase the length but the dock and minimize icons disappeared.

3. I want to use Afterburner course view not Aaradyha's. For example, when highlighting a topic in Afterburner (the first picture) nothing happens in Aaradhya (the second picture).

At the moment, I'am using Aaradhya with the changes you made (plus replacing pagelayout.css) in the previous posts.

Thanks for your time.

Average of ratings: -
In reply to Fred Nasri

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Mary Evans -

Fred,

1. The background gradient in Afterburner is fixed.  I made it like that so that the background alwasy shows the gradient. To make it behave as you want it to you need to add...

body {background-attatchment: scroll;}

2. Is more difficult but this should work.

#region-pre { left:25%; width:23%;}
#region-post { left:79%; width:23%;}

3.

.course-content .current {  background-color: #eee }

Should fix those items

Mary

Average of ratings: Useful (1)
In reply to Mary Evans

Re: Moodle 2.3 Theme Aaradyha designed for RTL languages

by Fred Nasri -

Hi Mary,

Thanks again.

They all worked.

Average of ratings: -