Tertiary color Style Properties?

[Trombones13]

This is just a question of curiosity more than anything else... Is it (or would it be) possible to add @tertiary Style Properties for the Color Palette somehow? I think it would make color customization easier on styles that are using variants of more than two colors and have to insert those with hex codes instead of Style Properties. Food for thought, I suppose.

 

[Shadab]

 

[Paul B]

I made a suggestion for this as it would suit me perfectly, due to using variants of 2 colours for my theme.

http://xenforo.com/community/threads/add-extra-colours-to-the-colour-palette.9387/

Is that just a mockup Shadab or...?

 

[Shadab]

Not a mockup! Just tried it.
You need to be in debug mode to enable all the goodies.

If you edit the Master Style's Color Palette, you can associate the color palette to an addon. And if you edit any child style, the palette would get attached to that particular style (and its descendants) only.

1. Go to: Appearance » Styles » Style Properties (for your theme, or master) » Color Palette
2. Click the "+Create New Property" button on the top right of the page

If you're editing Master Style:


Or, for any other style:

 

[Shadab]

Thought I'd play a bit more with these "custom" color palettes.

» Create a new css template (via Master Style):

.helloworld {
	font-size: 15px;
	font-family: Georgia, serif;
	font-style: italic;
}

.helloworld .test1 {
	color: @tertiaryDark;
}

.helloworld .test2 {
	color: @tertiaryMedium;
}

.helloworld .test3 {
	color: @tertiaryLight;
}

.helloworld .test4 {
	color: @tertiaryDark;
	border: 1px solid @tertiaryMedium;
	background: @tertiaryLight;
	padding: 5px 10px;
	text-shadow: 1px 1px 2px #ffffff;
}

» Then setup a new page node, with the following template html:

<xen:require css="helloworld_test.css" />

<div class="baseHtml messageHtml helloworld">
	<p class="test1">
		Lorem ipsum dolor sit amet, consectetur adipiscing elit.
		In nisl diam, auctor at accumsan dapibus, tempus ut elit.
		Sed est leo, vestibulum ac mattis sit amet, laoreet et enim.
	</p>
	<p class="test2">
		Mauris nec velit ac arcu scelerisque lacinia eget sed magna.
		Morbi tincidunt fermentum gravida. Ut tellus diam, dictum et
		elementum sit amet, luctus vehicula neque. Sed nec sapien mauris.
	</p>
	<p class="test3">
		Etiam rhoncus, libero vel tincidunt auctor, nibh nunc tristique lacus,
		quis vehicula odio elit in mauris. Cras in metus elit, id condimentum ligula.
		Sed quis quam sem, non posuere odio. Morbi aliquam gravida justo.
	</p>
	<p class="test4">
		Etiam rhoncus, libero vel tincidunt auctor, nibh nunc tristique lacus,
		quis vehicula odio elit in mauris. Cras in metus elit, id condimentum ligula.
		Sed quis quam sem, non posuere odio. Morbi aliquam gravida justo.
	</p>
</div>

And then play with the slider, invert, etc. functions available on the color palette page...

 

[Trombones13]

Awesome! I was wondering if that was possible to do in debug mode. I'll have to get my server-side permissions adjusted so I can edit config and try that out. Thanks!

 

[Trombones13]

Worked like a charm; thanks again!
(p.s. the Display Order affects the order of each color within the sub group as opposed to the order of the sub groups themselves, right?)