Change courses page with new UI

14 files changed, 330 insertions, 563 deletions

diff --git a/yaksh/forms.py b/yaksh/forms.py
index aa4d7b9..8cc3d0a 100644
--- a/yaksh/forms.py
+++ b/yaksh/forms.py
@@ -308,6 +308,30 @@ class QuestionFilterForm(forms.Form):
 class CourseForm(forms.ModelForm):
     """ course form for moderators """
 
+    def __init__(self, *args, **kwargs):
+        super(CourseForm, self).__init__(*args, **kwargs)
+        self.fields['name'].widget.attrs.update(
+            {'class': form_input_class, 'placeholder': 'Course Name'}
+        )
+        self.fields['enrollment'].widget.attrs.update(
+            {'class': 'custom-select'}
+        )
+        self.fields['code'].widget.attrs.update(
+            {'class': form_input_class, 'placeholder': 'Course Code'}
+        )
+        self.fields['instructions'].widget.attrs.update(
+            {'class': form_input_class, 'placeholder': 'Course instructions'}
+        )
+        self.fields['start_enroll_time'].widget.attrs.update(
+            {'class': form_input_class, 'placeholder': 'Course Start DateTime'}
+        )
+        self.fields['end_enroll_time'].widget.attrs.update(
+            {'class': form_input_class, 'placeholder': 'Course End DateTime'}
+        )
+        self.fields['grading_system'].widget.attrs.update(
+            {'class': 'custom-select'}
+        )
+
     def save(self, commit=True, *args, **kwargs):
         instance = super(CourseForm, self).save(commit=False)
         if instance.code:
@@ -346,18 +370,24 @@ class ProfileForm(forms.ModelForm):
             user = kwargs.pop('user')
         super(ProfileForm, self).__init__(*args, **kwargs)
         self.fields['first_name'].initial = user.first_name
+        self.fields['first_name'].widget.attrs.update(
+            {'class': form_input_class, 'placeholder': 'First Name'}
+        )
         self.fields['last_name'].initial = user.last_name
+        self.fields['last_name'].widget.attrs.update(
+            {'class': form_input_class, 'placeholder': 'Last Name'}
+        )
         self.fields['institute'].widget.attrs.update(
-            {'class': form_input_class}
+            {'class': form_input_class, 'placeholder': 'Institute'}
         )
         self.fields['department'].widget.attrs.update(
-            {'class': form_input_class}
+            {'class': form_input_class, 'placeholder': 'Department'}
         )
         self.fields['roll_number'].widget.attrs.update(
-            {'class': form_input_class}
+            {'class': form_input_class, 'placeholder': 'Roll Number'}
         )
         self.fields['position'].widget.attrs.update(
-            {'class': form_input_class}
+            {'class': form_input_class, 'placeholder': 'Position'}
         )
         self.fields['timezone'] = forms.ChoiceField(
             choices=[(tz, tz) for tz in pytz.common_timezones],
diff --git a/yaksh/static/yaksh/css/custom.css b/yaksh/static/yaksh/css/custom.css
index 92a1fc7..d0d5c82 100644
--- a/yaksh/static/yaksh/css/custom.css
+++ b/yaksh/static/yaksh/css/custom.css
@@ -26,4 +26,4 @@ body, .dropdown-menu {
 
 #login-btn, #signup-btn, #forgot-btn{
     width: 75%;
-}
\ No newline at end of file
+}
diff --git a/yaksh/static/yaksh/images/yaksh_circular_logo.png b/yaksh/static/yaksh/images/yaksh_circular_logo.png
new file mode 100644
index 0000000..ab5daed
--- /dev/null
+++ b/yaksh/static/yaksh/images/yaksh_circular_logo.png
diff --git a/yaksh/templates/registration/password_change_done.html b/yaksh/templates/registration/password_change_done.html
index ccaf312..9dd04b5 100644
--- a/yaksh/templates/registration/password_change_done.html
+++ b/yaksh/templates/registration/password_change_done.html
@@ -1,4 +1,4 @@
-{% extends "manage.html" %}
+{% extends "base.html" %}
 {% load static %}
 {% block title %} Change Password {% endblock %}
 
diff --git a/yaksh/templates/registration/password_change_form.html b/yaksh/templates/registration/password_change_form.html
index 4b2218f..b4880c6 100644
--- a/yaksh/templates/registration/password_change_form.html
+++ b/yaksh/templates/registration/password_change_form.html
@@ -1,4 +1,4 @@
-{% extends "manage.html" %}
+{% extends "base.html" %}
 
 <!DOCTYPE html>
 {% block pagetitle %} Change Password {% endblock %}
diff --git a/yaksh/templates/yaksh/add_course.html b/yaksh/templates/yaksh/add_course.html
index 64cc9ff..2f584c9 100644
--- a/yaksh/templates/yaksh/add_course.html
+++ b/yaksh/templates/yaksh/add_course.html
@@ -1,32 +1,81 @@
 {% extends "manage.html" %}
+{% load static %}
 
-{% block subtitle %}Add Course{% endblock %}
+{% block title %}Add Course{% endblock %}
 
 {% block css %}
-<link rel="stylesheet" href="{{ URL_ROOT }}/static/yaksh/css/jquery.datetimepicker.css" type="text/css" /> 
+<link rel="stylesheet" href="{% static 'yaksh/css/jquery.datetimepicker.css' %}">
 {% endblock %}
 
 {% block script %}
-<script src="{{ URL_ROOT }}/static/yaksh/js/jquery.datetimepicker.full.min.js"></script>
+<script type="text/javascript" src="{% static 'yaksh/js/jquery.datetimepicker.full.min.js' %}">
+</script>
 {% endblock %}
 
 {% block content %}
