style not copied to first block that is dragged into the editor

[InfGame]

I have made a Template where you can change the color globally using a drop down to chose from specific color scheme

I've noticed tho that on the first block (doesn't matter which type of block) i drag into the editor the colors seem to be set separate from the others.

I've noticed a little box icon next to the drop down of that block. When i click on it it disappears and everything works as it should. I don't know where it comes from the since it happens on any block that is dragged in first.

[bago]

Do you see this on the default template bundled with mosaico or using mosaico.io ? otherwise if this is an issue in your custom template then without the code to reproduce the issue I can't tell anything.

[InfGame]

Your templates on mosaico.io use the color propety while i use a dropdown with specifficly declared colors. I there fore i can not seem to recreate it. tho. if you need some code to recreate it like the template. i may be able to make an example template of how it was made.

[bago]

"if you need some code to recreate it like the template. i may be able to make an example template of how it was made.": yes please. If I can't reproduce it and I don't see the code that create the issue I can only close this.

[InfGame]

example.txt

I made a version of the exact template i am using. its a .txt though. you need to rename it to a .htmml

Hope this will help you recreate the issue

[bago]

I this I can guess your issue now. You never define a default value for the "colorStyle" property. So, mosaico loads thinking it has null value, but then, as soon as you place a block in the editing area mosaico have to create the editing widget and creates a select element to choose the "colorStyle", but this select only supports "Red|Green|Blue|DarkBlue|Oliv", so none of them matches the expected value. It tries to select "null", but it can't find it, so the select fallbacks to selecting "Red" and this is applied backward, and this breaks things.

I just tried adding "-color-style: Red; -ko--color-style: @colorStyle; " to the first style where you use colorStyle and this way mosaico can find a default value for colorStyle and everything works again:

        <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="-color-style: Red; -ko--color-style: @colorStyle; width: 100%; background-color: #9e0529; -ko-background-color: @[colorStyle == 'Green' ? '#38713f' : colorStyle == 'Blue' ? '#286f9c' : colorStyle == 'DarkBlue' ? '#00436b' : colorStyle == 'Oliv' ? '#535c46' : '#9e0529'];" 

Another options, instead of this kind of hack, is to declare the value for the colorStyle, e.g:

      eventNameBlock {  <-- eventNameBlock and not EventNameBlock
        label: Text Block;
        properties: colorStyle=Red backgroundColor;
      }

(the properties declaration also let you sort the editing widgets)

I thought mosaico complained when it cannot find the default value for a variable, but I don't see complaints when loading your template, so I'll have to double check.

[bago]

PS: I encourage using key=label "options", so, instead of:

options: Red|Green|Blue|DarkBlue|Oliv;

Preferred way:

options: red=Red|green=Green I really like|blue=Blue|darkblue=Dark Blue|oliv=Olive;

This way your template code will use keys and you will never change that keys. At the same time you can change the dropdown labels without altering the template model definition and without breaking model compatibility.

[InfGame]

this has fixed the problem. thank you.