Liferay - set custom css class from theme

custom_css_class.js

//replace LINK_ID

//Add this to your theme vm
<div id="LINK_ID">
	<a href="javascript:;" data-customCssClass="red">Red</a>
	<a href="javascript:;" data-customCssClass="blue">Blue</a>
	<a href="javascript:;" data-customCssClass="green">Green</a>
</div>

//Add this to your JS somewhere
A.one('#LINK_ID').delegate(
	'click',
	function(event){
		var cssClass = event.currentTarget.attr('data-customCssClass');

		if (cssClass) {
			A.io.request(
				themeDisplay.getPathMain() + '/portal/session_click',
				{
					data: {
						'theme_custom_css_class': cssClass
					}
				}
			);
		}
	},
	'a'
);

// Add this to custom.vm
#set ($theme_custom_css_class = $getterUtil.getString($sessionClicks.get($request, "theme_custom_css_class", "")))

#if ($panelsMinimized != "")
	#set ($css_class = "${css_class} $theme_custom_css_class")
#end