Splitting up CSS into a few different files

[Fran Boon]

I have just done another painful merge of a few CSS tweaks to Trunk
into the IFRC deployment branch.
This has reinforced to me the need to break up the CSS into more
manageable chunks.
I think this will not arouse any ire, but wanted to give the
opportunity for a little discussion before ploughing ahead with such a
change.

The obvious ones to break out are layout & menus as these are the ones
which vary so much between these 2 branches.
I would propose:
static/s3_layout.css (Overall Structure: Wrappers/Columns/Contents)
static/s3_menus.css
Leaving the stuff which varies less to support the core widgets in sahana.css

These would be compiled together with the rest of sahana.css for
sahana.min.css in production use as -normal.

I'm sure there are more things that we could break out.
1 obvious one in the IFRC branch is an s3_map.css for a whole bunch of
little tweaks.

Input welcome :)

F

[Michael Howden]

Hey,

I think that would be a great idea. I think that splitting it up into smaller files would make it much easier to edit and could encourage people (/me glances at Hina!) to get stuck in. Some thoughts:

• I think that it would be clearer if all the sahana specific css was in a single folder.
  
• What about a themes.css? Which could contain all the content that would change with different themes? Alternatively (If it's actually the bulk of the content that will change) what about a generic.css?
• However I think that we could actually break them up further (having spent a lot of time scrolling through that css file on a number of occasions - some thoughts for specific CSS files:
• dataTables.css
• forms.css
• modules specific css (all in one file)
• frontpage.css

Cheers

Michael

-- 
Michael Howden
skype: michael.howden 
twitter:@michaelhowden
Sahana Software Foundation Member
Sahana Eden Project Management Committee
Sahana Community Development Committee

[Fran Boon]

On 3 May 2012 23:09, Michael Howden <mic...@sahanafoundation.org> wrote:
> I think that would be a great idea. I think that splitting it up into
> smaller files would make it much easier to edit and could encourage people
> (/me glances at Hina!) to get stuck in.

Yes indeed :)

> Some thoughts:
> I think that it would be clearer if all the sahana specific css was in a
> single folder.

What means 'sahana specific'?
You mean stuff in the S3 layer? (i.e. not Web2Py or T2 layers)
- this is the current organisation
or you mean stuff which doesn't come with 3rd-party libraries?
I guess you mean the latter since T2 is now deprecated & we've moved
so far from Web2Py that little of it remains (especially CSS, where
it's just calendar.css for a widget we no longer use!)

Personally I see little value in having many different folders -
having S3 vs jquery in the filename is plenty sufficient for me.

I also prefer to move quickly to small incremental actions which
address my high-priority pain points rather than long discussions
leading to a mountainous task which never gets started ;)

> What about a themes.css? Which could contain all the content that would
> change with different themes? Alternatively (If it's actually the bulk of
> the content that will change) what about a generic.css?

Not really possible unfortunately, but if you read my mail,. this is
basically 'sahana.css'
- i.e. the bit supporting the core widgets.
This does get changed for different deployments but more in the way of
a few tweaks which are easier to merge rather than wholesale changes.

> However I think that we could actually break them up further (having spent a
> lot of time scrolling through that css file on a number of occasions - some
> thoughts for specific CSS files:
> dataTables.css
> forms.css
> modules specific css (all in one file)

I'm happy keeping all 3 of these in sahana.css for now - they don't
add up to a lot each, so not too much scrolling required & nor do they
vary a lot between deployments, so no merge issues.

> frontpage.css

Right - this is certainly stuff which changes commonly...it could sit
within s3_layout.css, but that changes less frequently, so best
pulled-out into it's own file.

F