diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml
index ddb6d51d2..7cbf8e02a 100644
--- a/.pre-commit-config.yaml
+++ b/.pre-commit-config.yaml
@@ -16,9 +16,18 @@ repos:
     hooks:
       - id: ruff
         args:
-          - "--fix"
+          - '--fix'
       - id: ruff-format
 
+  - repo: https://github.com/djlint/djLint
+    rev: v1.35.2
+    hooks:
+      - id: djlint-reformat-django
+        files: 'templates/.*.html'
+        entry: djlint --reformat
+        types:
+          - html
+
   - repo: https://github.com/pycqa/isort
     rev: 5.13.2
     hooks:
diff --git a/backend/apps/github/index/issue.py b/backend/apps/github/index/issue.py
index 06ec9beaa..018cf6cf6 100644
--- a/backend/apps/github/index/issue.py
+++ b/backend/apps/github/index/issue.py
@@ -21,11 +21,13 @@ class IssueIndex(AlgoliaIndex):
         "idx_author_name",
         "idx_comments_count",
         "idx_created_at",
+        "idx_hint",
         "idx_labels",
         "idx_project_description",
         "idx_project_level",
         "idx_project_name",
         "idx_project_tags",
+        "idx_project_url",
         "idx_repository_contributors_count",
         "idx_repository_description",
         "idx_repository_forks_count",
diff --git a/backend/apps/github/models/mixins/issue.py b/backend/apps/github/models/mixins/issue.py
index 16f9d0afd..c0d73a1dc 100644
--- a/backend/apps/github/models/mixins/issue.py
+++ b/backend/apps/github/models/mixins/issue.py
@@ -34,6 +34,11 @@ def idx_created_at(self):
         """Return created at for indexing."""
         return self.created_at
 
+    @property
+    def idx_hint(self):
+        """Return hint for indexing."""
+        return self.hint if self.hint else None
+
     @property
     def idx_labels(self):
         """Return labels for indexing."""
@@ -64,6 +69,11 @@ def idx_project_name(self):
         """Return project name for indexing."""
         return self.project.idx_name if self.project else ""
 
+    @property
+    def idx_project_url(self):
+        """Return project URL for indexing."""
+        return self.project.idx_url if self.project else None
+
     @property
     def idx_repository_contributors_count(self):
         """Return repository contributors count for indexing."""
