[Neos] [Poll] Naming conventions on CSS class names

[Aske Ertmann]

Hi Thomas

> so this is "just" a convention so everyone could do it as he likes... right?
Right.

We're on the verge of chartering into something different here. I think it's a related topic, but not really the same. If we want to make everything configurable with TypoScript then we need to think about this, but this is more about a naming convention. I wouldn't want it too be so flexible, but rather encourage users to use their own templates if they need more custom stuff.

We also have a Tag TypoScript object in review that will be able to do stuff like this, which could then be used.

Greetings
Aske

On 08/10/2013, at 11.53, Thomas Allmer wrote:

> On 08.10.2013 10:22, Robert Lemke wrote:
>> Hi Sebastian,
>> 
>> Sebastian Kurfürst wrote:
>>> it turns out it's very important to override CSS class names from within
>>> TypoScript, without adjusting the Fluid templates behind them.
>>> 
>>> Now, the question is how to name this property in TypoScript. You'll
>>> find the corresponding changeset at [1], with the discussion of the
>>> current options at [2]. Please go to the following Doodle and vote for
>>> the options you like most:
>> 
>> Since we are in TypoScript scope we need to make it very clear which
>> "class" is meant (because of @class).
>> 
>> How about htmlClass / htmlClassName?
>> 
>> And consequently imageHtmlClass / imageHtmlClassName?
>> 
>> It's a bit more verbose, but bullet proof.
> 
> so this is "just" a convention so everyone could do it as he likes... right?
> 
> But as always it's good to have a best practise :)
> 
> and as there might be multible html Classes used for different tags I would sugguest something like a css path / xpath mix to it?
> 
> div[class] = 'container'
> div.img[class] = 'right-image'
> 
> so you could even use
> div[style] = 'padding: 2px;'
> 
> yeah but the [] is not really Typoscript..
> 
> so how about
> div.additionalAttributes.class = 'container'
> div.img.additionalAttributes.class = 'right-image'
> div.additionalAttributes.style = 'padding: 2px;"
> 
> So the first "Part" would be some sort of xpath and then use additionalAttributes like you are "used" from the viewhelpers?
> 
> or how would you handle style or custom data-* if you "just" use htmlClass... would there be htmlStyle as well?
> 
> div.htmlClass = 'container'
> div.img.htmlClass= 'right-image'
> div.htmlStyle = 'padding: 2px;'
> => to lower case?
> div.style = 'padding: 2px;'
> div.htmlDataStuff = 'stuff';
> => will be "converted" to data-stuff="stuff"?
> 
> 
> I would vote for 'additionalAttributes' or 'html' or 'htmlAttributes'...
> in fact that looks pretty nice...
> 
> div.htmlAttributes.class = 'container'
> div.img.htmlAttributes.data-stuff = 'stuff'
> 
> using that we may even have the possibility to do some "magic" in the fluidtemplate
> 
> either use it "normally"
> <div class="{div.htmlAttributes.class}" style="{div.htmlAttributes.style}"> ... </div>
> 
> or do some "magic":
> <div {f:htmlAttributes(attributes: div.htmlAttributes)}>
> 
> so what do you think?
> 
> cheers
> -- 
> thomas allmer für moodley
> mail: thomas.allmer at moodley.at
> telefon: +43 (0) 1 581 08 75
> www.moodley.at
> moodley brand identity gmbh
> belvederegasse 26, A-1040 wien
> fn 275953 p, atu 62465914
> _______________________________________________
> Neos mailing list
> Neos at lists.typo3.org
> http://lists.typo3.org/cgi-bin/mailman/listinfo/neos