| |
@@ -28,16 +28,15 @@
|
| |
<ul class="nav nav-stacked">
|
| |
<li><a>Packets sent: <b>{{ packets_sent }}</b></a></li>
|
| |
{% url 'messaging:send' as url %}
|
| |
- <li role="presentation" {% if url in request.path %}class="active"{% endif %}><a href="{{ url }}">Send some happiness!</a></li>
|
| |
+ <li role="presentation" {% ifequal request.path url%}class="active"{% endif %}><a href="{{ url }}">Send some happiness!</a></li>
|
| |
{% url 'messaging:start' as url %}
|
| |
- <li role="presentation" {% if url in request.path %}class="active"{% endif %}><a href="{{ url }}">What are Happiness Packets?</a></li>
|
| |
+ <li role="presentation" {% ifequal request.path url%}class="active"{% endif %}><a href="{{ url }}" >What are Happiness Packets?</a></li>
|
| |
{% url 'messaging:inspiration' as url %}
|
| |
- <li role="presentation" {% if url in request.path %}class="active"{% endif %}><a href="{{ url }}">Get inspired</a></li>
|
| |
+ <li role="presentation" {% ifequal request.path url%}class="active"{% endif %}><a href="{{ url }}" >Get inspired</a></li>
|
| |
{% url 'messaging:faq' as url %}
|
| |
- <li role="presentation" {% if url in request.path %}class="active"{% endif %}><a href="{{ url }}">FAQ</a></li>
|
| |
+ <li role="presentation" {% ifequal request.path url%}class="active"{% endif %}><a href="{{ url }}" >FAQ</a></li>
|
| |
{% url 'messaging:archive' as url %}
|
| |
- <li role="presentation" {% if url in request.path %}class="active"{% endif %}><a href="{{ url }}">Happiness Archive</a></li>
|
| |
- </ul>
|
| |
+ <li role="presentation" {% ifequal request.path url%}class="active"{% endif %}><a href="{{ url }}" >Happiness Archive</a></li>
|
| |
{% if user.is_authenticated %}
|
| |
<form id="logout" action="{% url 'oidc_logout' %}" method="post">
|
| |
{% csrf_token %}
|
| |
To carry out the changes suggested I carried out changes in two files.
a) assets/css/custom.css :- this file holds css changes. for turning the background white of a selected hyperlink and
turning the text in the hyperlink to blue and bold.
b) template/base.html :- this file hold the logic to change the class and id of various list element present on the page
in order to carry out the desired effect. the hyperlink which is under selection its class is been changed and id is
been assigned to the hyperlink of that class in order to change the background color and text-weight and color.
Why this change is helpful?
This change will help the user to understand which hyperlink from the sidebar is under selection.
What do you think is the outcome of this change?
Only the tab under selection is been highlighted and other tab are not.
Open for review.