More <body> classes

Hristo · December 04, 2013, 03:17:26 PM

2.1 has relevant for the page body classes and that is very nice. I would like to see some more classes like class for locked topic and class for sticky topic. What would you say?

Also noticed that the classes on message index and topic view pages are same: class="action_messageindex board_X". The board_X class is understandable, but I see no point of action_messageindex to be present on topic view pages. Or maybe I'm missing it's purpose there? Would it be too much if you instead add topic number class (<body class="board_X topicXXXX">) which will allow targeting of specific topic? It will be used rarely, but if setting it is not any significant performance hit maybe it's not a bad idea.

In the end some topics could look like this: <body class="board_XX topicXXXXX locked sticky">

Arantor · December 04, 2013, 03:24:04 PM

Give me an actual use case for this and I'll implement it. I'm not even sure what the benefit of what we have right now is, frankly.

Hristo · December 04, 2013, 04:59:42 PM

Here I will give my reasons, but I too would like to see other opinions, especially coming from much more experienced themers.

Sticky and locked classes - currently there is no simple, easy and fast way I know of to style differently these topics. They look like normal topics. The only difference is the message icon. Having a class for these pages allows for easy styling - different page/post background, different borders, different fonts etc.

Topic class - well, I see this one rarely used. Actually the last time I checked none of the other big forum softwares has such class. Frankly, the only thing I may use these classes is to make a fun with someones thread

. Maybe other people could find a more serious use of it.

As for board number classes which are already implemented - look at that side - in 2.0 (and 2.1 too) we can set a different theme for each board. That is fine if I want to make many changes compared to the other board(s). Especially if I want to use different icons. But what if I want to change just a few things - the background, a few colour changes here and there etc. In that case I prefer to place a few rows of code in current theme's index.css, but that does not work in 2.0.* (or maybe I do not know how to do it).

Illori · December 04, 2013, 05:04:04 PM

you know there are stickybg, locked_sticky2, stickybg2, lockedbg, lockedbg2 classes already in 2.1?

Arantor · December 04, 2013, 05:05:09 PM

You're giving me hypothetical examples, not actual examples. Show me what you'd do if you had this option, not what you could do if you had it.

Actual real examples of what you would do if you could, not vague 'some of this or some of that' are a much more compelling argument.

While it may be a minor change, it is one that does have a cumulative bandwidth effect. Especially as in the majority of time you'd want to do more than just CSS changes anyway (for example I can't see why you'd bother with adding a class for locked topics when if you really want to highlight it, you'd add more markup and style that - which you can't do in CSS) - in fact I'm actually inclined to remove it not add to it because I'm just not convinced it's nearly as useful as has been intimated.

@illori: Not for what he's asking there isn't.

Hristo · December 04, 2013, 05:53:15 PM

I'm using this mod:
http://www.simplemachines.org/community/index.php?topic=355506.0

If I had the way to style these topics in 2.0.* I would for sure - different background.

But...

Quote from: Arantor Beeblebrox the First on December 04, 2013, 05:05:09 PM...in fact I'm actually inclined to remove it not add to it...

Knowing that you are perfectly aware what options these body classes offer and you still think they are not useful enough to be core is enough for me (that is - I do not believe I can say something new to change your mind).

Arantor · December 04, 2013, 06:05:20 PM

So you're using that mod, which is a perfect example of my point. It can't be done in CSS, you need a mod to add to the template. Why not have the mod also output the class you need or even have it output the CSS you want?

I'm perfectly aware of what the options are. My point is that the options as presented are largely useless to most people.

Xarcell · December 13, 2013, 11:36:49 AM

I agree with Hristo.

My client once requested that in mobile devices(to save space), to have a full-screen semi-transparent overlay displaying a "lock" image for 1 second, meaning the topic was locked. I did this by using jQuery and the "locked" selector. So currently with SMF, this can't be done with just javascript/jquery, because there is no locked selector. So in my opinion, I definitely would take advantage of having locked, stickied, and announcement selectors.

I do believe that topic's need there own selector, but they can share the same selector. Example "topic"(as Hristo says). I say this because what if I am happy with my windowbg/windowbg2 background colors in Board.template and Message.template, but not the Display.template?

When making themes for SMF, I would often have to include my own display.template with windowbg4/windowbg5 used instead of windowbg/windowbg2 for easier reading of topics; simply because of the background colors. In fact, I think I still have a few 1.1 themes here at the site that show this. In the board & message areas, I use a greater saturation variance to make it easier on the eyes to identify each board separately, but when I got to the display area, long messages were harder to read because of the saturation of one alternate window with the saturation of the text, so I would use windowbg3, or make my own with windowbg4/windowbg5.

