Better CSS container classes for Drupal [#70324]

(Didn't know where to put this. Please reclassify if you do)

I have spent many days trying to customize the CSS in drupal.. and many things that should be simple, are difficult, because there is no high level container CSS class for most pages. Most user pages, and almost every admin page is in a common table with no unique ID or class reference to identify that general nature of the content being rendered. Everything is generic. While this is common format is useful sometimes, it's also a real pain when specific referencing is required.

Currently, most pages have the ID and class combination of #content .main-content or .content-both, etc. Only rarely will an output page have a handy container class such as div.profile (as is outputted on the "myaccount" page).

It would be extremely useful of each and every unique type of page in the Drupal system had some container class immediately below the td#content element. It would make it far easier to tweak the CSS.

dding a third class to the #TD would be fine.
eg. td class="content-both profile"
eg. td class="content-both node-list"
eg. td class="content-both gallery-page"

I am not really a system person, but it seems to me that since so many modules would have to name this class, it would be easiest to simply have a "$container-class VAR that each module developer (or modifying programmer) could assign to in their module code somewhere so that the output/theme rendering engine could include it.

How you ensure that such a change gets implemented by all the developers is behind my scope, but it sure would be useful to we who have to style this puppy.

Comments

Comment #1

nevets commented 22 June 2006 at 16:25

You can implement this yourself in page.tpl.php with a little php code using the current path.

Comment #2

pwolanin commented 22 June 2006 at 16:58

I think adding more calss info is an interesting idea, but as mentioned, this can be donw at the theme level.

In regards to this, take a look at his development for PHPtemplate: http://drupal.org/node/65706

you should be able to test this out now without breaking anything in 4.7, and looks very likely to be part of 4.8 core.

Comment #3

shoq commented 4 July 2006 at 14:21

Yes., the php option is there, processing the paths, but that wouldn;t help the nonprogrammer, and would require constant updating. I think I would rather it be tied to governing module first, and then node types. eg. divclass= .comment-replies. This way, it would be more tightly coupled to the system. If all pages had forms, I could just hook with form_alter... but they don't. Is there an equivalent hook at an efficient spot where I can look at the path, or play with other techniques? Not a great programmer, nor familar enough with drupal yet to know this. Took me 2 days just to understand just form alter!

Comment #4

rickvug commented 7 July 2006 at 07:49

In my opinion Drupal should actually cut down on the number of classes and IDs in the base templates. Rather than give nearly everything a class or id, people should use the inheritance of CSS to have the (x)html cleaner. For example, for a menu list, having the "leaf" class is redundant. You can theme things just as easy with a CSS selector such as this:

ul.menu-id li { }

The only extra tags that should be added is a unique and section class for the body element. So if the body class = .admin , you can alter any specfic element of the page by sayin something like body.admin ul#menu-id li {}

Does this make sense or am I mis-interpeting your message? Cheers,
Rick

Comment #5

mrnoblestone commented 8 July 2006 at 15:48

Welll, yes, the major container section is the most vital container needed, and yes, minimizing classes is a nice goal, but there are occasions when the specific form elements just need to be classed. I would like to see the forms API had a standard attribute for "class". That at least provides a bit more granularization when the developer requires.