diff --git a/backend/apps/owasp/api/search/issue.py b/backend/apps/owasp/api/search/issue.py
index 638c5c11c..a5c8b0dda 100644
--- a/backend/apps/owasp/api/search/issue.py
+++ b/backend/apps/owasp/api/search/issue.py
@@ -10,11 +10,17 @@ def get_issues(query, distinct=False, limit=25):
     """Return issues relevant to a search query."""
     params = {
         "attributesToRetrieve": [
+            "idx_comments_count",
             "idx_created_at",
+            "idx_hint",
+            "idx_labels",
             "idx_project_name",
+            "idx_project_url",
             "idx_repository_languages",
+            "idx_repository_topics",
             "idx_summary",
             "idx_title",
+            "idx_updated_at",
             "idx_url",
         ],
         "hitsPerPage": limit,
diff --git a/backend/apps/owasp/api/search/project.py b/backend/apps/owasp/api/search/project.py
index 13fc377f9..7a5a09205 100644
--- a/backend/apps/owasp/api/search/project.py
+++ b/backend/apps/owasp/api/search/project.py
@@ -13,6 +13,7 @@ def get_projects(query, limit=25):
             "idx_contributors_count",
             "idx_created_at",
             "idx_forks_count",
+            "idx_leaders",
             "idx_level",
             "idx_name",
             "idx_stars_count",
diff --git a/backend/apps/owasp/templates/search/issue.html b/backend/apps/owasp/templates/search/issue.html
index 0da8e5888..86d093088 100644
--- a/backend/apps/owasp/templates/search/issue.html
+++ b/backend/apps/owasp/templates/search/issue.html
@@ -1,77 +1,240 @@
+{% extends "base.html" %}
 {% load static %}
+{% block content %}
+    {{ block.super }}
+    <div id="app">
+        <div class="container">
+            <div class="row mb-4">
+                <div class="col-lg-6 mx-auto">
+                    <div class="input-group">
+                        <input v-model="search"
+                               type="text"
+                               @input="handleInput"
+                               class="form-control"
+                               placeholder="Search for a project to contribute to...">
+                        <button class="btn btn-outline-secondary"
+                                @click="search = ''"
+                                type="button"
+                                id="button-addon2">
+                            <i class="fa-solid fa-xmark"></i>
+                        </button>
+                    </div>
+                </div>
+            </div>
+            <div v-for="(issue, i) in issues" :key="`issue-${i}`" class="card m-4">
+                <div class="card-body px-4">
+                    <div class="row" id="idx_metadata">
+                        <div class="сol-2 position-relative;">
+                            <div class="position-absolute top-0 end-0">
+                                <div class="d-flex flex-row text-muted">
+                                    <div data-bs-toggle="tooltip"
+                                         data-bs-placement="top"
+                                         title="Issue created"
+                                         class="d-flex flex-column align-items-center justify-content-center border border-light pt-2"
+                                         style="width: 120px">
+                                        <div class="px-2">
+                                            <i class="fa-regular fa-clock"></i>
+                                        </div>
+                                        <div class="px-2">${issue.idx_created_at} ago</div>
+                                    </div>
+                                    <div data-bs-toggle="tooltip"
+                                         data-bs-placement="top"
+                                         title="Issue updated"
+                                         class="d-flex flex-column align-items-center justify-content-center border border-light pt-2"
+                                         style="width: 120px"
+                                         v-if="issue.idx_updated_at !== issue.idx_created_at">
+                                        <div class="px-2">
+                                            <i class="fa-solid fa-arrows-rotate"></i>
+                                        </div>
+                                        <div class="px-2">${issue.idx_updated_at} ago</div>
+                                    </div>
+                                    <div data-bs-toggle="tooltip"
+                                         data-bs-placement="top"
+                                         title="Number of comments"
+                                         class="d-flex flex-column align-items-center justify-content-center border border-light pt-2"
+                                         style="width: 100px"
+                                         v-if="issue.idx_comments_count">
+                                        <div class="px-2">
+                                            <i class="fa-regular fa-comment"></i>
+                                        </div>
+                                        <div class="px-2">${issue.idx_comments_count}</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-8">
+                            <div id="idx_title">
+                                <h4>
+                                    <a :href="`${issue.idx_url}`" target="_blank">${issue.idx_title}</a>
+                                </h4>
+                            </div>
+                        </div>
+                    </div>
+                    <div id="idx_project_name">
+                        <h6>
+                            <a :href="`${issue.idx_project_url}`" target="_blank">${issue.idx_project_name}</a>
+                        </h6>
+                    </div>
+                    <div id="idx_summary" class="mb-1">
+                        <div class="text-3" v-html="issue.idx_summary_md"></div>
+                        <button v-if="issue.idx_summary || issue.idx_hint"
+                                type="button"
+                                @click="showIssueDetails(issue)"
+                                data-bs-toggle="modal"
+                                data-bs-target="#detailsModal"
+                                class="mt-3 btn btn-outline-primary btn-sm inline-block float-end"
+                                style="text-decoration: none">Read more</button>
+                    </div>
+                    <div class="row"></div>
+                    <div id="idx_languages">
+                        <div>
+                            <div role="button"
+                                 data-bs-toggle="tooltip"
+                                 data-bs-placement="bottom"
+                                 title="Click to search by"
+                                 @click="clickSearch(lang)"
+                                 class="badge bg-secondary mx-1 mt-2"
+                                 v-for="lang in issue.idx_repository_language">${lang}</div>
+                        </div>
+                        <div id="idx_topics">
+                            <div>
+                                <div role="button"
+                                     data-bs-toggle="tooltip"
+                                     data-bs-placement="bottom"
+                                     title="Click to search by"
+                                     @click="clickSearch(label)"
+                                     class="badge bg-light-gray mx-1 mt-2"
+                                     v-for="label in issue.idx_labels">${label}</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="modal fade"
+                     id="detailsModal"
+                     tabindex="-1"
+                     aria-labelledby="detailsModalLabel"
+                     aria-hidden="true">
+                    <div class="modal-dialog modal-lg">
+                        <div class="modal-content">
+                            <div class="modal-header d-block">
+                                <div class="d-flex">
+                                    <h4 class="modal-title" id="exampleModalLabel">${selectedIssue.idx_title}</h4>
+                                    <button type="button"
+                                            class="btn-close"
+                                            data-bs-dismiss="modal"
+                                            aria-label="Close"></button>
+                                </div>
+                                <small class="pt-2 text-muted">
+                                    The issue summary and the recommended steps to address it have been generated by AI
+                                </small>
+                            </div>
+                            <div class="modal-body p-4">
+                                <div v-if="selectedIssue.idx_summary" class="mb-3">
+                                    <h5>Issue summary</h5>
+                                    <div v-html="selectedIssue.idx_summary_md"></div>
+                                </div>
+                                <div v-if="selectedIssue.idx_hint">
+                                    <h5>How to tackle it</h5>
+                                    <div v-html="selectedIssue.idx_hint"></div>
+                                </div>
+                            </div>
+                            <div class="modal-footer">
+                                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <script>
+        const {
+            createApp
+        } = Vue;
+        createApp({
+            delimiters: ['${', '}'],
+            data() {
+                return {
+                    issues: [],
+                    selectedIssue: {},
+                    search: '',
+                    isManual: true,
+                };
+            },
+            watch: {
+                search() {
+                    if (this.isManual) {
+                        this.handleInput();
+                    } else {
+                        this.getIssues();
+                    }
+                }
+            },
+            methods: {
+                async getIssues() {
+                    const response = await fetch(`/api/v1/owasp/search/issue?q=${this.search}`)
+                        .then(res => res.json())
+                        .then(json => {
+                            json.forEach(issue => {
+                                issue.idx_hint = marked.parse(issue.idx_hint || '');
+                                issue.idx_title_md = marked.parse(issue.idx_title || '');
+                                issue.idx_summary_md = marked.parse(issue.idx_summary || '');
+                                issue.idx_created_at = dayjs.unix(issue.idx_created_at || '').fromNow(true);
+                                issue.idx_updated_at = dayjs.unix(issue.idx_updated_at || '').fromNow(true);
+                                issue.idx_labels = issue.idx_labels.length ? issue.idx_labels.slice(0, 10) : [];
+                                issue.idx_repository_language = issue.idx_repository_languages.length ? issue.idx_repository_languages.slice(0, 10) : [];
+                            });
+                            this.issues = json;
+                        })
+                        .catch((err) => console.error("There was an error! ", err));
+                },
+                showIssueDetails(issue) {
+                    this.selectedIssue = issue;
+                },
+                handleInput(event) {
+                    clearTimeout(this.timeout);
+                    this.timeout = setTimeout(this.getIssues, 1000);
+                },
+                clickSearch(search) {
+                    this.isManual = false;
+                    this.search = search;
+                    document.body.scrollTop = 0;
+                    document.documentElement.scrollTop = 0;
+                }
+            },
+            mounted() {
+                dayjs.extend(dayjs_plugin_relativeTime);
+                this.getIssues();
+                const url = new URL(window.location.href);
+                const params = new URLSearchParams(url.search);
+                const searchQuery = params.get('q');
+                if (searchQuery) {
+                    this.isManual = false;
+                    this.search = searchQuery;
+                }
+            }
+        }).mount('#app');
+    </script>
+    <style scoped lang="scss">
+        .text-3 {
+            display: -webkit-box;
+            -webkit-box-orient: vertical;
+            -webkit-line-clamp: 3;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
 
-<head>
-  <meta charset="UTF-8" />
-  <link
-    rel="stylesheet"
-    href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"
-  />
-</head>
+        a {
+            color: #1d7bd7;
+            text-decoration: none;
 
-<script src="{% static 'js/htmx.min.js' %}"></script>
+            :hover {
+                text-decoration: underline;
+            }
+        }
 
-<h3>Find an issue to work on</h3>
-<input
-  autocomplete="off"
-  class="form-control"
-  id="query"
-  name="q"
-  placeholder="Type To Search..."
-  type="search"
-  hx-get="{% url 'api-search-project-issues' %}"
-  hx-indicator=".htmx-indicator"
-  hx-swap="none"
-  hx-target="#search-results"
-  hx-trigger="load, input changed delay:1000ms, search"
-/>
-<span class="htmx-indicator"> Searching... </span>
-
-<script>
-  document
-    .getElementById('query')
-    .addEventListener('htmx:afterRequest', function (event) {
-      var jsonResponse = event.detail.xhr.response;
-      var hits = JSON.parse(jsonResponse);
-
-      const resultsContainer = document.getElementById('search-results');
-      resultsContainer.innerHTML = '';
-
-      hits.forEach((hit) => {
-        const highlightedTitle = hit._highlightResult.idx_title.value;
-        const languages = hit.idx_repository_languages;
-        const projectName = hit.idx_project_name;
-        const createdAt = new Date(hit.idx_created_at * 1000);
-
-        const languageIcons = {
-          Python: 'fab fa-python',
-          JavaScript: 'fab fa-js',
-          Java: 'fab fa-java',
-          PHP: 'fab fa-php',
-        };
-
-        const container = document.createElement('div');
-        languages.forEach((language) => {
-          const iconClass = languageIcons[language];
-          if (iconClass) {
-            const languageSpan = document.createElement('span');
-            languageSpan.innerHTML = `<i class="${iconClass}"></i>`;
-            container.appendChild(languageSpan);
-          }
-        });
-
-        const url = hit.idx_url;
-
-        const resultItem = document.createElement('div');
-        resultItem.innerHTML = `
-          <h2><a href="${url}" target="_blank">${highlightedTitle}</a></h2>
-          <p>Project: ${projectName}. Created at: ${createdAt}</p>
-          <p>${container.innerHTML}</p>
-          <p></p>
-        `;
-
-        resultsContainer.appendChild(resultItem);
-      });
-    });
-</script>
-
-<div id="search-results"></div>
+        .bg-light-gray {
+            background-color: #868E96;
+        }
+    </style>
+{% endblock content %}
diff --git a/backend/apps/owasp/templates/search/project.html b/backend/apps/owasp/templates/search/project.html
index 13e241bf3..d369e2aca 100644
--- a/backend/apps/owasp/templates/search/project.html
+++ b/backend/apps/owasp/templates/search/project.html
@@ -1,58 +1,218 @@
+{% extends "base.html" %}
 {% load static %}
+{% block content %}
+    {{ block.super }}
+    <div id="app">
+        <div class="container">
+            <div class="row mb-4">
+                <div class="col-lg-6 mx-auto">
+                    <div class="input-group">
+                        <input v-model="search"
+                               type="text"
+                               @input="handleInput"
+                               class="form-control"
+                               placeholder="Search for a project to contribute to...">
+                        <button class="btn btn-outline-secondary"
+                                @click="search = ''"
+                                type="button"
+                                id="button-addon2">
+                            <i class="fa-solid fa-xmark"></i>
+                        </button>
+                    </div>
+                </div>
+            </div>
+            <div v-for="(project, i) in projects"
+                 :key="`project-${i}`"
+                 class="card m-4">
+                <div class="card-body px-4">
+                    <div class="row" id="idx_metadata">
+                        <div class="сol-6 position-relative;">
+                            <div class="position-absolute top-0 end-0">
+                                <div class="d-flex flex-row text-muted">
+                                    <div data-bs-toggle="tooltip"
+                                         data-bs-placement="top"
+                                         title="Project created"
+                                         class="d-flex flex-column align-items-center justify-content-center border border-light pt-2"
+                                         style="width: 120px">
+                                        <div class="px-2">
+                                            <i class="fa-regular fa-clock"></i>
+                                        </div>
+                                        <div class="px-2">${project.idx_created_at} ago</div>
+                                    </div>
+                                    <div data-bs-toggle="tooltip"
+                                         v-if="project.idx_forks_count"
+                                         data-bs-placement="top"
+                                         title="Project forks"
+                                         class="d-flex flex-column align-items-center justify-content-center border border-light pt-2"
+                                         style="width: 120px">
+                                        <div class="px-2">
+                                            <i class="fa-solid fa-code-fork"></i>
+                                        </div>
+                                        <div class="px-2">${project.idx_forks_count}</div>
+                                    </div>
+                                    <div data-bs-toggle="tooltip"
+                                         v-if="project.idx_stars_count"
+                                         data-bs-placement="top"
+                                         title="Project stars"
+                                         class="d-flex flex-column align-items-center justify-content-center border border-light pt-2"
+                                         style="width: 120px">
+                                        <div class="px-2">
+                                            <i class="fa-regular fa-star"></i>
+                                        </div>
+                                        <div class="px-2">${project.idx_stars_count}</div>
+                                    </div>
+                                    <div data-bs-toggle="tooltip"
+                                         v-if="project.idx_contributors_count"
+                                         data-bs-placement="top"
+                                         title="Project contributors"
+                                         class="d-flex flex-column align-items-center justify-content-center border border-light pt-2"
+                                         style="width: 120px">
+                                        <div class="px-2">
+                                            <i class="fa-regular fa-user"></i>
+                                        </div>
+                                        <div class="px-2">${project.idx_contributors_count}</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-6 mb-2">
+                            <div id="idx_name" class="d-flex flex-row align-self-center">
+                                <span v-if="levelStyleMap[project.idx_level]" class="fa-stack pr-4">
+                                    <i class="fas fa-circle fa-stack-2x"
+                                       :style="`color: ${levelStyleMap[project.idx_level]['color']}`"></i>
+                                    <i :class="`fas ${levelStyleMap[project.idx_level]['icon']} fa-stack-1x fa-inverse`"></i>
+                                </span>
+                                <h4 class="px-1">
+                                    <a :href="`${project.idx_url}`" target="_blank">${project.idx_name}</a>
+                                </h4>
+                            </div>
+                        </div>
+                    </div>
+                    <div id="idx_leaders" class="mb-2" v-if="project.idx_leaders.length">
+                        Leader<span v-if="project.idx_leaders.length > 1">s</span>: <span v-for="(leader, i) in project.idx_leaders">
+                        <a v-if="leader.startsWith('@')"
+                           target="_blank"
+                           :href="`https://github.com/${leader.replace(/^@/, '')}`">${leader}</a>
+                        <a v-else href="" class="pe-none text-decoration-none text-reset">${leader}</a>
+                        <span v-if="i < project.idx_leaders.length - 1">,</span></span>
+                    </div>
+                    <div id="idx_summary" class="mb-1">
+                        <div v-html="project.idx_summary_md"></div>
+                    </div>
+                    <div class="row"></div>
+                    <div id="idx_topics">
+                        <div>
+                            <div role="button"
+                                 data-bs-toggle="tooltip"
+                                 data-bs-placement="bottom"
+                                 title="Click to search by"
+                                 @click="clickSearch(topic)"
+                                 class="badge bg-secondary mx-1 mt-2"
+                                 v-for="topic in project.idx_topics">${topic}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <script>
+        const {
+            createApp
+        } = Vue;
+        createApp({
+            delimiters: ['${', '}'],
+            data() {
+                return {
+                    projects: [],
+                    selectedProject: {},
+                    search: '',
+                    isManual: true,
+                    levelStyleMap: {
+                        2: {
+                            color: "#53AAE5",
+                            icon: "fa-egg"
+                        },
+                        3: {
+                            color: "#FFA500",
+                            icon: "fa-flask"
+                        },
+                        3.5: {
+                            color: "#800080",
+                            icon: "fa-city"
+                        },
+                        4: {
+                            color: "#38a047",
+                            icon: "fa-flag"
+                        },
+                    }
+                };
+            },
+            watch: {
+                search() {
+                    if (this.isManual) {
+                        this.handleInput();
+                    } else {
+                        this.getProjects();
+                    }
+                }
+            },
+            methods: {
+                async getProjects() {
+                    const response = await fetch(`/api/v1/owasp/search/project?q=${this.search}`)
+                        .then((res) => res.json())
+                        .then((json) => {
+                            json.forEach(project => {
+                                project.idx_summary_md = marked.parse(project.idx_summary || '');
+                                project.idx_created_at = dayjs.unix(project.idx_created_at || '').fromNow(true);
+                                project.idx_topics = project.idx_topics ? project.idx_topics.sort(() => Math.random() - 0.5).slice(0, 20) : [];
+                            });
+                            this.projects = json;
+                        })
+                        .catch((err) => console.error("There was an error! ", err));
+                },
+                showProjectDetails(project) {
+                    this.selectedProject = project;
+                },
+                handleInput(event) {
+                    clearTimeout(this.timeout);
+                    this.timeout = setTimeout(this.getProjects, 1000);
+                },
+                clickSearch(search) {
+                    this.isManual = false;
+                    this.search = search;
+                    document.body.scrollTop = 0;
+                    document.documentElement.scrollTop = 0;
+                }
+            },
+            mounted() {
+                dayjs.extend(dayjs_plugin_relativeTime);
+                this.getProjects();
+                const url = new URL(window.location.href);
+                const params = new URLSearchParams(url.search);
+                const searchQuery = params.get('q');
+                if (searchQuery) {
+                    this.isManual = true;
+                    this.search = searchQuery;
+                }
+            }
+        }).mount('#app');
+    </script>
+    <style scoped lang="scss">
+        .text-3 {
+            display: -webkit-box;
+            -webkit-box-orient: vertical;
+            -webkit-line-clamp: 3;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
 
-<head>
-  <meta charset="UTF-8" />
-  <link
-    rel="stylesheet"
-    href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"
-  />
-</head>
+        a {
+            color: #1d7bd7;
+            text-decoration: none;
 
-<script src="{% static 'js/htmx.min.js' %}"></script>
-
-<h3>Find a project</h3>
-<input
-  autocomplete="off"
-  class="form-control"
-  id="query"
-  name="q"
-  placeholder="Type To Search..."
-  type="search"
-  hx-get="{% url 'api-search-projects' %}"
-  hx-indicator=".htmx-indicator"
-  hx-swap="none"
-  hx-target="#search-results"
-  hx-trigger="load, input changed delay:1000ms, search"
-/>
-<span class="htmx-indicator"> Searching... </span>
-
-<script>
-  document
-    .getElementById('query')
-    .addEventListener('htmx:afterRequest', function (event) {
-      var jsonResponse = event.detail.xhr.response;
-      var hits = JSON.parse(jsonResponse);
-
-      const resultsContainer = document.getElementById('search-results');
-      resultsContainer.innerHTML = '';
-
-      hits.forEach((hit) => {
-        const highlightedName = hit._highlightResult.idx_name.value;
-        const topics = hit.idx_topics;
-        const createdAt = new Date(hit.idx_created_at * 1000);
-
-        const url = hit.idx_url;
-
-        const resultItem = document.createElement('div');
-        resultItem.innerHTML = `
-          <h2><a href="${url}" target="_blank">${highlightedName}</a></h2>
-          <p>Tags: ${topics}. Created at: ${createdAt}</p>
-          <p></p>
-        `;
-
-        resultsContainer.appendChild(resultItem);
-      });
-    });
-</script>
-
-<div id="search-results"></div>
+            :hover {
+                text-decoration: underline;
+            }
+        }
+    </style>
+{% endblock content %}
diff --git a/backend/poetry.lock b/backend/poetry.lock
index 4dc3676dd..faf52f661 100644
--- a/backend/poetry.lock
+++ b/backend/poetry.lock
@@ -1,4 +1,4 @@
-# This file is automatically @generated by Poetry 1.8.3 and should not be changed by hand.
+# This file is automatically @generated by Poetry 1.7.1 and should not be changed by hand.
 
 [[package]]
 name = "algoliasearch"
@@ -42,13 +42,13 @@ files = [
 
 [[package]]
 name = "anyio"
-version = "4.4.0"
+version = "4.5.0"
 description = "High level compatibility layer for multiple asynchronous event loop implementations"
 optional = false
 python-versions = ">=3.8"
 files = [
-    {file = "anyio-4.4.0-py3-none-any.whl", hash = "sha256:c1b2d8f46a8a812513012e1107cb0e68c17159a7a594208005a57dc776e1bdc7"},
-    {file = "anyio-4.4.0.tar.gz", hash = "sha256:5aadc6a1bbb7cdb0bede386cac5e2940f5e2ff3aa20277e991cf028e0585ce94"},
+    {file = "anyio-4.5.0-py3-none-any.whl", hash = "sha256:fdeb095b7cc5a5563175eedd926ec4ae55413bb4be5770c424af0ba46ccb4a78"},
+    {file = "anyio-4.5.0.tar.gz", hash = "sha256:c5a275fe5ca0afd788001f58fca1e69e29ce706d746e317d660e21f70c530ef9"},
 ]
 
 [package.dependencies]
@@ -56,9 +56,9 @@ idna = ">=2.8"
 sniffio = ">=1.1"
 
 [package.extras]
-doc = ["Sphinx (>=7)", "packaging", "sphinx-autodoc-typehints (>=1.2.0)", "sphinx-rtd-theme"]
-test = ["anyio[trio]", "coverage[toml] (>=7)", "exceptiongroup (>=1.2.0)", "hypothesis (>=4.0)", "psutil (>=5.9)", "pytest (>=7.0)", "pytest-mock (>=3.6.1)", "trustme", "uvloop (>=0.17)"]
-trio = ["trio (>=0.23)"]
+doc = ["Sphinx (>=7.4,<8.0)", "packaging", "sphinx-autodoc-typehints (>=1.2.0)", "sphinx-rtd-theme"]
+test = ["anyio[trio]", "coverage[toml] (>=7)", "exceptiongroup (>=1.2.0)", "hypothesis (>=4.0)", "psutil (>=5.9)", "pytest (>=7.0)", "pytest-mock (>=3.6.1)", "trustme", "uvloop (>=0.21.0b1)"]
+trio = ["trio (>=0.26.1)"]
 
 [[package]]
 name = "asgiref"
@@ -312,6 +312,20 @@ files = [
     {file = "charset_normalizer-3.3.2-py3-none-any.whl", hash = "sha256:3e4d1f6587322d2788836a99c69062fbb091331ec940e02d12d179c1d53e25fc"},
 ]
 
+[[package]]
+name = "click"
+version = "8.1.7"
+description = "Composable command line interface toolkit"
+optional = false
+python-versions = ">=3.7"
+files = [
+    {file = "click-8.1.7-py3-none-any.whl", hash = "sha256:ae74fb96c20a0277a1d615f1e4d73c8414f5a98db8b799a7931d1582f3390c28"},
+    {file = "click-8.1.7.tar.gz", hash = "sha256:ca9853ad459e787e2192211578cc907e7594e294c7ccc834310722b41b9ca6de"},
+]
+
+[package.dependencies]
+colorama = {version = "*", markers = "platform_system == \"Windows\""}
+
 [[package]]
 name = "colorama"
 version = "0.4.6"
@@ -456,6 +470,21 @@ ssh = ["bcrypt (>=3.1.5)"]
 test = ["certifi", "cryptography-vectors (==43.0.1)", "pretend", "pytest (>=6.2.0)", "pytest-benchmark", "pytest-cov", "pytest-xdist"]
 test-randomorder = ["pytest-randomly"]
 
+[[package]]
+name = "cssbeautifier"
+version = "1.15.1"
+description = "CSS unobfuscator and beautifier."
+optional = false
+python-versions = "*"
+files = [
+    {file = "cssbeautifier-1.15.1.tar.gz", hash = "sha256:9f7064362aedd559c55eeecf6b6bed65e05f33488dcbe39044f0403c26e1c006"},
+]
+
+[package.dependencies]
+editorconfig = ">=0.12.2"
+jsbeautifier = "*"
+six = ">=1.13.0"
+
 [[package]]
 name = "deprecated"
 version = "1.2.14"
@@ -588,6 +617,40 @@ files = [
 [package.dependencies]
 django = ">=4.2"
 
+[[package]]
+name = "djlint"
+version = "1.35.2"
+description = "HTML Template Linter and Formatter"
+optional = false
+python-versions = "<4.0,>=3.8"
+files = [
+    {file = "djlint-1.35.2-py3-none-any.whl", hash = "sha256:4ba995bad378f2afa77c8ea56ba1c14429d9ff26a18e8ae23bc71eedb9152243"},
+    {file = "djlint-1.35.2.tar.gz", hash = "sha256:318de9d4b9b0061a111f8f5164ecbacd8215f449dd4bd5a76d2a691c815ee103"},
+]
+
+[package.dependencies]
+click = ">=8.0.1"
+colorama = ">=0.4.4"
+cssbeautifier = ">=1.14.4"
+html-tag-names = ">=0.1.2"
+html-void-elements = ">=0.1.0"
+jsbeautifier = ">=1.14.4"
+json5 = ">=0.9.11"
+pathspec = ">=0.12.0"
+PyYAML = ">=6.0"
+regex = ">=2023"
+tqdm = ">=4.62.2"
+
+[[package]]
+name = "editorconfig"
+version = "0.12.4"
+description = "EditorConfig File Locator and Interpreter for Python"
+optional = false
+python-versions = "*"
+files = [
+    {file = "EditorConfig-0.12.4.tar.gz", hash = "sha256:24857fa1793917dd9ccf0c7810a07e05404ce9b823521c7dce22a4fb5d125f80"},
+]
+
 [[package]]
 name = "execnet"
 version = "2.1.1"
@@ -650,6 +713,28 @@ files = [
     {file = "h11-0.14.0.tar.gz", hash = "sha256:8f19fbbe99e72420ff35c00b27a34cb9937e902a8b810e2c88300c6f0a3b699d"},
 ]
 
+[[package]]
+name = "html-tag-names"
+version = "0.1.2"
+description = "List of known HTML tag names"
+optional = false
+python-versions = ">=3.7,<4.0"
+files = [
+    {file = "html-tag-names-0.1.2.tar.gz", hash = "sha256:04924aca48770f36b5a41c27e4d917062507be05118acb0ba869c97389084297"},
+    {file = "html_tag_names-0.1.2-py3-none-any.whl", hash = "sha256:eeb69ef21078486b615241f0393a72b41352c5219ee648e7c61f5632d26f0420"},
+]
+
+[[package]]
+name = "html-void-elements"
+version = "0.1.0"
+description = "List of HTML void tag names."
+optional = false
+python-versions = ">=3.7,<4.0"
+files = [
+    {file = "html-void-elements-0.1.0.tar.gz", hash = "sha256:931b88f84cd606fee0b582c28fcd00e41d7149421fb673e1e1abd2f0c4f231f0"},
+    {file = "html_void_elements-0.1.0-py3-none-any.whl", hash = "sha256:784cf39db03cdeb017320d9301009f8f3480f9d7b254d0974272e80e0cb5e0d2"},
+]
+
 [[package]]
 name = "httpcore"
 version = "1.0.5"
@@ -830,6 +915,31 @@ files = [
     {file = "jmespath-1.0.1.tar.gz", hash = "sha256:90261b206d6defd58fdd5e85f478bf633a2901798906be2ad389150c5c60edbe"},
 ]
 
+[[package]]
+name = "jsbeautifier"
+version = "1.15.1"
+description = "JavaScript unobfuscator and beautifier."
+optional = false
+python-versions = "*"
+files = [
+    {file = "jsbeautifier-1.15.1.tar.gz", hash = "sha256:ebd733b560704c602d744eafc839db60a1ee9326e30a2a80c4adb8718adc1b24"},
+]
+
+[package.dependencies]
+editorconfig = ">=0.12.2"
+six = ">=1.13.0"
+
+[[package]]
+name = "json5"
+version = "0.9.25"
+description = "A Python implementation of the JSON5 data format."
+optional = false
+python-versions = ">=3.8"
+files = [
+    {file = "json5-0.9.25-py3-none-any.whl", hash = "sha256:34ed7d834b1341a86987ed52f3f76cd8ee184394906b6e22a1e0deb9ab294e8f"},
+    {file = "json5-0.9.25.tar.gz", hash = "sha256:548e41b9be043f9426776f05df8635a00fe06104ea51ed24b67f908856e151ae"},
+]
+
 [[package]]
 name = "lxml"
 version = "5.3.0"
@@ -1012,13 +1122,13 @@ files = [
 
 [[package]]
 name = "openai"
-version = "1.46.0"
+version = "1.46.1"
 description = "The official Python library for the openai API"
 optional = false
 python-versions = ">=3.7.1"
 files = [
-    {file = "openai-1.46.0-py3-none-any.whl", hash = "sha256:8e423690b121d0268c7bb83b552e14f339b0ba250e1d0f70d145c194e79c4e1b"},
-    {file = "openai-1.46.0.tar.gz", hash = "sha256:0c5a783530d7cd90e2370dbd52d9239d2d53dc7a0badf9ee1e2e23d3f148969b"},
+    {file = "openai-1.46.1-py3-none-any.whl", hash = "sha256:7517f07117cf66012bbc55c49fd6b983eaac0f3d2a09c90cba1140d4455e4290"},
+    {file = "openai-1.46.1.tar.gz", hash = "sha256:e5cf7f268bf516de23686d496c9dae7f0dcdcd0e87af4d288deeab8329fcbbaf"},
 ]
 
 [package.dependencies]
@@ -1045,6 +1155,17 @@ files = [
     {file = "packaging-24.1.tar.gz", hash = "sha256:026ed72c8ed3fcce5bf8950572258698927fd1dbda10a5e981cdf0ac37f4f002"},
 ]
 
+[[package]]
+name = "pathspec"
+version = "0.12.1"
+description = "Utility library for gitignore style pattern matching of file paths."
+optional = false
+python-versions = ">=3.8"
+files = [
+    {file = "pathspec-0.12.1-py3-none-any.whl", hash = "sha256:a0d503e138a4c123b27490a4f7beda6a01c6f288df0e4a8b79c7eb0dc7b4cc08"},
+    {file = "pathspec-0.12.1.tar.gz", hash = "sha256:a482d51503a1ab33b1c67a6c3813a26953dbdc71c31dacaef9a838c4e29f5712"},
+]
+
 [[package]]
 name = "platformdirs"
 version = "4.3.6"
@@ -1499,6 +1620,109 @@ files = [
     {file = "pyyaml-6.0.2.tar.gz", hash = "sha256:d584d9ec91ad65861cc08d42e834324ef890a082e591037abe114850ff7bbc3e"},
 ]
 
+[[package]]
+name = "regex"
+version = "2024.9.11"
+description = "Alternative regular expression module, to replace re."
+optional = false
+python-versions = ">=3.8"
+files = [
+    {file = "regex-2024.9.11-cp310-cp310-macosx_10_9_universal2.whl", hash = "sha256:1494fa8725c285a81d01dc8c06b55287a1ee5e0e382d8413adc0a9197aac6408"},
+    {file = "regex-2024.9.11-cp310-cp310-macosx_10_9_x86_64.whl", hash = "sha256:0e12c481ad92d129c78f13a2a3662317e46ee7ef96c94fd332e1c29131875b7d"},
+    {file = "regex-2024.9.11-cp310-cp310-macosx_11_0_arm64.whl", hash = "sha256:16e13a7929791ac1216afde26f712802e3df7bf0360b32e4914dca3ab8baeea5"},
+    {file = "regex-2024.9.11-cp310-cp310-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:46989629904bad940bbec2106528140a218b4a36bb3042d8406980be1941429c"},
+    {file = "regex-2024.9.11-cp310-cp310-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:a906ed5e47a0ce5f04b2c981af1c9acf9e8696066900bf03b9d7879a6f679fc8"},
+    {file = "regex-2024.9.11-cp310-cp310-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:e9a091b0550b3b0207784a7d6d0f1a00d1d1c8a11699c1a4d93db3fbefc3ad35"},
+    {file = "regex-2024.9.11-cp310-cp310-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:5ddcd9a179c0a6fa8add279a4444015acddcd7f232a49071ae57fa6e278f1f71"},
+    {file = "regex-2024.9.11-cp310-cp310-manylinux_2_5_i686.manylinux1_i686.manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:6b41e1adc61fa347662b09398e31ad446afadff932a24807d3ceb955ed865cc8"},
+    {file = "regex-2024.9.11-cp310-cp310-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:ced479f601cd2f8ca1fd7b23925a7e0ad512a56d6e9476f79b8f381d9d37090a"},
+    {file = "regex-2024.9.11-cp310-cp310-musllinux_1_2_aarch64.whl", hash = "sha256:635a1d96665f84b292e401c3d62775851aedc31d4f8784117b3c68c4fcd4118d"},
+    {file = "regex-2024.9.11-cp310-cp310-musllinux_1_2_i686.whl", hash = "sha256:c0256beda696edcf7d97ef16b2a33a8e5a875affd6fa6567b54f7c577b30a137"},
+    {file = "regex-2024.9.11-cp310-cp310-musllinux_1_2_ppc64le.whl", hash = "sha256:3ce4f1185db3fbde8ed8aa223fc9620f276c58de8b0d4f8cc86fd1360829edb6"},
+    {file = "regex-2024.9.11-cp310-cp310-musllinux_1_2_s390x.whl", hash = "sha256:09d77559e80dcc9d24570da3745ab859a9cf91953062e4ab126ba9d5993688ca"},
+    {file = "regex-2024.9.11-cp310-cp310-musllinux_1_2_x86_64.whl", hash = "sha256:7a22ccefd4db3f12b526eccb129390942fe874a3a9fdbdd24cf55773a1faab1a"},
+    {file = "regex-2024.9.11-cp310-cp310-win32.whl", hash = "sha256:f745ec09bc1b0bd15cfc73df6fa4f726dcc26bb16c23a03f9e3367d357eeedd0"},
+    {file = "regex-2024.9.11-cp310-cp310-win_amd64.whl", hash = "sha256:01c2acb51f8a7d6494c8c5eafe3d8e06d76563d8a8a4643b37e9b2dd8a2ff623"},
+    {file = "regex-2024.9.11-cp311-cp311-macosx_10_9_universal2.whl", hash = "sha256:2cce2449e5927a0bf084d346da6cd5eb016b2beca10d0013ab50e3c226ffc0df"},
+    {file = "regex-2024.9.11-cp311-cp311-macosx_10_9_x86_64.whl", hash = "sha256:3b37fa423beefa44919e009745ccbf353d8c981516e807995b2bd11c2c77d268"},
+    {file = "regex-2024.9.11-cp311-cp311-macosx_11_0_arm64.whl", hash = "sha256:64ce2799bd75039b480cc0360907c4fb2f50022f030bf9e7a8705b636e408fad"},
+    {file = "regex-2024.9.11-cp311-cp311-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:a4cc92bb6db56ab0c1cbd17294e14f5e9224f0cc6521167ef388332604e92679"},
+    {file = "regex-2024.9.11-cp311-cp311-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:d05ac6fa06959c4172eccd99a222e1fbf17b5670c4d596cb1e5cde99600674c4"},
+    {file = "regex-2024.9.11-cp311-cp311-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:040562757795eeea356394a7fb13076ad4f99d3c62ab0f8bdfb21f99a1f85664"},
+    {file = "regex-2024.9.11-cp311-cp311-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:6113c008a7780792efc80f9dfe10ba0cd043cbf8dc9a76ef757850f51b4edc50"},
+    {file = "regex-2024.9.11-cp311-cp311-manylinux_2_5_i686.manylinux1_i686.manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:8e5fb5f77c8745a60105403a774fe2c1759b71d3e7b4ca237a5e67ad066c7199"},
+    {file = "regex-2024.9.11-cp311-cp311-musllinux_1_2_aarch64.whl", hash = "sha256:54d9ff35d4515debf14bc27f1e3b38bfc453eff3220f5bce159642fa762fe5d4"},
+    {file = "regex-2024.9.11-cp311-cp311-musllinux_1_2_i686.whl", hash = "sha256:df5cbb1fbc74a8305b6065d4ade43b993be03dbe0f8b30032cced0d7740994bd"},
+    {file = "regex-2024.9.11-cp311-cp311-musllinux_1_2_ppc64le.whl", hash = "sha256:7fb89ee5d106e4a7a51bce305ac4efb981536301895f7bdcf93ec92ae0d91c7f"},
+    {file = "regex-2024.9.11-cp311-cp311-musllinux_1_2_s390x.whl", hash = "sha256:a738b937d512b30bf75995c0159c0ddf9eec0775c9d72ac0202076c72f24aa96"},
+    {file = "regex-2024.9.11-cp311-cp311-musllinux_1_2_x86_64.whl", hash = "sha256:e28f9faeb14b6f23ac55bfbbfd3643f5c7c18ede093977f1df249f73fd22c7b1"},
+    {file = "regex-2024.9.11-cp311-cp311-win32.whl", hash = "sha256:18e707ce6c92d7282dfce370cd205098384b8ee21544e7cb29b8aab955b66fa9"},
+    {file = "regex-2024.9.11-cp311-cp311-win_amd64.whl", hash = "sha256:313ea15e5ff2a8cbbad96ccef6be638393041b0a7863183c2d31e0c6116688cf"},
+    {file = "regex-2024.9.11-cp312-cp312-macosx_10_9_universal2.whl", hash = "sha256:b0d0a6c64fcc4ef9c69bd5b3b3626cc3776520a1637d8abaa62b9edc147a58f7"},
+    {file = "regex-2024.9.11-cp312-cp312-macosx_10_9_x86_64.whl", hash = "sha256:49b0e06786ea663f933f3710a51e9385ce0cba0ea56b67107fd841a55d56a231"},
+    {file = "regex-2024.9.11-cp312-cp312-macosx_11_0_arm64.whl", hash = "sha256:5b513b6997a0b2f10e4fd3a1313568e373926e8c252bd76c960f96fd039cd28d"},
+    {file = "regex-2024.9.11-cp312-cp312-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:ee439691d8c23e76f9802c42a95cfeebf9d47cf4ffd06f18489122dbb0a7ad64"},
+    {file = "regex-2024.9.11-cp312-cp312-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:a8f877c89719d759e52783f7fe6e1c67121076b87b40542966c02de5503ace42"},
+    {file = "regex-2024.9.11-cp312-cp312-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:23b30c62d0f16827f2ae9f2bb87619bc4fba2044911e2e6c2eb1af0161cdb766"},
+    {file = "regex-2024.9.11-cp312-cp312-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:85ab7824093d8f10d44330fe1e6493f756f252d145323dd17ab6b48733ff6c0a"},
+    {file = "regex-2024.9.11-cp312-cp312-manylinux_2_5_i686.manylinux1_i686.manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:8dee5b4810a89447151999428fe096977346cf2f29f4d5e29609d2e19e0199c9"},
+    {file = "regex-2024.9.11-cp312-cp312-musllinux_1_2_aarch64.whl", hash = "sha256:98eeee2f2e63edae2181c886d7911ce502e1292794f4c5ee71e60e23e8d26b5d"},
+    {file = "regex-2024.9.11-cp312-cp312-musllinux_1_2_i686.whl", hash = "sha256:57fdd2e0b2694ce6fc2e5ccf189789c3e2962916fb38779d3e3521ff8fe7a822"},
+    {file = "regex-2024.9.11-cp312-cp312-musllinux_1_2_ppc64le.whl", hash = "sha256:d552c78411f60b1fdaafd117a1fca2f02e562e309223b9d44b7de8be451ec5e0"},
+    {file = "regex-2024.9.11-cp312-cp312-musllinux_1_2_s390x.whl", hash = "sha256:a0b2b80321c2ed3fcf0385ec9e51a12253c50f146fddb2abbb10f033fe3d049a"},
+    {file = "regex-2024.9.11-cp312-cp312-musllinux_1_2_x86_64.whl", hash = "sha256:18406efb2f5a0e57e3a5881cd9354c1512d3bb4f5c45d96d110a66114d84d23a"},
+    {file = "regex-2024.9.11-cp312-cp312-win32.whl", hash = "sha256:e464b467f1588e2c42d26814231edecbcfe77f5ac414d92cbf4e7b55b2c2a776"},
+    {file = "regex-2024.9.11-cp312-cp312-win_amd64.whl", hash = "sha256:9e8719792ca63c6b8340380352c24dcb8cd7ec49dae36e963742a275dfae6009"},
+    {file = "regex-2024.9.11-cp313-cp313-macosx_10_13_universal2.whl", hash = "sha256:c157bb447303070f256e084668b702073db99bbb61d44f85d811025fcf38f784"},
+    {file = "regex-2024.9.11-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:4db21ece84dfeefc5d8a3863f101995de646c6cb0536952c321a2650aa202c36"},
+    {file = "regex-2024.9.11-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:220e92a30b426daf23bb67a7962900ed4613589bab80382be09b48896d211e92"},
+    {file = "regex-2024.9.11-cp313-cp313-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:eb1ae19e64c14c7ec1995f40bd932448713d3c73509e82d8cd7744dc00e29e86"},
+    {file = "regex-2024.9.11-cp313-cp313-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:f47cd43a5bfa48f86925fe26fbdd0a488ff15b62468abb5d2a1e092a4fb10e85"},
+    {file = "regex-2024.9.11-cp313-cp313-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:9d4a76b96f398697fe01117093613166e6aa8195d63f1b4ec3f21ab637632963"},
+    {file = "regex-2024.9.11-cp313-cp313-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:0ea51dcc0835eea2ea31d66456210a4e01a076d820e9039b04ae8d17ac11dee6"},
+    {file = "regex-2024.9.11-cp313-cp313-manylinux_2_5_i686.manylinux1_i686.manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:b7aaa315101c6567a9a45d2839322c51c8d6e81f67683d529512f5bcfb99c802"},
+    {file = "regex-2024.9.11-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:c57d08ad67aba97af57a7263c2d9006d5c404d721c5f7542f077f109ec2a4a29"},
+    {file = "regex-2024.9.11-cp313-cp313-musllinux_1_2_i686.whl", hash = "sha256:f8404bf61298bb6f8224bb9176c1424548ee1181130818fcd2cbffddc768bed8"},
+    {file = "regex-2024.9.11-cp313-cp313-musllinux_1_2_ppc64le.whl", hash = "sha256:dd4490a33eb909ef5078ab20f5f000087afa2a4daa27b4c072ccb3cb3050ad84"},
+    {file = "regex-2024.9.11-cp313-cp313-musllinux_1_2_s390x.whl", hash = "sha256:eee9130eaad130649fd73e5cd92f60e55708952260ede70da64de420cdcad554"},
+    {file = "regex-2024.9.11-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:6a2644a93da36c784e546de579ec1806bfd2763ef47babc1b03d765fe560c9f8"},
+    {file = "regex-2024.9.11-cp313-cp313-win32.whl", hash = "sha256:e997fd30430c57138adc06bba4c7c2968fb13d101e57dd5bb9355bf8ce3fa7e8"},
+    {file = "regex-2024.9.11-cp313-cp313-win_amd64.whl", hash = "sha256:042c55879cfeb21a8adacc84ea347721d3d83a159da6acdf1116859e2427c43f"},
+    {file = "regex-2024.9.11-cp38-cp38-macosx_10_9_universal2.whl", hash = "sha256:35f4a6f96aa6cb3f2f7247027b07b15a374f0d5b912c0001418d1d55024d5cb4"},
+    {file = "regex-2024.9.11-cp38-cp38-macosx_10_9_x86_64.whl", hash = "sha256:55b96e7ce3a69a8449a66984c268062fbaa0d8ae437b285428e12797baefce7e"},
+    {file = "regex-2024.9.11-cp38-cp38-macosx_11_0_arm64.whl", hash = "sha256:cb130fccd1a37ed894824b8c046321540263013da72745d755f2d35114b81a60"},
+    {file = "regex-2024.9.11-cp38-cp38-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:323c1f04be6b2968944d730e5c2091c8c89767903ecaa135203eec4565ed2b2b"},
+    {file = "regex-2024.9.11-cp38-cp38-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:be1c8ed48c4c4065ecb19d882a0ce1afe0745dfad8ce48c49586b90a55f02366"},
+    {file = "regex-2024.9.11-cp38-cp38-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:b5b029322e6e7b94fff16cd120ab35a253236a5f99a79fb04fda7ae71ca20ae8"},
+    {file = "regex-2024.9.11-cp38-cp38-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:f6fff13ef6b5f29221d6904aa816c34701462956aa72a77f1f151a8ec4f56aeb"},
+    {file = "regex-2024.9.11-cp38-cp38-manylinux_2_5_i686.manylinux1_i686.manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:587d4af3979376652010e400accc30404e6c16b7df574048ab1f581af82065e4"},
+    {file = "regex-2024.9.11-cp38-cp38-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:079400a8269544b955ffa9e31f186f01d96829110a3bf79dc338e9910f794fca"},
+    {file = "regex-2024.9.11-cp38-cp38-musllinux_1_2_aarch64.whl", hash = "sha256:f9268774428ec173654985ce55fc6caf4c6d11ade0f6f914d48ef4719eb05ebb"},
+    {file = "regex-2024.9.11-cp38-cp38-musllinux_1_2_i686.whl", hash = "sha256:23f9985c8784e544d53fc2930fc1ac1a7319f5d5332d228437acc9f418f2f168"},
+    {file = "regex-2024.9.11-cp38-cp38-musllinux_1_2_ppc64le.whl", hash = "sha256:ae2941333154baff9838e88aa71c1d84f4438189ecc6021a12c7573728b5838e"},
+    {file = "regex-2024.9.11-cp38-cp38-musllinux_1_2_s390x.whl", hash = "sha256:e93f1c331ca8e86fe877a48ad64e77882c0c4da0097f2212873a69bbfea95d0c"},
+    {file = "regex-2024.9.11-cp38-cp38-musllinux_1_2_x86_64.whl", hash = "sha256:846bc79ee753acf93aef4184c040d709940c9d001029ceb7b7a52747b80ed2dd"},
+    {file = "regex-2024.9.11-cp38-cp38-win32.whl", hash = "sha256:c94bb0a9f1db10a1d16c00880bdebd5f9faf267273b8f5bd1878126e0fbde771"},
+    {file = "regex-2024.9.11-cp38-cp38-win_amd64.whl", hash = "sha256:2b08fce89fbd45664d3df6ad93e554b6c16933ffa9d55cb7e01182baaf971508"},
+    {file = "regex-2024.9.11-cp39-cp39-macosx_10_9_universal2.whl", hash = "sha256:07f45f287469039ffc2c53caf6803cd506eb5f5f637f1d4acb37a738f71dd066"},
+    {file = "regex-2024.9.11-cp39-cp39-macosx_10_9_x86_64.whl", hash = "sha256:4838e24ee015101d9f901988001038f7f0d90dc0c3b115541a1365fb439add62"},
+    {file = "regex-2024.9.11-cp39-cp39-macosx_11_0_arm64.whl", hash = "sha256:6edd623bae6a737f10ce853ea076f56f507fd7726bee96a41ee3d68d347e4d16"},
+    {file = "regex-2024.9.11-cp39-cp39-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:c69ada171c2d0e97a4b5aa78fbb835e0ffbb6b13fc5da968c09811346564f0d3"},
+    {file = "regex-2024.9.11-cp39-cp39-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:02087ea0a03b4af1ed6ebab2c54d7118127fee8d71b26398e8e4b05b78963199"},
+    {file = "regex-2024.9.11-cp39-cp39-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:69dee6a020693d12a3cf892aba4808fe168d2a4cef368eb9bf74f5398bfd4ee8"},
+    {file = "regex-2024.9.11-cp39-cp39-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:297f54910247508e6e5cae669f2bc308985c60540a4edd1c77203ef19bfa63ca"},
+    {file = "regex-2024.9.11-cp39-cp39-manylinux_2_5_i686.manylinux1_i686.manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:ecea58b43a67b1b79805f1a0255730edaf5191ecef84dbc4cc85eb30bc8b63b9"},
+    {file = "regex-2024.9.11-cp39-cp39-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:eab4bb380f15e189d1313195b062a6aa908f5bd687a0ceccd47c8211e9cf0d4a"},
+    {file = "regex-2024.9.11-cp39-cp39-musllinux_1_2_aarch64.whl", hash = "sha256:0cbff728659ce4bbf4c30b2a1be040faafaa9eca6ecde40aaff86f7889f4ab39"},
+    {file = "regex-2024.9.11-cp39-cp39-musllinux_1_2_i686.whl", hash = "sha256:54c4a097b8bc5bb0dfc83ae498061d53ad7b5762e00f4adaa23bee22b012e6ba"},
+    {file = "regex-2024.9.11-cp39-cp39-musllinux_1_2_ppc64le.whl", hash = "sha256:73d6d2f64f4d894c96626a75578b0bf7d9e56dcda8c3d037a2118fdfe9b1c664"},
+    {file = "regex-2024.9.11-cp39-cp39-musllinux_1_2_s390x.whl", hash = "sha256:e53b5fbab5d675aec9f0c501274c467c0f9a5d23696cfc94247e1fb56501ed89"},
+    {file = "regex-2024.9.11-cp39-cp39-musllinux_1_2_x86_64.whl", hash = "sha256:0ffbcf9221e04502fc35e54d1ce9567541979c3fdfb93d2c554f0ca583a19b35"},
+    {file = "regex-2024.9.11-cp39-cp39-win32.whl", hash = "sha256:e4c22e1ac1f1ec1e09f72e6c44d8f2244173db7eb9629cc3a346a8d7ccc31142"},
+    {file = "regex-2024.9.11-cp39-cp39-win_amd64.whl", hash = "sha256:faa3c142464efec496967359ca99696c896c591c56c53506bac1ad465f66e919"},
+    {file = "regex-2024.9.11.tar.gz", hash = "sha256:6c188c307e8433bcb63dc1915022deb553b4203a70722fc542c363bf120a01fd"},
+]
+
 [[package]]
 name = "requests"
 version = "2.32.3"
@@ -1591,13 +1815,13 @@ slack-sdk = ">=3.26.0,<4"
 
 [[package]]
 name = "slack-sdk"
-version = "3.33.0"
+version = "3.33.1"
 description = "The Slack API Platform SDK for Python"
 optional = false
 python-versions = ">=3.6"
 files = [
-    {file = "slack_sdk-3.33.0-py2.py3-none-any.whl", hash = "sha256:853bb55154115d080cae342c4099f2ccb559a78ae8d0f5109b49842401a920fa"},
-    {file = "slack_sdk-3.33.0.tar.gz", hash = "sha256:070eb1fb355c149a5f80fa0be6eeb5f5588e4ddff4dd76acf060454435cb037e"},
+    {file = "slack_sdk-3.33.1-py2.py3-none-any.whl", hash = "sha256:ef93beec3ce9c8f64da02fd487598a05ec4bc9c92ceed58f122dbe632691cbe2"},
+    {file = "slack_sdk-3.33.1.tar.gz", hash = "sha256:e328bb661d95db5f66b993b1d64288ac7c72201a745b4c7cf8848dafb7b74e40"},
 ]
 
 [package.extras]
@@ -1790,4 +2014,4 @@ files = [
 [metadata]
 lock-version = "2.0"
 python-versions = "^3.12"
-content-hash = "0434d597647a424a156f1d6bc8739a73fdd387c253c977a4cc59e051e9fc84c6"
+content-hash = "6edf8f133ff9876a1ad8368d982c7300c1959bed1879f33ac16697d503ab1313"
diff --git a/backend/pyproject.toml b/backend/pyproject.toml
index dbb71a829..f92ecd738 100644
--- a/backend/pyproject.toml
+++ b/backend/pyproject.toml
@@ -37,11 +37,13 @@ python = "^3.12"
 pyyaml = "^6.0.2"
 requests = "^2.32.3"
 slack-bolt = "^1.20.1"
+djlint = "^1.35.2"
 
 [tool.poetry.group.dev.dependencies]
 pre-commit = "^3.8.0"
 ruff = "^0.5.7"
 isort = "^5.13.2"
+djlint = "^1.35.2"
 
 
 [tool.poetry.group.test.dependencies]
@@ -52,6 +54,12 @@ pytest-xdist = "^3.0"
 pytest-mock = "^3.0"
 python-dotenv = "^1.0.1"
 
+[tool.djlint]
+format = true
+format_js = true
+format_css = true
+indent = 4
+
 [tool.isort]
 known_third_party = ["django", "rest_framework"]
 known_first_party = ["apps"]
diff --git a/backend/static/img/owasp_icon_black_sm.png b/backend/static/img/owasp_icon_black_sm.png
new file mode 100644
index 000000000..27f3381df
Binary files /dev/null and b/backend/static/img/owasp_icon_black_sm.png differ
diff --git a/backend/templates/admin/base_site.html b/backend/templates/admin/base_site.html
index 74b99ae6c..b3c294004 100644
--- a/backend/templates/admin/base_site.html
+++ b/backend/templates/admin/base_site.html
@@ -1,7 +1,7 @@
 {% extends "admin/base.html" %}
-
 {% block title %}OWASP Nest{% endblock %}
-
 {% block branding %}
-    <h1 id="site-name"><a href="{% url 'admin:index' %}">OWASP Nest</a></h1>
+    <h1 id="site-name">
+        <a href="{% url 'admin:index' %}">OWASP Nest</a>
+    </h1>
 {% endblock %}
diff --git a/backend/templates/base.html b/backend/templates/base.html
new file mode 100644
index 000000000..8f1b71e4a
--- /dev/null
+++ b/backend/templates/base.html
@@ -0,0 +1,59 @@
+{% load static %}
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Vue in Django</title>
+        <link rel="stylesheet"
+              href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" />
+        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
+              rel="stylesheet"
+              integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
+              crossorigin="anonymous">
+        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
+                integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
+                crossorigin="anonymous"></script>
+        <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/dayjs@1/dayjs.min.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/dayjs@1/plugin/relativeTime.js"></script>
+        <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
+        <style>
+            .page {
+                background-color: #f4f6fc;
+            }
+        </style>
+    </head>
+    <body class="page">
+        {% block content %}
+            <div class="banner">
+                <nav class="navbar navbar-expand-lg sticky-top border-bottom border-body mb-4"
+                     data-bs-theme="light"
+                     style="background-color: #97AFC7">
+                    <div class="container-fluid">
+                        <img style="width: 60px;
+                                    height: 60px"
+                             src="{% static 'img/owasp_icon_black_sm.png' %}"
+                             alt="">
+                        <a class="navbar-brand" href="">Nest</a>
+                        <button class="navbar-toggler"
+                                type="button"
+                                data-bs-toggle="collapse"
+                                data-bs-target="#navbarNavAltMarkup"
+                                aria-controls="navbarNavAltMarkup"
+                                aria-expanded="false"
+                                aria-label="Toggle navigation">
+                            <span class="navbar-toggler-icon"></span>
+                        </button>
+                        <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
+                            <div class="navbar-nav">
+                                <a class="nav-link" href="{% url 'projects' %}">Projects</a>
+                                <a class="nav-link" href="{% url 'project-issues' %}">Contribute</a>
+                            </div>
+                        </div>
+                    </div>
+                </nav>
+            </div>
+        {% endblock content %}
+    </body>
+</html>