Change templates

- Add legend for question navigator in quiz
- Fix button position in add exercise
- Fix UI in preview question paper, quit, complete, show questions

7 files changed, 61 insertions, 33 deletions

diff --git a/yaksh/templates/exam.html b/yaksh/templates/exam.html
index d59674c..a773076 100644
--- a/yaksh/templates/exam.html
+++ b/yaksh/templates/exam.html
@@ -14,17 +14,17 @@
 
     <div class="collapse navbar-collapse" id="navbarColor01">
       <div class="row ml-auto">
-        <div class="col-md-6">
+        <div class="col-md-4">
           <span class="time-div nav-item" id="time_left"></span>
         </div>
-        <div class="col-md-6">
+        <div class="col-md-7">
           <form id="logout" action="{% url 'yaksh:quit_quiz' paper.attempt_number module.id paper.question_paper.id course.id %}" method="post" class="ml-auto">
             {% csrf_token %}
             <span class="nav-item"><button class="btn btn-danger btn-lg" type="submit" name="quit">
               {% if paper.questions_unanswered.all %}
-                Quit {{ quiz_type }}
+                Quit {{quiz_type}}
               {% else %}
-                Finish {{ quiz_type }}
+                Finish {{quiz_type}}
               {% endif %}
             <i class="fa fa-power-off"></i></button></span>
           </form>
@@ -45,39 +45,44 @@
         {{ paper.question_paper.quiz.description }}</h4>
       </center>
       <hr>
-      <center><p>Question Navigator</p></center>
+      <center><p><b><u>Question Navigator</b></u></p></center>
+      <br>
       <div class="justify-content-center">
         {% for qid in paper.get_all_ordered_questions %}
           {% if paper.question_paper.quiz.allow_skip %}
             {% if qid in paper.get_questions_unanswered %}
               {% if qid.id == question.id %}
               <a class="active btn btn-outline-primary " href="#"data-toggle="tooltip"
-                  title="{{ qid.description|striptags }}" style="width: 50px"
+                  title="{{ qid.description|striptags|truncatechars:100 }}" style="width: 50px"
                   onclick="call_skip('{{ URL_ROOT }}/exam/{{ question.id }}/skip/{{ qid.id }}/{{ paper.attempt_number }}/{{ module.id }}/{{ paper.question_paper.id }}/{{course.id}}/')">{{ forloop.counter }}</a>
               {% else %}
-              <a class=" btn btn-outline-primary " href="#" data-toggle="tooltip" title="{{ qid.description|striptags }}" style="width: 50px"
+              <a class=" btn btn-outline-primary " href="#" data-toggle="tooltip" title="{{ qid.description|striptags|truncatechars:100 }}" style="width: 50px"
                   onclick="call_skip('{{ URL_ROOT }}/exam/{{ question.id }}/skip/{{ qid.id }}/{{ paper.attempt_number }}/{{ module.id }}/{{ paper.question_paper.id }}/{{course.id}}/')">{{ forloop.counter }}</a>
               {% endif %}
             {% endif %}
             {% if qid in paper.get_questions_answered %}
-            <a class="btn btn-info" href="#" data-toggle="tooltip" style="width: 50px"
+            <a class="btn btn-success" href="#" data-toggle="tooltip" style="width: 50px"
             onclick="call_skip('{{ URL_ROOT }}/exam/{{ question.id }}/skip/{{ qid.id }}/{{ paper.attempt_number }}/{{ module.id }}/{{ paper.question_paper.id }}/{{course.id}}/')"
-            title="{{ qid.description }}">{{ forloop.counter }}</a>
+            title="{{ qid.description|striptags|truncatechars:100 }}">{{ forloop.counter }}</a>
             {% endif %}
           {% else %}
             {% if qid.id == question.id %}
-            <a class="active btn btn-outline-primary" data-toggle="tooltip" title="{{ qid.description|striptags }}" style="width: 50px">{{ forloop.counter }}</a>
+            <a class="active btn btn-outline-primary" data-toggle="tooltip" title="{{ qid.description|striptags|truncatechars:100 }}" style="width: 50px">{{ forloop.counter }}</a>
             {% elif qid in paper.get_questions_answered %}
-            <a class="btn btn-outline-primary" href="#" data-toggle="tooltip" style="width: 50px"
+            <a class="btn btn-success" href="#" data-toggle="tooltip" style="width: 50px"
             onclick="call_skip('{{ URL_ROOT }}/exam/{{ question.id }}/skip/{{ qid.id }}/{{ paper.attempt_number }}/{{ module.id }}/{{ paper.question_paper.id }}/{{course.id}}/')"
