aboutsummaryrefslogtreecommitdiffstats
path: root/pydis_site/templates
diff options
context:
space:
mode:
authorGravatar kosayoda <[email protected]>2021-04-01 19:11:28 +0800
committerGravatar kosayoda <[email protected]>2021-04-01 19:11:28 +0800
commitbbb6fc242a4eb10551a8549c400f3db88658fce1 (patch)
tree24624910bcf33e1b16033885e619a4d629ea953f /pydis_site/templates
parentDocument defining a table of contents for a page. (diff)
Add a dropdown menu listing direct children.
This only shows when the page is also a category, since regular pages have no children and regular categories already list their children.
Diffstat (limited to 'pydis_site/templates')
-rw-r--r--pydis_site/templates/content/base.html5
-rw-r--r--pydis_site/templates/content/dropdown.html28
2 files changed, 33 insertions, 0 deletions
diff --git a/pydis_site/templates/content/base.html b/pydis_site/templates/content/base.html
index 19eec5d4..21895479 100644
--- a/pydis_site/templates/content/base.html
+++ b/pydis_site/templates/content/base.html
@@ -14,6 +14,7 @@
<section class="breadcrumb-section section">
<div class="container">
+ {# Article breadcrumb #}
<nav class="breadcrumb is-pulled-left" aria-label="breadcrumbs">
<ul>
{% for item in breadcrumb_items %}
@@ -22,6 +23,10 @@
<li class="is-active"><a href="#">{{ page_title }}</a></li>
</ul>
</nav>
+ {# Sub-Article dropdown for category pages #}
+ {% if subarticles %}
+ {% include "content/dropdown.html" %}
+ {% endif %}
</div>
</section>
diff --git a/pydis_site/templates/content/dropdown.html b/pydis_site/templates/content/dropdown.html
new file mode 100644
index 00000000..711be113
--- /dev/null
+++ b/pydis_site/templates/content/dropdown.html
@@ -0,0 +1,28 @@
+{% load str_methods %}
+
+<script>
+ document.addEventListener("DOMContentLoaded", () => {
+ const dropdown = document.querySelector(".dropdown");
+ dropdown.addEventListener("click", () => {
+ dropdown.classList.toggle("is-active");
+ })
+ });
+</script>
+
+<div class="dropdown is-pulled-right is-right">
+ <div class="dropdown-trigger">
+ <a aria-haspopup="true" aria-controls="subarticle-menu">
+ <span>Sub-Articles</span>
+ <span class="icon is-small">
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
+ </span>
+ </a>
+ </div>
+ <div class="dropdown-menu" id="subarticle-menu" role="menu">
+ <div class="dropdown-content">
+ {% for page in subarticles|dictsort:0 %}
+ <a href="{{page}}" class="dropdown-item">{{ page.title|replace_hyphens:" " }}</a>
+ {% endfor %}
+ </div>
+ </div>
+</div>