With a topic selector, it would completely eliminate the need to add a whole template to achieve this.

There were plenty other examples I could use of things I've done in the past where I had to add a custom template just for the sake of changing a selector not the layout. Although, with modern CSS techniques and added selectors to elements now, it already eliminated the need(I know because I just spent the last hour digging through and playing with it).

The only real reason to add a topic selector that I can think of right now, is to change the windowbg background color on display view for easier reading. Then again, me personally I would probably customize the infobox using a topic selector, but that really isn't a need.

Kindred · December 13, 2013, 12:17:22 PM

so... go ahead and make a fully realized theme with all this css...

Xarcell · December 13, 2013, 12:37:17 PM

Quote from: Kindred on December 13, 2013, 12:17:22 PM
so... go ahead and make a fully realized theme with all this css...

eh? Can you be more specific?

Kindred · December 13, 2013, 12:44:44 PM

well... 95% of the CSS is defined and called in the templates... which is changeable per theme...

So, if you think this needs to be done - determined exactly what you want and either find someone to do it, or do it yourself, and make a theme that does this....

Xarcell · December 13, 2013, 01:23:09 PM

I'm still confused about what your asking.

This topic requests the addition of a selector for locked and stickied topics to be applied to the body element. As well as the topic selector being added to the body element when using the display.template.php file. SMF 2.1 currently does NOT do this. Hence the request. As far as I know, this would need to done to the core, not just templates. Which would mean a mod would have to be created, in addition to the theme that would need to be made to make an example of use.

I'm a designer, not a developer. So I can't make the mod.

As far as examples, for a need of this, as I already mentioned, I have submitted 1.1 themes here to the site where I had to add a display.index.template.php file to the custom theme using different selectors. For example, swapping out windowbg2 for windowbg4 just to change the background color.

If the requested feature was added,, then there would be no need for me to add a display.index.php file. I could then simply use CSS like so:

Code Select

.windowbg2 { background: #999 }
body.topic .windowbg2 { background: #ddd; }

Arantor · December 13, 2013, 01:32:29 PM

See, here's my point. Both of the examples I've been shown are already possible without my doing any changes whatsoever to 2.1 though only one of them could actually be done slightly more easily with this implemented.

I can understand the use for an individual theme but I'm having trouble understanding where the benefit would be more broadly (because I just don't see the majority of themers using it)... I'd also be concerned at a possible lack of stylistic continuity between pages, but that's why I want to see the themes for myself.

Kindred · December 13, 2013, 01:56:40 PM

but Xarcell, you have just demonstrated why we don't HAVE to add it to the core... because you CAN do it in a custom theme...

yes, that means that you need to define a custom template for Display.template.php, but that is the power of the SMF templating system.... and why should it be added to the core when it can be done in a theme and MOST themers would never use it to begin with?

Xarcell · December 13, 2013, 03:25:19 PM

Quote from: Arantor Beeblebrox the First on December 13, 2013, 01:32:29 PM
See, here's my point. Both of the examples I've been shown are already possible without my doing any changes whatsoever to 2.1 though only one of them could actually be done slightly more easily with this implemented.

I can understand the use for an individual theme but I'm having trouble understanding where the benefit would be more broadly (because I just don't see the majority of themers using it)... I'd also be concerned at a possible lack of stylistic continuity between pages, but that's why I want to see the themes for myself.

I understand and I'm beginning to agree with you. I'm starting to see there's enough benefit versus the toll on resources.

Quote from: Kindred on December 13, 2013, 01:56:40 PM
but Xarcell, you have just demonstrated why we don't HAVE to add it to the core... because you CAN do it in a custom theme...

yes, that means that you need to define a custom template for Display.template.php, but that is the power of the SMF templating system.... and why should it be added to the core when it can be done in a theme and MOST themers would never use it to begin with?

I see your point. Although my point was that it was EASIER for themer's with it added to the core, not that it couldn't be done. As far as you saying it wouldn't be used much by designer's isn't true in my opinion. I think it would be abused, by REAL designers. Not by those designer's that simply change a few colors and that's it.

However, it CAN be worked around and as pointed out, but I'm starting to see there isn't much trade-off by adding another selector versus code needed to make this happen. For a topic selector that is...

For a sticky, locked, and announcement selectors, I still see so much potential to having this feature with both JS and CSS. It should be a shame not to have it.

You also have to keep in mind that sometimes designer's don't know what to do with it, until it's available. Without it being available, no designer will take the time to try and do anything with it. I know with WP, body selector's get used ALOT.

News:

More <body> classes