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

Thomas Allmer d4kmor at gmail.com
Tue Oct 8 14:08:16 CEST 2013


On 08.10.2013 12:09, Aske Ertmann wrote:
> 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.

true true,

but does it hurt to use
div.htmlAttributes.class = 'container'
div.img.htmlAttributes.class = 'right-image'

instead of
htmlClass = 'container'
imageHtmlClass = 'right-image'
?

when u get a more "logic" buildup that you may or may not use later?


On 08.10.2013 12:09, Aske Ertmann wrote:> 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
 >

-- 
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


More information about the Neos mailing list