<public:component>
<public:attach event="onpropertychange" onevent="moreArrow()" />
<script type="text/javascript">
	function moreArrow() {
		var doc, style, styleText, fontSize, height, arrow;

		doc = window.document;

		if ((navigator.userAgent.replace(/.*MSIE\s(\d+).*/i, '$1') > 8) && !doc.getElementById('more-arrow-htc')) {
			style = doc.createElement('style');
			styleText = doc.createTextNode('.more:after { display:none; }');
			style.id = 'more-arrow-htc';
			doc.head.appendChild(style);
			style.appendChild(styleText);
		}

		fontSize = parseInt(element.currentStyle.fontSize, 10);
		height = Math.floor(fontSize * 0.6);

		arrow = document.createElement('img');
		arrow.className = 'arrow';
		arrow.src = 'http://images.apple.com/v/ios/carplay/a/images/more.png';
		arrow.style.cssText = 'padding-left:.35em; width:auto; height:' + height + 'px;';
		element.appendChild(arrow);
	}
	moreArrow();
</script>
</public:component>
