P10 Added judging critera page

.env_sample

@@ -1,3 +1,3 @@
-DEVELOPMENT=1
-SECRET_KEY="your_secret_key_here"
-SITE_NAME="localhost"
+DEVELOPMENT=1
+SECRET_KEY="your_secret_key_here"
+SITE_NAME="localhost"

home/views.py

@@ -35,3 +35,4 @@ def useful_resources(request):
     """ A view to return the Useful Resources page """
 
     return render(request, "useful-resources.html")
+

templates/includes/navbar.html

@@ -29,7 +29,7 @@
                     </a>
                     <div class="dropdown-menu" aria-labelledby="navbarResources">
                         <a class="dropdown-item" href="#">FAQs</a>
-                        <a class="dropdown-item" href="#">Judging Criteria</a>
+                        <a class="dropdown-item" href="{% url 'judging_criteria' %}">Judging Criteria</a>
                         <a class="dropdown-item" href="#">Useful Resources</a>
                     </div>
                 </li>

templates/judging-criteria.html

@@ -1,8 +1,57 @@
 {% extends "base.html" %}
 {% load static %}
 {% block content %}
+<div class="container">
 
-<h1>Judging Criteria</h1>
-<!-- help needed -->
+    <div class="row">
+        <div class="col row justify-content-center">
+            <h1>Judging Criteria for Hackaton</h1>
+        </div>
+    </div>
 
+    <div class="mt-2">
+        <div class="row">
+            <div class="col-md-6">
+                <h2 class="font-weight-bold">Content</h2>
+
+                <p>Content is the information provided on the site. It is not just text, but music, sound, animation, or
+                    video – anything that communicates a site’s body of knowledge. Good content should be engaging,
+                    relevant, and appropriate for the audience; you can tell it’s been developed for the Web because
+                    it’s clear and concise and it works in the medium. Good content takes a stand. It has a voice and a
+                    point of view. It may be informative, useful, or funny, but it always leaves you wanting more.</p>
+            </div>
+            <div class="col-md-6">
+                <h2 class="font-weight-bold">Structure and navigation</h2>
+
+                <p>Refers to the framework of a site, the organization of content, the prioritization of information,
+                    and the method in which you move through the site. Sites with good structure and navigation are
+                    consistent, intuitive, and transparent. They allow you to form a mental model of the information
+                    provided: where to find things and what to expect when you click. Good navigation gets you where you
+                    want to go quickly and offers easy access to the breadth and depth of the site’s content.</p>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-6">
+                <h2 class="font-weight-bold">Visual design</h2>
+
+                <p>The appearance of the site. It’s more than just a pretty homepage, and it doesn’t have to be cutting
+                    edge or trendy. Good visual design is high quality, appropriate, and relevant for the audience and
+                    the message it is supporting. It communicates a visual experience and may even take your breath
+                    away.</p>
+            </div>
+            <div class="col-md-6">
+                <h2 class="font-weight-bold">Functionality</h2>
+
+                <p>Good functionality means the site works well. It loads quickly, has live links, and any new
+                    technology used is functional and relevant for the intended audience. The site should work
+                    cross-platform and be browser independent. Highly functional sites anticipate the diversity of user
+                    requirements from file size and format to download speed. The most functional sites also take into
+                    consideration those with special access needs. Good functionality makes the experience center stage
+                    and the technology invisible.</p>
+            </div>
+        </div>
+    </div>
+
+</div>
 {% endblock %}
+