mirror of
https://github.com/kevinveenbirkenbach/coding-challenge-online-shop.git
synced 2025-09-10 20:07:12 +02:00
Implemented color filters to navbar
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
{% extends "base.html.twig" %}
|
||||
{% block body %}
|
||||
{% include 'frames/structure/navbar.html.twig' with menu_items %}
|
||||
<br />
|
||||
<div class="container">
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
|
@@ -1,32 +1,34 @@
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
||||
<a class="navbar-brand" href="/">Online Shop</a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
{% for item in menu_items %}
|
||||
<!--<li class="nav-item active">
|
||||
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
|
||||
</li>
|
||||
-->
|
||||
<li class="nav-item {% if item.active %}active{% endif %}">
|
||||
<a class="nav-link" href="{{ item.url }}">{{ item.name }}</a>
|
||||
</li>
|
||||
<!--
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Dropdown
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<a class="dropdown-item" href="#">Action</a>
|
||||
<a class="dropdown-item" href="#">Another action</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a class="dropdown-item" href="#">Something else here</a>
|
||||
</div>
|
||||
</li>
|
||||
-->
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
<a class="navbar-brand" href="/">Online Shop</a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse"
|
||||
data-target="#navbarSupportedContent"
|
||||
aria-controls="navbarSupportedContent" aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
{% for item in menu_items %}
|
||||
{% if item.name %}
|
||||
{% if item.url %}
|
||||
<li class="nav-item {% if item.active %}active{% endif %}"><a
|
||||
class="nav-link" href="{{ item.url }}"> {{ item.name }}
|
||||
</a></li>
|
||||
{% elseif item.toArray %}
|
||||
<li class="nav-item dropdown"><a
|
||||
class="nav-link dropdown-toggle" href="#" id="navbarDropdown"
|
||||
role="button" data-toggle="dropdown" aria-haspopup="true"
|
||||
aria-expanded="false"> {{ item.name }}
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
{%for link in item %}
|
||||
<a class="dropdown-item {% if link.active %}active{% endif %}" href="{{ link.url }}">{{ link.name }}</a>
|
||||
{% endfor %}
|
||||
</div></li>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
@@ -1,17 +1,6 @@
|
||||
{% extends 'frames/default.html.twig' %}
|
||||
{% block title %}product overview{% endblock %}
|
||||
{% block content %}
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
filter by color:
|
||||
</button>
|
||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
|
||||
{% for color in colors %}
|
||||
<a class="dropdown-item" href="{{ color.getUrl }}">{{ color.getName }}</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<div class="card-columns">
|
||||
{% for product in products %}
|
||||
<div class="card" style="width: 18rem;">
|
||||
|
Reference in New Issue
Block a user