RTL stylesheet startegy

[mksoft]

I'm working on right-to-left enabled support for the admin interface.
The strategy right now was creating a matching RTLed stylesheet for
every one there is which overrides only the ltr specific settings, so
we have:

base.css->base_rtl.css
layout.css->layout_rtl.css

etc.

The problem ? Styles are scatterd among many sheets and it's getting
quite messy. Lots of those are loaded twice as well. e.g:

dashboard_rtl.css load dashboard.css which loads base.css. It also
needs to load base_rtl.css by itself (which loads base.css as well and
modifies the needed ones).

As we can see, it's quite a mess.

Since RTL changes are relatively small, maybe a better solution would
be to create an rtl.css which contains all the rtl needed overrides in
a single, and more maintainable file ? It would look better in the
templates as well. (loads the basic style, and in case of
LANGUAGE_BIDI, load rtl.css).

Comments ?
--
Meir Kriheli
http://mksoft.co.il

[hugo]

Hi,

> Since RTL changes are relatively small, maybe a better solution would
> be to create an rtl.css which contains all the rtl needed overrides in
> a single, and more maintainable file ? It would look better in the
> templates as well. (loads the basic style, and in case of
> LANGUAGE_BIDI, load rtl.css).

Regardless on what path you take, better talk to Wilson Miner, as he is
the guy in control of the Django stylesheets.

bye, Georg

[Wilson Miner]

I think that makes sense - having one rtl.css that overrides the default styles. It's a lot more maintainable than trying to keep multiple rtl stylesheets in sync with the main stylesheets.

 

You may need to use chained selectors or !important declarations in some places to successfully override the defaults. Let me know if I can make any changes to the core CSS to make things easier.
 

Cheers,
Wilson
 

[Jeroen Ruigrok van der Werven]

On 6/7/06, Wilson Miner <wmi...@gmail.com> wrote:
> I think that makes sense - having one rtl.css that overrides the default
> styles. It's a lot more maintainable than trying to keep multiple rtl
> stylesheets in sync with the main stylesheets.
>
> You may need to use chained selectors or !important declarations in some
> places to successfully override the defaults. Let me know if I can make any
> changes to the core CSS to make things easier.

Don't forget the dir="rtl" and dir="ltr" specifiers. We would need to
update the admin pages for that as well. And this is not CSS, but
straight into HTML of course.

See http://www.w3.org/TR/i18n-html-tech-bidi/ for more information.

--
Jeroen Ruigrok van der Werven

[Meir Kriheli]

Actually that technique is rare around here. We don't specify dir="rtl"
in the actual content. Most of the developers around here prefer to
specify in a stylesheet "direction:rtl" for the body tag. Eases the
development for multilingual sites, and it's working as it should.

That's the method I'm planning to use with Django as well.

Cheers

[Jeroen Ruigrok van der Werven]

On 6/8/06, Meir Kriheli <me...@mksoft.co.il> wrote:
> Actually that technique is rare around here. We don't specify dir="rtl"
> in the actual content. Most of the developers around here prefer to
> specify in a stylesheet "direction:rtl" for the body tag. Eases the
> development for multilingual sites, and it's working as it should.

direction: has issues in IE 7 (especially with :hover) and in some
cases in IE 6 as well. dir="" syntax works for IE, Opera and Firefox
as it should.

See http://www.webdevout.net/ for more information.

--

[Meir Kriheli]

Someone should put that browser out of it's misery. Added it to base.html.

Thanks

[Ahmad Alhashemi]

I've written a tool in Python that will automatically convert CSS from
LTR to RTL. It's been used successfully to ease the conversion of tens
of WordPress's themes. How do you think it could be used to help in
django?

It basically takes a CSS file and converts all right or left rules to
the opposite and the same for values. It will preserves comments,
whitespace, .. etc.

For Arabic websites, I see that most of them are using the dir
attribute instead of the direction CSS rule. I've always used dir to
comply with that W3C tech document (the tech document makes a lot of
sense to me).

[Meir Kriheli]

Hi Ahmad,

Ahmad Alhashemi wrote:
> I've written a tool in Python that will automatically convert CSS from
> LTR to RTL. It's been used successfully to ease the conversion of tens
> of WordPress's themes. How do you think it could be used to help in
> django?
>
> It basically takes a CSS file and converts all right or left rules to
> the opposite and the same for values. It will preserves comments,
> whitespace, .. etc.

We don't want to maintain 2 (or more, since admin contains multiple)
stylesheets, as they change from time to time (see Wilson's comment on
this thread).

We also can't replace (as is done in replacing themes' sheets) the
original ones, since the system should work on multilingual site (i.e:
have the ability to display ltr _and_ rtl, depending on user's chosen
language).

So the chosen (and implemented) path was to maintain a single rtl
stylesheet which overrides only the ltr specific parts in all stylesheets.

>
> For Arabic websites, I see that most of them are using the dir
> attribute instead of the direction CSS rule. I've always used dir to
> comply with that W3C tech document (the tech document makes a lot of
> sense to me).

Thanks for the info :) It's already implemented both as a css rule and a
dir attribute, see line 2 of base.html:

http://code.djangoproject.com/browser/django/trunk/django/contrib/admin/templates/admin/base.html#L2

Cheers