-<div class="yakshwell container">
-<form name=frm id=frm action="" method="post" >
-  {% csrf_token %}
-  <center>
-  <table class="table table-bordered table-responsive-sm">
-  {{ form.as_table }}
-  </table>
-  <br/>
-  <script type="text/javascript">
-    $("#id_start_enroll_time").datetimepicker({format: 'Y-m-d H:i:s'});
-    $("#id_end_enroll_time").datetimepicker({format: 'Y-m-d H:i:s'});
-  </script>
-  </center>
+<br><br><br>
+<div class="container">
+    <div class="row">
+        <div class="col-md-8">
+            <ul class="nav nav-pills" id="course_tabs">
+                <li class="nav-item">
+                    <a class="nav-link" href="{% url 'yaksh:courses' %}">
+                        My Courses
+                    </a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="{% url 'yaksh:allotted_courses' %}">
+                        Allotted Courses
+                    </a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link active" href="{% url 'yaksh:add_course' %}">
+                        Add New Course
+                    </a>
+                </li>
+                <li class="nav-item dropdown hide">
+                    <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">More</a>
+                    <div class="dropdown-menu hide" x-placement="bottom-start" style="position: absolute; transform: translate3d(0px, 37px, 0px); top: 0px; left: 0px; will-change: transform;">
+                    <a class="dropdown-item" href="{% url 'yaksh:show_all_quizzes' %}">
+                        View Quizzes
+                    </a>
+                    <a class="dropdown-item" href="{% url 'yaksh:show_all_lessons' %}">
+                        View Lessons
+                    </a>
+                    <a class="dropdown-item" href="{% url 'yaksh:show_all_modules' %}">
+                        View Modules
+                    </a>
+                    <a href="{% url 'grades:grading_systems'%}" class="dropdown-item" >
+                        View Grading Systems
+                    </a>
+                </div>
+                </li>
+            </ul>
+        </div>
+    </div>
+    <hr>
+    <form name=frm id=frm action="" method="post" >
+        {% csrf_token %}
+        <center>
+        <table class="table table-bordered table-responsive-sm">
+        {{ form.as_table }}
+        </table>
+        <br/>
+        <script type="text/javascript">
+            $("#id_start_enroll_time").datetimepicker({format: 'Y-m-d H:i:s'});
+            $("#id_end_enroll_time").datetimepicker({format: 'Y-m-d H:i:s'});
+        </script>
+        </center>
 
-  <center><button class="btn btn-success" type="submit" id="submit" name="questionpaper">Save</button>
-  <button class="btn btn-danger" type="button" name="button" onClick='location.replace("{{URL_ROOT}}/exam/manage/courses");'>Cancel</button> </center>
-</form>
+        <center>
+            <button class="btn btn-success btn-lg" type="submit" id="submit" name="course">
+                Save
+            </button>
+            <a class="btn btn-danger btn-lg" name="button" href="{% url 'yaksh:courses' %}">
+                Cancel
+            </a>
+        </center>
+        <br>
+    </form>
 </div>
 {% endblock %}
diff --git a/yaksh/templates/yaksh/courses.html b/yaksh/templates/yaksh/courses.html
index 4e7a153..4548d33 100644
--- a/yaksh/templates/yaksh/courses.html
+++ b/yaksh/templates/yaksh/courses.html
@@ -1,29 +1,7 @@
 {% extends "manage.html" %}
 {% block title %} Courses {% endblock %}
 {% block pagetitle %} Courses {% endblock pagetitle %}
