collection-crud/templates/header.html.twig

<div class="top-bar">
	<div class="top-bar-left">
		<ul class=" dropdown menu" data-dropdown-menu>
			<li class="menu-text">Collection CRUD</li>
			<li class="mega-menu">
				<a data-toggle="computer-menu" href="#">Computer Related</a>

				<div class="dropdown-pane bottom" id="computer-menu" data-dropdown data-options="closeOnClick:true; hover: true; hoverPane: true; vOffset:11">
					<div class="row expanded">
						<ul class="menu">
							<li class="{{ route starts with 'cpu_' ? 'is-active' }}">
								<a href="{{ path('cpu_index') }}">🧠 CPUs</a>
							</li>
							<li class="{{ route starts with 'fpu_' ? 'is-active' }}">
								<a href="{{ path('fpu_index') }}">🧮 FPUs</a>
							</li>
							<li class="{{ route starts with 'gpu_' ? 'is-active' }}">
								<a href="{{ path('gpu_index') }}">🎮 GPUs</a>
							</li>
							<li class="not-implemented {{ route starts with 'motherboard_' ? 'is-active' }}">
								<a href="#">🤰 Motherboards</a>
							</li>
							<li class="not-implemented">
								<a href="#">🖥️ Systems</a>
							</li>
						</ul>
						<ul class="menu">
							<li class="menu-text">Meta</li>
							<li class="{{ route starts with 'brand_' ? 'is-active' }}">
								<a href="{{ path('brand_index') }}">🕺 Brands</a>
							</li>
							<li class="{{ route starts with 'brand-category_' ? 'is-active' }}">
								<a href="{{ path('brand-category_index') }}">💃 Brand Categories</a>
							</li>
							<li class="{{ route starts with 'chipset_' ? 'is-active' }}">
								<a href="{{  path('chipset_index') }}">🧩 Chipsets</a>
							</li>
							<li class="{{ route starts with 'gpu-core' ? 'is-active' }}">
								<a href="{{ path('gpu-core_index') }}">🌀 GPU Cores</a>
							</li>
							<li class="{{ route starts with 'socket_' ? 'is-active' }}">
								<a href="{{ path('socket_index') }}">📍Sockets</a>
							</li>
						</ul>
					</div>
				</div>
			</li>
			<li class="mega-menu">
				<a data-toggle="photo-menu" href="#">Photography</a>

				<div class="dropdown-pane bottom" id="photo-menu" data-dropdown data-options="closeOnClick:true; hover: true; hoverPane: true; vOffset:11">
					<div class="row expanded">
						<div class="column">
							<ul class="menu">
								<li class="menu-text">Currently Owned</li>
								<li class="{{ route starts with 'camera_' ? 'is-active' }}">
									<a href="{{ path('camera_index') }}">📷 Cameras</a>
								</li>
								<li class="{{ route starts with 'flash_' ? 'is-active' }}">
									<a href="{{ path('flash_index') }}">📸 Flashes</a>
								</li>
								<li class="{{ route starts with 'lens_' ? 'is-active' }}">
									<a href="{{ path('lens_index') }}">🔎 Lenses</a>
								</li>
							</ul>
						</div>
						<div class="column">
							<ul class="menu">
								<li class="menu-text">Previously Owned</li>
								<li class="{{ route starts with 'previously-owned-camera' ? 'is-active' }}">
									<a href="{{ path('previously-owned-camera_index') }}">📷 Cameras</a>
								</li>
								<li class="{{ route starts with 'previously-owned-flash' ? 'is-active' }}">
									<a href="{{ path('previously-owned-flash_index') }}">📸 Flashes</a>
								</li>
								<li class="{{ route starts with 'previously-owned-lens' ? 'is-active' }}">
									<a href="{{ path('previously-owned-lens_index') }}">🔎 Lenses</a>
								</li>
							</ul>
						</div>
						<div class="column">
							<ul class="menu">
								<li class="menu-text">Meta</li>
								<li class="{{ route starts with 'film_' ? 'is-active' }}">
									<a href="{{ path('film_index') }}">🎞️ Film</a>
								</li>
								<li class="{{ route starts with 'camera-type_' ? 'is-active' }}">
									<a href="{{ path('camera-type_index') }}">🎥 Camera Types</a>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</li>
		</ul>
	</div>
</div>

{% for message in app.flashes('notice') %}
	<div class="small callout flash-notice">
		{{ message }}
	</div>
{% endfor %}

{% for message in app.flashes('error') %}
	<div class="small callout alert flash-error">
		{{ message }}
	</div>
{% endfor %}