created about and added some content

4darsh-Dev · Jan 31, 2024 · 7965cfc · 7965cfc
1 parent c2998d0
commit 7965cfc
Show file tree

Hide file tree

Showing 7 changed files with 51 additions and 9 deletions.
diff --git a/api/home/urls.py b/api/home/urls.py
@@ -1,13 +1,11 @@
 from django.contrib import admin
-from django.urls import path,include
+from django.urls import path, include
 from home import views
 
 urlpatterns = [
     path("", views.index, name="home"),
     path("faqs/", views.faqs, name="faqs"),
-
     path("popup_detect/", views.popup_detect, name="popup_detect"),
     path("report-dp/", views.reportDp, name="report-dp"),
-
+    path("about/", views.about, name="about"),
 ]
-
diff --git a/api/static/css/about.css b/api/static/css/about.css
@@ -0,0 +1,12 @@
+* {
+  font-family: var(--font-secondary);
+}
+.content-section section {
+  display: flex;
+  align-items: center;
+  gap: 5rem;
+}
+.cogniguard-ss {
+  height: 30rem;
+  border: 1px solid var(--color-primary);
+}
diff --git a/api/static/css/style.css b/api/static/css/style.css
@@ -10,8 +10,8 @@
   --color-primary-light: rgba(36, 87, 197, 0.3);
   --color-secondary: #469a3f;
   --font-ex-small: 0.4rem;
-  --font-small: 0.625rem;
-  --font-mid-medium: 1.25rem;
+  --font-small: 0.75rem;
+  --font-mid-medium: 1.5rem;
   --font-medium: 2rem;
   --font-mid-large: 2.5rem;
   --font-large: 3rem;

diff --git a/api/static/img/cogniguard-popup.png b/api/static/img/cogniguard-popup.png
diff --git a/api/static/js/about.js b/api/static/js/about.js
diff --git a/api/templates/about.html b/api/templates/about.html
@@ -0,0 +1,32 @@
+{% extends "base.html" %}
+{% load static %}
+{% block head %}
+<link rel="stylesheet" href="{% static "css/about.css" %}">
+{% endblock head %}
+
+{% block title %}About{% endblock title %}
+
+{% block content %}
+<section class="content-section">
+    <section>
+        <img class="cogniguard-ss" src="{%static "img/cogniguard-popup.png"%}" alt="web-extension-picture">
+        <div>
+            <p class="font-medium">
+                <span class="blue-text font-mid-large font-secondary">Cogniguard</span> is a lightweight but powerful web extension designed to combat
+                deceptive tactics and promote transparency online.
+            </p>
+        </div>
+    </section>
+    <section>
+        <span class="font-medium">
+            <p>It empowers you by</p>
+           <span class="font-mid-medium"> Identifying dark patterns: Uncovers hidden manipulation techniques used by websites, particularly in e-commerce.
+           </span>
+        </span>
+    </section>
+</section>
+{% endblock content %}
+
+{% block script %}
+<script src="{% static "js/about.js"%}"></script>
+{% endblock script %}
diff --git a/api/templates/base.html b/api/templates/base.html
@@ -80,12 +80,12 @@
                             What are Dark Patterns
                         </div>
                     </a>
-                    <a href="/" class="link">
+                    <a href="/report-dp" class="link">
                         <div class="align-items">
                             <span class="material-symbols-outlined">
-                                help
+                                flag
                             </span>
-                            Get Help
+                            Report Dark Pattern
                         </div>
                     </a>
                     <a href="/faqs" class="link">