-{% block script %}
-<script>
-    $(document).ready(function(){
-        $('[data-toggle="tooltip"]').tooltip();
-        $("#link_created_courses").click(function() {
-            if ($("#allotted_courses").is(":visible")){
-                $("#allotted_courses").toggle();
-            }
-            if (!$("#created_courses").is(":visible")){
-                $("#created_courses").toggle();
-            }
-        });
-        $("#link_allotted_courses").click(function() {
-            if ($("#created_courses").is(":visible")){
-                $("#created_courses").toggle();
-            }
-            if (!$("#allotted_courses").is(":visible")){
-                $("#allotted_courses").toggle();
-            }
-        });
-    });
-</script>
-{% endblock %}
+
 {% block css %}
 <style>
     .test + .tooltip.top > .tooltip-inner {
@@ -33,482 +11,140 @@
 </style>
 {% endblock %}
 {% block content %}
-<div class="row">
-    <!-- Side bar -->
-    <div class="col-md-3 yakshlabel collapse" id="sidebar">
-        <div class="nav flex-column nav-pills" role="tablist" aria-orientation="vertical">
-            {% if type == "courses" %}
-              <a href="#sidebarbody" id="link_created_courses" data-toggle="pill" class="nav-link active" role="tab" aria-controls="sidebarbody" aria-selected="true" >My Courses</a>
-              <a href="#sidebarbody" id="link_allotted_courses" class="nav-link" data-toggle="pill" role="tab" aria-controls="sidebarbody" aria-selected="flase" > Allotted Courses</a>
-              {% else %}
-              <a href="{{URL_ROOT}}/exam/manage/courses" class="nav-link"  >View all Courses</a>
-            {% endif %}
-            <a href="{{URL_ROOT}}/exam/manage/add_course" class="nav-link"  >Add New Course</a>
-            <a href="{{URL_ROOT}}/exam/manage/courses/all_quizzes/" class="nav-link" >Add/View Quizzes</a>
-            <a href="{{URL_ROOT}}/exam/manage/courses/all_lessons/" class="nav-link" >Add/View Lessons</a>
-            <a href="{{URL_ROOT}}/exam/manage/courses/all_learning_module" class="nav-link" >Add/View Modules</a>
-            <a href="{% url 'grades:grading_systems'%}" class="nav-link" > Add/View Grading Systems </a>
-       </div>
+<br><br>
+<div class="container-fluid">
+    <div class="container">
+        <div class="row">
+            <div class="col-md-8">
+                <ul class="nav nav-pills" id="course_tabs">
+                    <li class="nav-item">
+                        <a class="nav-link {% if created %}active{% endif %}" href="{% url 'yaksh:courses' %}">
+                            My Courses
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link {% if allotted %}active{% endif %}" href="{% url 'yaksh:allotted_courses' %}">
+                            Allotted Courses
+                        </a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="{% url 'yaksh:add_course' %}">
+                            Add New Course
+                        </a>
+                    </li>
+                    <li class="nav-item dropdown hide">
+                        <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">More</a>
+                        <div class="dropdown-menu hide" x-placement="bottom-start" style="position: absolute; transform: translate3d(0px, 37px, 0px); top: 0px; left: 0px; will-change: transform;">
+                        <a class="dropdown-item" href="{% url 'yaksh:show_all_quizzes' %}">
+                            View Quizzes
+                        </a>
+                        <a class="dropdown-item" href="{% url 'yaksh:show_all_lessons' %}">
+                            View Lessons
+                        </a>
+                        <a class="dropdown-item" href="{% url 'yaksh:show_all_modules' %}">
+                            View Modules
+                        </a>
+                        <a href="{% url 'grades:grading_systems'%}" class="dropdown-item" >
+                            View Grading Systems
+                        </a>
+                    </div>
+                    </li>
+                </ul>
+            </div>
+        </div>
     </div>
-    <a href="#sidebar" data-toggle="collapse" id="sidebaricon"><i class="fa fa-navicon fa-lg"></i></a>
-    <!-- End of side bar -->
-    <main class="tab-content col" id="sidebarbody">
-        
-        <div class="tab-pane fade show active container-fluid yakshwell" role="tabpanel" aria-labelledby="sidebar-tab">
-            
-            {% if type == "courses" %}
-            <div id="created_courses">
-                {% if not courses %}
-                    <center><h4> No new Courses created </h4></center>
-                {% else %}
-            <div class="col-md-offset-2 main">
-                <center><h3 class="yakshlabel"> Course(s) Created</h3></center>
-                 <div class="table-wrapper-2">
-                <table id="course-details" class="table table-bordered table-responsive-sm">
-                <tr class="text-center yakshred bg-light">
-                <th>Courses</th>
-                <th>Modules</th>
-                </tr>
-
+    {% if not objects %}
+        <center>
+            <h2> No Courses Found </h2>
+            <br>
+            <a href="{% url 'yaksh:add_course' %}" class="btn btn-success btn-lg">
+              <span class=" fa fa-plus-circle"></span>&nbsp;Add Course
+            </a>
+        </center>
+    {% else %}
+        <div class="container">
+            <hr>
+            {% if messages %}
+                {% for message in messages %}
+                <div class="alert alert-dismissible alert-info">
+                    <button type="button" class="close" data-dismiss="alert">
+                        <i class="fa fa-close"></i>
+                    </button>
+                    <strong>{{ message }}</strong>
+                </div>
+                {% endfor %}
+            {% endif %}
+            {% with objects as courses %}
+            {% include "yaksh/paginator.html" %}
+            <div class="row">
+                <br>
                 {% for course in courses %}
-                <tr>
-                <td width="30%">
-                    <a href="{{URL_ROOT}}/exam/manage/course_detail/{{course.id}}">{{ course.name }}
-                    </a>
-                    {% if course.active %}
-                        <span class="badge badge-success">Active</span>
-                    {% else %}
-                        <span class="badge badge-danger">Closed</span>
-                    {% endif %}
-                    <br><br>
-                    <center><b><u>Teacher(s) added to {{ course }}</u></b></center>
-                    <br>
-                    <form action="{{URL_ROOT}}/exam/manage/remove_teachers/{{ course.id }}/" method="post">
-                    {% if course.get_teachers %}
-                    <div align="left">
-                    {% csrf_token %}
-                    {% for teacher in course.get_teachers %}
-                    <div class="well">
-                        <div class="row">
-                            <div class="col-md-333" style="width: auto;">
-                                <input type="checkbox" name="remove" value="{{ teacher.id }}">&nbsp;{{ teacher.get_full_name }}
+                    <div class="col-md-6">
+                        <div class="card border-primary">
+                            <div class="card-header" style="height: 150px">
+                                {{course.name}}
                             </div>
-                        </div>
-                    </div>
-                    {% endfor %} <!-- end for teachers -->
-                    <button class="btn btn-danger" type="submit" data-toggle="tooltip" title="Remove Selected Teachers from this course">Remove Teachers</button>
-                    </div>
-                    {% else %}
-                    <center><b>No Teacher(s) added</b></center>
-                    {% endif %}
-                    </form>
-                    <br><br>
-                    <ul>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/courses/designcourse/{{course.id}}/" data-toggle="tooltip" title="Add/Remove/Change course modules" data-placement="top">
-                                Design Course
-                            </a>
-                        </li>
-
-                        <br>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/edit_course/{{course.id}}">Edit Course</a>
-                        </li>
-                        <br>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/courses/download_course_csv/{{course.id}}">Download CSV
-                            </a>
-                        </li>
-                        <br>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/searchteacher/{{course.id}}/">Add Teacher</a>
-                        </li>
-                        <br>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/toggle_status/{{ course.id }}/">
-                            {% if course.active %}Deactivate Course {% else %} Activate Course {% endif %}
-                            </a>
-                        </li>
-                        <br>
-                        <li>
-                            <a class="test" href="{{URL_ROOT}}/exam/manage/duplicate_course/{{ course.id }}/" data-toggle="tooltip" title="Creates Copy of selected Course as well as its Modules, Lessons/Quizzes" data-placement="top">
-                            Clone Course</a>
-                        </li>
-                    </ul>
-                </td>
-                <td>
-                    <table id="course-details" class="table table-bordered table-responsive-sm">
-                    {% if course.get_learning_modules %}
-                        <tr class="yakshlight">
-                        <th>Module</th>
-                        <th>Module Design</th>
-                        <th>Lessons/Quizzes</th>
-                        </tr>
-                        {% for module in course.get_learning_modules %}
-                        <tr>
-                            <td>
-                            <a href="{{URL_ROOT}}/exam/manage/courses/add_module/{{module.id}}/{{course.id}}">
-                                {{module.name}}</a>
-                            </td>
-                            <td>
-                                <a href="{{URL_ROOT}}/exam/manage/courses/designmodule/{{module.id}}/{{course.id}}/">
-                                    Add Quizzes/Lessons for {{module.name}}
-                                </a>
-                            </td>
-                            <td>
-                                {% for unit in module.get_learning_units %}
-                                    <ul class="inputs-list">
-                                    <li>
-                                    {% if unit.type == "quiz" %}
-                                        {% if unit.quiz.is_exercise %}
-                                            <a href="{{URL_ROOT}}/exam/manage/add_exercise/{{unit.quiz.id}}/{{course.id}}">
-                                            {{unit.quiz.description}}</a>
+                            <div class="card-body">
+                                <div class="row">
+                                    <div class="col">
+                                        <strong>Starts On:</strong>
+                                        {{course.start_enroll_time}}
+                                        <br>
+                                        <strong>Ends On:</strong>
+                                        {{course.end_enroll_time}}
+                                    </div>
+                                </div>
+                                <hr>
+                                <div class="row">
+                                    <div class="col-md-6">
+                                        {% if course.active %}
+                                            <span class="badge badge-pill badge-success">
+                                            Active
+                                            </span>
                                         {% else %}
-                                            <a href="{{URL_ROOT}}/exam/manage/addquiz/{{unit.quiz.id}}/{{course.id}}">
-                                            {{unit.quiz.description}}</a>
+                                            <span class="badge badge-pill badge-danger">
+                                            Inactive
+                                            </span>
                                         {% endif %}
-                                    {% else %}
-                                        <a href="{{URL_ROOT}}/exam/manage/courses/edit_lesson/{{unit.lesson.id}}/{{course.id}}">
-                                        {{unit.lesson.name}}</a>
-                                    {% endif %}
-                                    </li>
-                                    </ul>
-                                {% endfor %}
-                            </td>
-                        </tr>
-                        {% endfor %} <!-- end for modules -->
-                    {% else %}
-                         No learning modules
-                    {% endif %}
-                    </table>
-                </td>
-                </tr>
-                {% endfor %} <!-- end for courses -->
-                </table>
-            </div>
-            </div>
-            {% endif %}
-            </div>
-
-            <!-- Show Alotted courses -->
-            <div id="allotted_courses" style="display: none;">
-            {% if not allotted_courses %}
-                <center><h4> No new Courses allotted</h4></center>
-                <br><br>
-            {% else %}
-            <div class="col-md-offset-2 main">
-                <center><h3> Course(s) Allotted </h3></center>
-                 <div class="table-wrapper-2">
-                <table id="course-details" class="table table-bordered table-responsive-sm">
-                <tr class="text-center yakshred bg-light">
-                <th>Courses</th>
-                <th>Modules</th>
-                </tr>
-
-                {% for course in allotted_courses %}
-                <tr>
-                <td width="30%">
-                    <ul class="list-group">
-                    <a href="{{URL_ROOT}}/exam/manage/course_detail/{{course.id}}/">{{ course.name }}</a>
-                    {% if course.active %}
-                        <span class="badge badge-success">Active</span>
-                    {% else %}
-                        <span class="badge badge-danger">Closed</span>
-                    {% endif %}
-                    <br><br>
-                    <center><b><u> Course Creator</u></b><br>
-                        <h4>{{course.creator.get_full_name.title}}</h4>
-                    </center><br>
-                    <center><b><u>Teacher(s) added to {{ course }}</u></b></center>
-                    <br>
-                    <form action="{{URL_ROOT}}/exam/manage/remove_teachers/{{ course.id }}/" method="post">
-                    {% if course.get_teachers %}
-                    <div align="left">
-                    {% csrf_token %}
-                    {% for teacher in course.get_teachers %}
-                    <div class="well">
-                        <div class="row">
-                            <div class="col-md-333" style="width: auto;">
-                                <input type="checkbox" name="remove" value="{{ teacher.id }}">&nbsp;
-                                {{ teacher.get_full_name }}
+                                    </div>
+                                    <div class="col-md-6">
+                                        <a href="{{URL_ROOT}}/exam/manage/toggle_status/{{ course.id }}/">
+                                        {% if course.active %}
+                                            <i class="fa fa-toggle-on fa-2x"></i>
+                                        {% else %}
+                                            <i class="fa fa-toggle-off fa-2x"></i>
+                                        {% endif %}
+                                        </a>
+                                    </div>
+                                </div>
+                                <hr>
+                                <div class="row">
+                                    <div class="col-md-4">
+                                        <a href="{{URL_ROOT}}/exam/manage/edit_course/{{course.id}}" class="btn btn-primary">
+                                            Edit Course
+                                        </a>
+                                    </div>
+                                    <div class="col-md-4">
+                                        <a href="{% url 'yaksh:course_detail' course.id %}" class="btn btn-info">
+                                            Manage Course
+                                        </a>
+                                    </div>
+                                    <div class="col-md-4">
+                                        <a href="{{URL_ROOT}}/exam/manage/courses/download_course_csv/{{course.id}}" class="btn btn-secondary">
+                                            Download CSV
+                                        </a>
+                                    </div>
+                                </div>
                             </div>
                         </div>
-                    </div>
-                    {% endfor %} <!-- end for teachers -->
-                    <button class="btn btn-danger" type="submit" data-toggle="tooltip" title="Remove Selected Teachers from this course">Remove Teachers</button>
-                    </div>
-                    {% else %}
-                    <center><b>No Teacher(s) added</b></center>
-                    {% endif %}
-                    </form>
-                    <br><br>
-                    <ul>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/courses/designcourse/{{course.id}}/">Design Course
-                            </a>
-                        </li>
                         <br>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/edit_course/{{course.id}}">Edit Course</a>
-                        </li>
-                        <br>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/courses/download_course_csv/{{course.id}}">Download CSV
-                            </a>
-                        </li>
-                        <br>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/searchteacher/{{course.id}}/">Add Teacher
-                            </a>
-                        </li>
-                        <br>
-                        <li>
-                            <a href="{{URL_ROOT}}/exam/manage/toggle_status/{{ course.id }}/">
-                            {% if course.active %}Deactivate Course {% else %} Activate Course {% endif %}
-                            </a>
-                        </li>
-                        <br>
-                        <li>
-                            <a class="test" href="{{URL_ROOT}}/exam/manage/duplicate_course/{{ course.id }}/" data-toggle="tooltip" title="Creates Copy of selected Course as well as its Modules, Lessons/Quizzes" data-placement="top">
-                            Clone Course</a>
-                        </li>
-                    </ul>
-                </td>
-                <td>
-                    <table id="course-details" class="table table-bordered table-responsive-sm">
-                    {% if course.get_learning_modules %}
-                        <tr class="yakshlight">
-                        <th>Module</th>
-                        <th>Module Design</th>
-                        <th>Lessons/Quizzes</th>
-                        </tr>
-                        {% for module in course.get_learning_modules %}
-                        <tr>
-                            <td>
-                            <a href="{{URL_ROOT}}/exam/manage/courses/add_module/{{module.id}}/{{course.id}}">
-                                {{module.name}}</a>
-                            </td>
-                            <td>
-                                <a href="{{URL_ROOT}}/exam/manage/courses/designmodule/{{module.id}}/{{course.id}}/">
-                                    Add Quizzes/Lessons for {{module.name}}
-                                </a>
-                            </td>
-                            <td>
-                                {% for unit in module.get_learning_units %}
-                                    <ul class="inputs-list">
-                                    <li>
-                                    {% if unit.type == "quiz" %}
-                                        {% if unit.quiz.is_exercise %}
-                                            <a href="{{URL_ROOT}}/exam/manage/add_exercise/{{unit.quiz.id}}/{{course.id}}">
-                                            {{unit.quiz.description}}</a>
-                                        {% else %}
-                                            <a href="{{URL_ROOT}}/exam/manage/addquiz/{{unit.quiz.id}}/{{course.id}}">
-                                            {{unit.quiz.description}}</a>
-                                        {% endif %}
-                                    {% else %}
-                                        <a href="{{URL_ROOT}}/exam/manage/courses/edit_lesson/{{unit.lesson.id}}/{{course.id}}">
-                                        {{unit.lesson.name}}</a>
-                                    {% endif %}
-                                    </li>
-                                    </ul>
-                                {% endfor %}
-                            </td>
-                        </tr>
-                        {% endfor %} <!-- end for modules -->
-                    {% else %}
-                         No learning modules
-                    {% endif %}
-                    </table>
-                </td>
-                {% endfor %} <!-- end for courses -->
-                </tr>
-                </table>
-            </div>
-            </div>
-            {% endif %}
-            </div>
-            {% endif %}
-            <!-- End if all Courses  -->
-
-            <!-- Show all Quizzes -->
-            <div id="all_quizzes" >
-            <div class="col-md-offset-2 main">
-            {% if type == "quiz" %}
-                <a href="{{URL_ROOT}}/exam/manage/addquiz/" class="btn btn-primary">Add New Quiz</a>
-                <a href="{{URL_ROOT}}/exam/manage/add_exercise/" class="btn btn-primary">Add New Exercise</a>
-                {% if not quizzes %}
-                    <center><h4> No new Quiz added</h4></center>
-                    <br><br>
-                {% else %}
-                    <center><h3> Quizzes </h3></center>
-                    <div class="table-wrapper-2">
-                    <table id="course-details" class="table table-bordered table-responsive-sm">
-                    <tr>
-                    <th>Sr.No</th>
-                    <th>Quiz</th>
-                    <th>QuestionPaper</th>
-                    </tr>
-
-                    {% for quiz in quizzes %}
-                    <tr>
-                    <td>{{forloop.counter}}</td>
-                    <td width="30%">
-                        
-                        {% if quiz.is_exercise %}
-                            <a href="{{URL_ROOT}}/exam/manage/add_exercise/{{quiz.id}}/">{{ quiz.description }}</a>
-                        {% else %}
-                        <a href="{{URL_ROOT}}/exam/manage/addquiz/{{quiz.id}}/">{{ quiz.description }}</a>
-                        {% endif %}
-                        {% if quiz.active %}
-                            <span class="badge badge-success">Active</span>
-                        {% else %}
-                            <span class="badge badge-danger">Closed</span>
-                        {% endif %}
-                        
-                    </td>
-                    <td>
-                        {% if quiz.questionpaper_set.get %}
-                            <a href="{{URL_ROOT}}/exam/manage/designquestionpaper/{{ quiz.id }}/{{quiz.questionpaper_set.get.id}}/">
-                            Question Paper for {{ quiz.description }}</a>
-                            <a href="{{URL_ROOT}}/exam/manage/preview_questionpaper/{{quiz.questionpaper_set.get.id}}" class="btn btn-primary active btn-xs" target="_blank">
-                                    View
-                            </a>
-                            <br>
-                        {% else %}
-                            <p>No Question Paper 
-                            <a href="#" onClick='location.replace("{{URL_ROOT}}/exam/manage/quiz/designquestionpaper/{{ quiz.id }}/");'>Add</a>
-                            </p>
-                        {% endif %}
-                    </td>
-                    {% endfor %} <!-- end for quizzes -->
-                    </tr>
-                    </table>
-                </div>
-                </div>
-                {% endif %}
-            {% endif %}
-            </div>
-
-            <!-- Show all lessons -->
-
-            <div id="all_lessons">
-                <div class="col-md-offset-2 main">
-            {% if type == "lesson" %}
-                <a href="{{URL_ROOT}}/exam/manage/courses/edit_lesson/" class="btn btn-primary">Add new Lesson</a>
-                {% if not lessons %}
-                    <center><h4> No new Lessons added</h4></center>
-                    <br><br>
-                {% else %}
-                    <center><h3> Lessons </h3></center>
-                    <div class="table-wrapper-2">
-                    <table id="course-details" class="table table-bordered table-responsive-sm">
-                    <tr>
-                    <th>Sr.No</th>
-                    <th>Lesson</th>
-                    </tr>
-
-                    {% for lesson in lessons %}
-                    <tr>
-                    <td width="2%">{{forloop.counter}}</td>
-                    <td width="30%">
-                        
-                        <a href="{{URL_ROOT}}/exam/manage/courses/edit_lesson/{{lesson.id}}/">
-                        {{ lesson.name }}</a>
-                        {% if lesson.active %}
-                            <span class="badge badge-success">Active</span>
-                        {% else %}
-                            <span class="badge badge-danger">Closed</span>
-                        {% endif %}
-                        
-                    </td>
-                    {% endfor %} <!-- end for lessons -->
-                    </tr>
-                    </table>
-                </div>
-                </div>
-                {% endif %}
-            {% endif %}
-            </div>
-
-            <!-- Show all learning modules -->
-                <div class="col-md-offset-2 main">
-            <div id="all_modules">
-            {% if type == "learning_module" %}
-                <a href="{{URL_ROOT}}/exam/manage/courses/add_module/" class="btn btn-primary">
-                Add new Module</a>
-                {% if not learning_modules %}
-                    <center><h4> No new learning modules added</h4></center>
-                    <br><br>
-                {% else %}
-                    <center><h3> Learning Modules </h3></center>
-                    <table id="course-details" class="table table-bordered table-responsive-sm">
-                    <tr>
-                    <th>Sr.No</th>
-                    <th>Learning Modules</th>
-                    <th>Design Module</th>
-                    <th>Learning Units</th>
-                    </tr>
-                    {% for module in learning_modules %}
-                    <tr>
-                    <td width="2%">{{forloop.counter}}</td>
-                    <td>
-                        <a href="{{URL_ROOT}}/exam/manage/courses/add_module/{{module.id}}/">
-                        {{ module.name }}</a>
-                        {% if module.active %}
-                            <span class="badge badge-success">Active</span>
-                        {% else %}
-                            <span class="badge badge-danger">Closed</span>
-                        {% endif %}
-                    </td>
-                    <td>
-                        <a href="{{URL_ROOT}}/exam/manage/courses/designmodule/{{module.id}}">
-                            Add Quizzes/Lessons for {{module.name}}
-                        </a>
-                    </td>
-                    <td>
-                        {% if module.get_learning_units %}
-                            {% for unit in module.get_learning_units %}
-                                <ul class="list-group">
-                                {% if unit.type == 'quiz' %}
-                                    {{unit.quiz.description}}
-                                {% else %}
-                                    {{unit.lesson.name}}
-                                {% endif %}
-                                </ul>
-                            {% endfor %} <!-- end for learning units -->
-                        {% else %}
-                            No Learning units
-                        {% endif %}
-                    </td>
-                    {% endfor %} <!-- end for modules -->
-                    </tr>
-                    </table>
-                </div>
-                {% endif %}
-            {% endif %}
+                    </div>
+                {% endfor %}
+                <br>
             </div>
+            {% include "yaksh/paginator.html" %}
+            {% endwith %}
         </div>
-    </main>
+    {% endif %}
 </div>
-{% endblock %}
-{% block footer %}
-  <!--footer-->   
-  <footer class="container-fluid yakshsidebarfooter text-center">
-    <div class="row justify-content-center">
-    <div class="col-sm-5 ">
-      {% if user %}
-         {% block info %}
-         <b>{{user.get_full_name|title}}</b> with Roll no. <b>{{user.profile.roll_number}}</b> is logged in as <b>{{user.username}}</b>
-         {% endblock %}
-         {% endif %}
-    </div>
-    <div class="col-sm-2">
-      |
-    </div>
-    <div class="col-sm-4 text-left">
-     <b>Any Queries?</b> Email : info@fossee.in
-    </div>
-  </div>
-  </footer>
-  <!--footer end-->
-{% endblock %}
+{% endblock %}
\ No newline at end of file
diff --git a/yaksh/templates/yaksh/editprofile.html b/yaksh/templates/yaksh/editprofile.html
index df6d328..2161716 100644
--- a/yaksh/templates/yaksh/editprofile.html
+++ b/yaksh/templates/yaksh/editprofile.html
@@ -5,7 +5,7 @@
 <div class="container">
     <center><h2> My Profile </h2></center>
     <br>
-    <form action="{{URL_ROOT}}/exam/editprofile/" method="post" >
+    <form action="{% url 'yaksh:edit_profile'%}" method="post" >
       {% csrf_token %}
       <center>
         <div class="row justify-content-center form-group">
@@ -18,14 +18,18 @@
                             {% for field in form %}
                                 {% for error in field.errors %}
                                     <div class="alert alert-dismissible alert-danger">
-                                        <button type="button" class="close" data-dismiss="alert">&times;</button>
+                                        <button type="button" class="close" data-dismiss="alert">
+                                            <i class="fa fa-close"></i>
+                                        </button>
                                         <strong>{{ error|escape }}</strong>
                                     </div>
                                 {% endfor %}
                             {% endfor %}
                             {% for error in form.non_field_errors %}
                                 <div class="alert alert-dismissible alert-danger">
-                                    <button type="button" class="close" data-dismiss="alert">&times;</button>
+                                    <button type="button" class="close" data-dismiss="alert">
+                                        <i class="fa fa-close"></i>
+                                    </button>
                                     <strong>{{ error|escape }}</strong>
                                 </div>
                             {% endfor %}
@@ -38,7 +42,7 @@
                         <br>
                     </center>
                     <button class="btn btn-success btn-lg" type="submit">Update</button>&nbsp;&nbsp;
-                    <a href="{{URL_ROOT}}/exam" class="btn btn-primary btn-lg">Cancel</a></center>
+                    <a href="{% url 'yaksh:index' %}" class="btn btn-primary btn-lg">Cancel</a></center>
                 </fieldset>
             </form>
         </div>
diff --git a/yaksh/templates/yaksh/moderator_dashboard.html b/yaksh/templates/yaksh/moderator_dashboard.html
index 33671aa..ff4bcf1 100644
--- a/yaksh/templates/yaksh/moderator_dashboard.html
+++ b/yaksh/templates/yaksh/moderator_dashboard.html
@@ -8,29 +8,29 @@
 <div class="container">
     <center>
         {% block pagetitle %} <h2>My Dashboard</h2> {% endblock %}
-        <h4>List of quizzes! Click on the given links to have a look at answer papers for a quiz.</h4>
+        <h4>
+            List of quizzes! Click on the given links to have a look at answer papers for a quiz
+        </h4>
     </center>
     <hr>
     <center>
         <a href="{% url 'yaksh:add_course' %}" class="btn btn-success btn-lg">
-          <span class=" fa fa-plus-circle"></span>&nbsp;Add Course
+            <span class=" fa fa-plus-circle"></span>&nbsp;Add Course
         </a>
         <a href="{% url 'yaksh:create_demo_course' %}" class="btn btn-primary btn-lg">
-          Create Demo Course
+            Create Demo Course
         </a>
-        <center>
-            <br>
-            {% if msg %}
-            <div class="container">
-                <div class="alert alert-dismissible alert-info">
-                    <button type="button" class="close" data-dismiss="alert">
-                        <i class="fa fa-close"></i>
-                    </button>
-                    <strong>{{ msg }}</strong>
-                </div>
+        <br>
+        {% if msg %}
+        <div class="container">
+            <div class="alert alert-dismissible alert-info">
+                <button type="button" class="close" data-dismiss="alert">
+                    <i class="fa fa-close"></i>
+                </button>
+                <strong>{{ msg }}</strong>
             </div>
-            {% endif %}
-        </center>
+        </div>
+        {% endif %}
     </center>
     {% with objects as courses %}
     {% if not courses %}
@@ -38,15 +38,18 @@
           No Courses found. Add a new course or Create demo course
         </div>
     {% else %}
+        <br>
         {% include "yaksh/paginator.html" %}
         <br>
         <div id="accordion">
             {% for course in courses %}
                 <div class="card">
-                    <div class="card-header">
+                    <div class="card-header" style="height: 100px">
                         <div class="row">
                             <div class="col-md-4">
-                                <h4>{{ course.name | truncatechars:40 }}</h4>
+                                <h4 data-toggle="tooltip" title="{{course.name}}">
+                                    {{ course.name | truncatechars:40 }}
+                                </h4>
                             </div>
                             <div class="col-md-2">
                                 {% if course.active %}
@@ -75,19 +78,19 @@
                     <div id="collapse{{course.id}}" class="collapse hide" data-parent="#accordion">
                         <div class="card-body">
                             <strong>{{ course.name }}</strong>
-                            <table class="table table-bordered table-responsive-sm">
-                                <tr>
-                                    <th>Quiz</th>
-                                    <th>Taken By</th>
-                                    <th>No. of users Passed</th>
-                                    <th>No. of users Failed</th>
-                                </tr>
-                                {% get_course_details course as course_details %}
-                                {% if course_details %}
+                            {% get_course_details course as course_details %}
+                            {% if course_details %}
+                                <table class="table table-bordered table-responsive-sm">
+                                    <tr>
+                                        <th>Quiz</th>
+                                        <th>Taken By</th>
+                                        <th>No. of users Passed</th>
+                                        <th>No. of users Failed</th>
+                                    </tr>
                                     {% for quiz, users_no, passed, failed in course_details %}
                                     <tr>
                                         <td>
-                                            <a href="{% url 'yaksh:monitor' quiz.id course.id %}" >
+                                            <a href="{% url 'yaksh:monitor' quiz.id course.id %}">
                                                 {{ quiz.description }}
                                             </a>
                                         </td>
@@ -95,11 +98,14 @@
                                         <td>{{passed}}</td>
                                         <td>{{failed}}</td>
                                       </tr>
-                                      {% endfor %}
-                                {% else %}
-                                    No Quizzes
-                                {% endif %}
-                            </table>
+                                    {% endfor %}
+                                </table>
+                            {% else %}
+                                <br><br>
+                                <div class="alert alert-info">
+                                    <strong>No Quizzes</strong>
+                                </div>
+                            {% endif %}
                         </div>
                     </div>
                 </div>
diff --git a/yaksh/templates/yaksh/paginator.html b/yaksh/templates/yaksh/paginator.html
index 3170081..5438b77 100644
--- a/yaksh/templates/yaksh/paginator.html
+++ b/yaksh/templates/yaksh/paginator.html
@@ -1,4 +1,4 @@
-<ul class="pagination pagination-lg">
+<ul class="pagination pagination">
     {% if objects.has_previous %}
     <li class="page-item">
         <a class="page-link" href="?page=1" aria-label="Previous">
diff --git a/yaksh/templates/yaksh/profile_updated.html b/yaksh/templates/yaksh/profile_updated.html
index b038b5e..557719c 100644
--- a/yaksh/templates/yaksh/profile_updated.html
+++ b/yaksh/templates/yaksh/profile_updated.html
@@ -1,18 +1,19 @@
 {% extends "base.html" %}
+{% load static %}
 {% block title %} Profile {% endblock %}
 
 {% block nav %}
 <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
-  <a class="navbar-brand" href="{{ URL_ROOT }}/exam/">
-    <img src="{{ URL_ROOT }}/static/yaksh/images/yaksh_banner.png" alt="YAKSH">
-  </a>
+    <a class="navbar-brand" href="{% url 'yaksh:index' %}">
+        <img src="{% static 'yaksh/images/yaksh_banner.png' %}" alt="YAKSH">
+    </a>
 </nav>
 {% endblock %}
 <!DOCTYPE html>
 
 {% block script %}
 <script>
-    window.setTimeout(function(){ location.href="{{ URL_ROOT }}/exam/" }, 2000);
+    window.setTimeout(function(){ location.href="{% url 'yaksh:index' %}" }, 2000);
 </script>
 {% endblock script %}
 {% block content %}
@@ -24,7 +25,7 @@
                 <h3>Redirecting...</h3>
             </div>
         </div>
-        <div class="col"><img src="{{ URL_ROOT }}/static/yaksh/images/profile_change.gif/"></div>
+        <div class="col"><img src="{% static 'yaksh/images/profile_change.gif' %}"></div>
     </div>
 </center>
 {% endblock content %}
diff --git a/yaksh/templatetags/custom_filters.py b/yaksh/templatetags/custom_filters.py
index 29f4b59..1cd3ca2 100644
--- a/yaksh/templatetags/custom_filters.py
+++ b/yaksh/templatetags/custom_filters.py
@@ -1,5 +1,6 @@
 from django import template
 from django.template.defaultfilters import stringfilter
+from django.forms.fields import CheckboxInput
 from ast import literal_eval
 import os
 try:
@@ -87,3 +88,8 @@ def replace_spaces(name):
 @register.simple_tag
 def course_grade(course, user):
     return course.get_grade(user)
+
+
+@register.filter(name='is_checkbox')
+def is_checkbox(value):
+    return isinstance(value, CheckboxInput)
diff --git a/yaksh/urls.py b/yaksh/urls.py
index d453381..3397fb1 100644
--- a/yaksh/urls.py
+++ b/yaksh/urls.py
@@ -109,6 +109,8 @@ urlpatterns = [
     url(r'^manage/duplicate_course/(?P<course_id>\d+)/$',
         views.duplicate_course, name='duplicate_course'),
     url(r'manage/courses/$', views.courses, name='courses'),
+    url(r'manage/allotted/courses/$', views.allotted_courses,
+        name='allotted_courses'),
     url(r'manage/add_course/$', views.add_course, name='add_course'),
     url(r'manage/edit_course/(?P<course_id>\d+)$', views.add_course,
         name='edit_course'),
diff --git a/yaksh/views.py b/yaksh/views.py
index 78b30bf..7e9b706 100644
--- a/yaksh/views.py
+++ b/yaksh/views.py
@@ -15,6 +15,7 @@ from django.core.exceptions import (
     MultipleObjectsReturned, ObjectDoesNotExist
 )
 from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
+from django.contrib import messages
 from taggit.models import Tag
 import json
 import six
@@ -1040,11 +1041,40 @@ def courses(request):
     if not is_moderator(user):
         raise Http404('You are not allowed to view this page')
     courses = Course.objects.filter(
-        creator=user, is_trial=False).order_by('-active', '-id')
+        creator=user, is_trial=False).order_by('-id')
+    paginator = Paginator(courses, 20)
+    page = request.GET.get('page')
+    try:
+        courses = paginator.page(page)
+    except PageNotAnInteger:
+        # If page is not an integer, deliver first page.
+        courses = paginator.page(1)
+    except EmptyPage:
+        # If page is out of range (e.g. 9999), deliver last page of results.
+        courses = paginator.page(paginator.num_pages)
+    context = {'objects': courses, 'created': True}
+    return my_render_to_response(request, 'yaksh/courses.html', context)
+
+
+@login_required
+@email_verified
+def allotted_courses(request):
+    user = request.user
+    if not is_moderator(user):
+        raise Http404('You are not allowed to view this page')
     allotted_courses = Course.objects.filter(
-        teachers=user, is_trial=False).order_by('-active', '-id')
-    context = {'courses': courses, "allotted_courses": allotted_courses,
-               "type": "courses"}
+        teachers=user, is_trial=False).order_by('-id')
+    paginator = Paginator(allotted_courses, 20)
+    page = request.GET.get('page')
+    try:
+        allotted_courses = paginator.page(page)
+    except PageNotAnInteger:
+        # If page is not an integer, deliver first page.
+        allotted_courses = paginator.page(1)
+    except EmptyPage:
+        # If page is out of range (e.g. 9999), deliver last page of results.
+        allotted_courses = paginator.page(paginator.num_pages)
+    context = {'allotted': True, "objects": allotted_courses}
     return my_render_to_response(request, 'yaksh/courses.html', context)
 
 
@@ -1166,9 +1196,12 @@ def toggle_course_status(request, course_id):
 
     if course.active:
         course.deactivate()
+        message = '{0} deactivated successfully'.format(course.name)
     else:
         course.activate()
+        message = '{0} activated successfully'.format(course.name)
     course.save()
+    messages.info(request, message)
     return my_redirect("/exam/manage/courses")