-            title="{{ qid.description }}">{{ forloop.counter }}</a>
+            title="{{ qid.description|striptags|truncatechars:100 }}">{{ forloop.counter }}</a>
             {% else %}
-            <a class="btn btn-outline-primary" style="width: 50px" data-toggle="tooltip" title="{{ qid.description|striptags }}">{{ forloop.counter }}</a>
+            <a class="btn btn-outline-primary" style="width: 50px" data-toggle="tooltip" title="{{ qid.description|striptags|truncatechars:100 }}">{{ forloop.counter }}</a>
             {% endif %}
           {% endif %}
         {% endfor %}
       </div>
       <br>
+      <p><span class="btn btn-success"></span> Attempted question(s)</p>
+      <p><span class="btn btn-primary"></span> Current question</p>
+      <p><span class="btn btn-outline-primary"></span> Unattempted question(s)</p>
+      <br>
       <div>
         <p class="text-center">Question(s) left: <b>{{ paper.questions_left }}</b></p>
       </div>
diff --git a/yaksh/templates/yaksh/add_exercise.html b/yaksh/templates/yaksh/add_exercise.html
index c1813bf..d3d9068 100644
--- a/yaksh/templates/yaksh/add_exercise.html
+++ b/yaksh/templates/yaksh/add_exercise.html
@@ -1,6 +1,7 @@
 {% extends "manage.html" %}
 {% load static %}
 
+{% block title %}Add Exercise{% endblock %}
 {% block subtitle %}Add Exercise{% endblock %}
 
 {% block css %}
@@ -48,6 +49,7 @@
             </button>
         </center>
     </form>
+    <br>
     {% if exercise and course_id %}
         {% if exercise.questionpaper_set.get.id %}
         <center>
diff --git a/yaksh/templates/yaksh/complete.html b/yaksh/templates/yaksh/complete.html
index f5bf444..df76e13 100644
--- a/yaksh/templates/yaksh/complete.html
+++ b/yaksh/templates/yaksh/complete.html
@@ -1,5 +1,8 @@
 {% extends "base.html" %}
 {% load static %}
+
+{% block title %} Complete Quiz {% endblock %}
+
 {% block nav %}
 <nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top">
     <a class="navbar-brand" href="{% url 'yaksh:index' %}">
@@ -10,7 +13,7 @@
 
 {% block content %}
 <br>
-{% if module_id and not paper.question_paper.quiz.is_trial %}
+{% if module_id and not paper.course.is_trial %}
 <center>
     <div class="alert alert-info col-md-8">
         Note:- Please Click on the Next button to submit the quiz. Please do not close the browser without clicking Next.
diff --git a/yaksh/templates/yaksh/preview_questionpaper.html b/yaksh/templates/yaksh/preview_questionpaper.html
index d6391e1..72355ea 100644
--- a/yaksh/templates/yaksh/preview_questionpaper.html
+++ b/yaksh/templates/yaksh/preview_questionpaper.html
@@ -1,24 +1,33 @@
 {% extends "base.html" %}
 
+{% block title %} Preview Question paper {% endblock title %}
 {% block pagetitle %} Quiz: {{ paper.quiz.description }} {% endblock pagetitle %}
 
 {% block content %}
-<div class="yakshwell container">
+<div class="container">
 <div class="card">
-	<div class="col-md-12 card-body">
-		<div class="col-md-6">Maximum Mark(s): {{ paper.total_marks }}</div>
-		<div class="col-md-6"><span class="pull-right">Total Time: {{ paper.quiz.duration }} minutes</span></div>
-	</div>
+    <div class="card-body">
+        <div class="row">
+            <div class="col-md-6">Maximum Mark(s): {{ paper.total_marks }}</div>
+            <div class="col-md-6">
+                <span class="pull-right">
+                    Total Time: {{ paper.quiz.duration }} minutes
+                </span>
+            </div>
+        </div>
+    </div>
 </div>
+<br>
 <div class="card">
-	<div class="card-heading">Instructions</div>
-	<div class="card-body" id="instructions">
-		{{ paper.quiz.instructions|safe }}
-	</div>
+    <div class="card-header">Instructions</div>
+    <div class="card-body" id="instructions">
+        {{ paper.quiz.instructions|safe }}
+    </div>
 </div>
+<br>
 {% for question in questions %}
     <div class="card">
-        <div class="card-heading yakshlabel">
+        <div class="card-header">
             <strong> {{forloop.counter}}. {{ question.summary }} 
             <span class="marks pull-right"> Mark(s): {{ question.points }} </span>
             </strong>
@@ -39,6 +48,7 @@
             
         </div>
     </div>
