<xf:macro name="altColumn">
	<div class="uix_megaMenu__col uix_megaMenu__col--alt">
		<div class="block-body">
			<a href="" class="uix_megaMenu__iconLink blockLink">
				<i class="mdi mdi-account-multiple"></i>
				<span>Support UI.X</span>
			</a>
			<a href="#" class="uix_megaMenu__iconLink blockLink">
				<i class="mdi mdi-account-multiple"></i>
				<span>Donate</span>
			</a>
			<a href="#" class="uix_megaMenu__iconLink blockLink">
				<i class="mdi mdi-account-multiple"></i>
				<span>Contact us</span>
			</a>
		</div>
		<div class="block-body">
			<div class="uix_megaMenu__listLabel blockLink">Main Links</div>
			<a href="{{ link('forums') }}" class="blockLink">{{ phrase('forums')}}</a>
			<a href="{{ link('articles') }}" class="blockLink">{{ phrase('articles')}}</a>
		</div>
	</div>
</xf:macro>

<xf:macro name="uix_megaMenu" menu="!">
	<xf:css src="uix_megaMenu.less" />
	<div class="uix_megaMenu">
		<div class="pageContent">
			<div class="uix_megaMenu__content uix_megaMenu__content--thxlink_12">
				<div class="uix_megaMenu__row">
					<div class="uix_megaMenu__col">
						<h2 class="uix_megaMenu__title">Blog</h2>
					</div>
					<div class="uix_megaMenu__col">
						<div class="block-minorHeader">Categories</div>
						<div class="block-body">
							<a href="#" class="blockLink">Category 1</a>
							<a href="#" class="blockLink">Category 2</a>
							<a href="#" class="blockLink">Category 3</a>
							<a href="#" class="blockLink">Category 4</a>
						</div>
					</div>
					<div class="uix_megaMenu__col">
						<div class="block-minorHeader">Categories</div>
						<div class="block-body">
							<a href="#" class="blockLink">Category 1</a>
							<a href="#" class="blockLink">Category 2</a>
							<a href="#" class="blockLink">Category 3</a>
							<a href="#" class="blockLink">Category 4</a>
						</div>
					</div>
					<xf:macro name="altColumn" />
				</div>
			</div>
		</div>
	</div>
</xf:macro>