search

oulan / iui

Automatically exported from code.google.com/p/iui
MIT License
0 stars 0 forks source link

Add CSS classes to iUI #209

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago 
This is quite a general topic, but I want to see what people think about 
it.

The styling of iUI currently relies very much on the structure of your 
document. I find it sometimes very hard to achieve some design 
modifications without having to change iUI (which I don't want).

Because I use iUI in combination with a dojo-based webapp, I often have the 
need to group nodes in a div. This div does add nothing to the styling, but 
is just a container for a widget e.g. As soon as I do this, it breaks my 
styling and there's no way to prevent this.

In my opinion, class-based styling is much more flexible. Currently your 
app looks good very quick, you don't have to find all the relevant classes. 
This is great, but I think for more advanced applications some other way to 
apply styling is needed. Off course there's no need to break current 
applications, but class definitions could be added along the current 
tagbased selectors in the CSS.

Original issue reported on code.google.com by hendrik@van-antwerpen.net on 25 Dec 2009 at 4:42

GoogleCodeExporter commented 9 years ago 
I think this is a good suggestion. As I started with iUI I wondered why a 
surrounding
div kills the style of lists as an example. But on the other hand this would 
have a
great impact on the backward compatibility and custom changes.

Would you provide a class based css file? I would love to play arround with it, 
but
my css skills are still too limited.

Cheers
Max

Original comment by melcher....@gmail.com on 2 Jan 2010 at 3:30

GoogleCodeExporter commented 9 years ago 
I'll try to make an example, I think it should'nt be that hard to do.
As for backward compatibility, it should be possible to maintain that by just 
adding
class selectors next to the tag selectors.
To prevent the tag behaviour, you could check for the absence of a certain 
class. So
the tag selector applies, unless the iui_reset class is set.
The number of tests would increase a lot, since you have to test both method.

Original comment by hendrik@van-antwerpen.net on 2 Jan 2010 at 4:37

GoogleCodeExporter commented 9 years ago 
It should get easier to maintain - not tougher. So I think we should focus on
class-based only. Provide a file please, you can upload it here. I think if you 
do it
its easier to discuss. 

If you know how to use mercurial/hg create a clone on google code, that makes 
things
easier for us. If not just upload the iui.css :)

Cheers
Max

Original comment by melcher....@gmail.com on 4 Jan 2010 at 2:23

GoogleCodeExporter commented 9 years ago 
I've created a clone with the changes
(http://code.google.com/r/hendrikvanantwerpen-iui/).
I updated the index page and the music sample already and it seems to work ok. 
I also
included a musicscroll sample, where I tried to incorporate cupiq's scroll 
script.
Since I have no iP* with me at the moment, I can't test if the scrolling 
actually works.

Main changes:
- Named all classes iui* so its clear where they belong to.
- Introduced iuiContainer to hold pages. Also changed the JS for this, so async 
pages
are loaded where you want it, not under body.
- Changed the code to find the selected page so that it can find pages 
everywhere,
not just children ofbody.

I found out it is not possible to have tag and class based style in one file. 
The
reason for this is, that adding extra classes changes the priority of css 
rules. This
to the extent that tag-based stlying does not work correctly anymore.

Original comment by hendrik@van-antwerpen.net on 7 Jan 2010 at 11:11

GoogleCodeExporter commented 9 years ago 
I'll give it a shot at the Weekend! You mentioned a lot of changes, I am afraid 
that
the introduction of the iuiContainer is not backward compatible - but that 
depends on
your implementation. Maybe its better to do that as a plugin. 

You'll get my feedback - Sean are you reading this?

Thanks for your contribution!
Cheers
Max

Original comment by melcher....@gmail.com on 7 Jan 2010 at 8:02

GoogleCodeExporter commented 9 years ago 
tried and wrote you some lines!

Cheers
Max

Original comment by melcher....@gmail.com on 10 Jan 2010 at 7:31

GoogleCodeExporter commented 9 years ago 
Issue 49 has been merged into this issue.

Original comment by msgilli...@gmail.com on 12 Apr 2012 at 4:51