+    <br>
 {% endfor %}
 </div>
 {% endblock %}
diff --git a/yaksh/templates/yaksh/question.html b/yaksh/templates/yaksh/question.html
index 9119c70..74343f8 100644
--- a/yaksh/templates/yaksh/question.html
+++ b/yaksh/templates/yaksh/question.html
@@ -205,11 +205,12 @@ question_type = "{{ question.type }}"
         {% if quiz.is_exercise %}
           <div>
             {% if can_skip %}
-              <div class = "card col-md-8" id="solution">
+              <div id="solution">
             {% else %}
               <div id="solution" style="display:none">
             {% endif %}
             {% if question.solution %}
+            <br>
             <h4><u> Solution by teacher</u></h4>
             {% endif %}
             <font size=3 face=arial> {{ question.solution|safe }} </font>
@@ -296,7 +297,7 @@ question_type = "{{ question.type }}"
           {% if question.type == "code" %}
             <div class="row align-items-center">
               <div class="col-md-9">
-                <h5>Write your program below:</h5>
+                <h4>Write your program below:</h4>
               </div>
               <div class="col-md-3 ml-auto">
                 <a href="#answer" class=" btn btn-outline-primary" onclick="confirm()" name="reset" id="reset">Undo Changes&nbsp;<span class="fa fa-refresh"></span></a>
diff --git a/yaksh/templates/yaksh/quit.html b/yaksh/templates/yaksh/quit.html
index 7429436..ccb0893 100644
--- a/yaksh/templates/yaksh/quit.html
+++ b/yaksh/templates/yaksh/quit.html
@@ -1,6 +1,8 @@
 {% extends "base.html" %}
 {% load static %}
 
+{% block title %} Quit Quiz {% endblock %}
+
 {% block nav %} 
 <div class="container-fluid yakshnav">
   <nav class="navbar fixed-top navbar-expand-lg yakshheading yakshnav">
diff --git a/yaksh/templates/yaksh/showquestions.html b/yaksh/templates/yaksh/showquestions.html
index afd2ad9..f9fac96 100644
--- a/yaksh/templates/yaksh/showquestions.html
+++ b/yaksh/templates/yaksh/showquestions.html
@@ -14,9 +14,9 @@
 {% block content %}
 <div class="container">
   <!-- Side bar -->
-  <div class="nav nav-pills" id="sidebar" role="tablist" aria-orientation="vertical">
+  <div class="nav nav-pills" role="tablist" aria-orientation="vertical">
     <a href="#show" id="showbar" class="nav-link active"  data-toggle="pill" role="tab" aria-controls="show" aria-selected="true"> Show all Questions</a>
-    <a href="#updown" id="updownbar" class="nav-link" data-toggle="pill" role="tab" aria-controls="updown" aria-selected="false" > Upload and Download Questions</a>
+    <a href="#updown" id="updownbar" class="nav-link" data-toggle="pill" role="tab" aria-controls="updown" aria-selected="false" > Upload Questions</a>
   </div>
   <!-- End of side bar -->
   <div class="tab-content">
@@ -49,7 +49,7 @@
         <form action="" method="post"  enctype="multipart/form-data">
           {% csrf_token %}
             <div class="form-group col-md-6">
-                <a class="btn btn-lg btn-primary" href="{% url 'yaksh:download_yaml_template' %}">
+                <a class="btn btn-info" href="{% url 'yaksh:download_yaml_template' %}">
                   <i class="fa fa-download"></i>&nbsp;Download Template</a>
                 <br><br>
                 <h4> Or </h4>
@@ -61,8 +61,10 @@
                             Choose file
                         </label>
                     </div>
+                    <div class="input-group-append">
+                      <button class="btn btn-outline-primary" type="submit" name="upload" value="upload"><i class="fa fa-upload"></i>&nbsp;Upload File</button>
+                    </div>
                 </div>
-                <button class="btn btn-lg btn-success" type="submit" name="upload" value="upload"><i class="fa fa-upload"></i>&nbsp;Upload File</button>
             </div>
             <script>
                 $('#id_file').on('change',function(){
@@ -138,11 +140,14 @@
                     {% endif %}
                   </select>
                 </div>
+                <br><br>
+                <div class="col-md-6">
+                  <a class="btn btn-primary" href="{% url 'yaksh:show_questions' %}">
+                    Clear Filters
+                  </a>
+                </div>
               </div>
             </div>
-            <br/>
-            <a class="btn btn-lg btn-primary" href="{% url 'yaksh:show_questions' %}">
-             Clear Filters</a>
           </div>
         </div>
         <div id="filtered-questions">