aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rwxr-xr-xsrc/input.css2
-rwxr-xr-xstatic/js/site.js7
-rw-r--r--templates/documentation.html5
-rw-r--r--templates/partials/doc/global_toc.html12
-rw-r--r--templates/partials/doc/global_toc_script.html35
-rw-r--r--templates/partials/doc/page_toc_script.html (renamed from templates/partials/doc/toc_script.html)25
-rw-r--r--templates/partials/shared/nav.html9
-rw-r--r--templates/partials/shared/search.html13
8 files changed, 63 insertions, 45 deletions
diff --git a/src/input.css b/src/input.css
index 1f4e978..f842bc1 100755
--- a/src/input.css
+++ b/src/input.css
@@ -91,7 +91,7 @@ p > code, p > strong > code, li > code, li > strong > code {
}
.page-content a {
- @apply font-semibold text-garage-orange border-b hover:border-garage-gray border-garage-orange bg-transparent hover:bg-garage-orange hover:text-white hover:rounded-sm hover:no-underline duration-150 transition;
+ @apply font-semibold text-garage-orange border-b border-garage-orange hover:text-red-500 hover:border-red-500 transition-all duration-500;
}
.page-content img {
diff --git a/static/js/site.js b/static/js/site.js
index d8e0d69..77913c3 100755
--- a/static/js/site.js
+++ b/static/js/site.js
@@ -195,12 +195,7 @@ function documentReadyCallback() {
}
document.addEventListener('click', function(ev) {
- if (ev.target.matches('#nav-search-btn') || ev.target.matches('#nav-search-btn-icon')) {
- openSearchModal();
- }
- else if (ev.target.matches('#close-modal-btn')
- || ev.target.matches('#close-modal-btn-icon')
- || !ev.target.closest('#search-modal')) {
+ if (!ev.target.closest('#search-modal')) {
closeSearchModal();
}
});
diff --git a/templates/documentation.html b/templates/documentation.html
index d22d9e6..3f48e55 100644
--- a/templates/documentation.html
+++ b/templates/documentation.html
@@ -13,7 +13,7 @@
{% include "partials/doc/global_toc.html" %}
<div class="col-span-full xl:col-span-3" style="min-height:85vh;">
<article class="box my-12 px-6 lg:px-8 xl:px-12">
- <div class="flex flex-col bg-gray-100 rounded-r shadow-sm w-full xl:w-max">
+ <div class="flex flex-col mb-10 bg-gray-100 rounded-r shadow-sm w-full xl:w-max">
<div class="flex flex-col border-l-4 border-garage-orange py-2 px-4 relative">
<h1 class="title leading-10 text-xl lg:text-2xl xl:text-3xl text-garage-orange font-semibold">
{{ page.title }}
@@ -53,6 +53,7 @@
{% set page = section %}
{% endif %}
{% if page.toc %}
- {% include "partials/doc/toc_script.html" %}
+ {% include "partials/doc/page_toc_script.html" %}
{% endif %}
+ {% include "partials/doc/global_toc_script.html" %}
{% endblock %}
diff --git a/templates/partials/doc/global_toc.html b/templates/partials/doc/global_toc.html
index 277739c..eea7d26 100644
--- a/templates/partials/doc/global_toc.html
+++ b/templates/partials/doc/global_toc.html
@@ -7,7 +7,7 @@
{% for page in section.pages %}
<a
href="{{ page.permalink | safe }}"
- class="bg-white border border-garage-orange block p-1 rounded block font-semibold hover:bg-garage-orange hover:bg-opacity-20
+ class="bg-white border border-garage-orange block p-1 rounded font-semibold hover:bg-garage-orange hover:bg-opacity-20
{% if current_path == page.path %} activePage text-garage-orange border-opacity-100 border-garage-orange {% endif %}">
{{ page.title }}
</a>
@@ -19,13 +19,15 @@
<li class="relative">
<a
href="{{ h1.permalink | safe }}"
- class="bg-white border border-garage-orange block p-1 rounded-r rounded-tl font-semibold
- {% if current_path == h1.path %} activePage text-garage-orange font-semibold border-opacity-100 border-garage-orange {% else %}text-gray-800{% endif %}
- ">
+ class="bg-white border border-garage-orange block p-1 rounded-r rounded-tl font-semibold {% if current_path == h1.path %}activePage text-garage-orange font-semibold border-opacity-100 border-garage-orange{% else %}text-gray-800{% endif %}">
{{ h1.title }}
</a>
{% if h1.pages %}
- <input type="checkbox" id="btn-{{ h1.title | slugify }}" class="deploySubMenu"/>
+ <input
+ type="checkbox"
+ id="btn-{{ h1.title | slugify }}"
+ class="deploySubMenu"
+ />
<label for="btn-{{ h1.title | slugify }}" class="absolute top-0 right-0.5 bg-garage-orange bg-opacity-10 border-l border-garage-orange border-opacity-20 cursor-pointer inline-block px-3 py-1" style="margin-top:0.08rem;">
<svg class="arrow w-6 h-6 text-garage-gray group-hover:text-garage-orange transform rotate-90" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
</label>
diff --git a/templates/partials/doc/global_toc_script.html b/templates/partials/doc/global_toc_script.html
new file mode 100644
index 0000000..42abcda
--- /dev/null
+++ b/templates/partials/doc/global_toc_script.html
@@ -0,0 +1,35 @@
+<script>
+// Global ToC
+/*
+ - Deploy current submenu (if any) and reploy others.
+ - Fixed ToC when user scrolls.
+*/
+
+document.addEventListener("DOMContentLoaded", function() {
+ var menusTriggers = document.getElementsByClassName("deploySubMenu");
+ var activeDocPage = document.getElementsByClassName("activePage")[0];
+ for (var i = 0; i < menusTriggers.length; i++) {
+ menusTriggers[i].checked = true;
+ }
+ let parentMenu = activeDocPage.parentElement.parentElement;
+ // Check if current page is the parent submenu page or just a child
+ if (parentMenu.classList.contains('subMenu')) { // child
+ parentMenu.previousElementSibling.previousElementSibling.checked = false;
+ } else { // parent
+ activeDocPage.nextElementSibling.checked = false;
+ }
+});
+
+window.addEventListener('scroll', function() {
+ if (document.body.clientWidth >= 1280) {
+ if (window.scrollY >= menuBarHeight) {
+ document.getElementById('main-toc-menu').classList.add('fixed', 'top-0', 'left-0');
+ document.getElementById('main-toc-menu').style.width = mainTocMenuWidth + 'px';
+ } else {
+ document.getElementById('main-toc-menu').classList.remove('fixed', 'top-0', 'left-0');
+ }
+ } else {
+
+ }
+});
+</script> \ No newline at end of file
diff --git a/templates/partials/doc/toc_script.html b/templates/partials/doc/page_toc_script.html
index 7d10ee6..efe4bac 100644
--- a/templates/partials/doc/toc_script.html
+++ b/templates/partials/doc/page_toc_script.html
@@ -5,22 +5,6 @@ const mainTocMenuWidth = document.getElementById('main-toc-menu').clientWidth;
const tocItems = document.querySelectorAll(".toc");
const navSections = new Array(tocItems.length);
- // Global ToC
-/*
- Fixed ToC when user scrolls.
-*/
-
-window.addEventListener('scroll', function() {
- if (window.screen.width >= 1280) {
- if (window.scrollY >= menuBarHeight) {
- document.getElementById('main-toc-menu').classList.add('fixed', 'top-0', 'left-0');
- document.getElementById('main-toc-menu').style.width = mainTocMenuWidth + 'px';
- } else {
- document.getElementById('main-toc-menu').classList.remove('fixed', 'top-0', 'left-0');
- }
- }
-});
-
// Page content
/*
Focus effect on current section anchor when user scrolls.
@@ -70,13 +54,4 @@ window.addEventListener('scroll', () => {
}
}, false);
-document.addEventListener("DOMContentLoaded", function() {
- var menusTriggers = document.getElementsByClassName("deploySubMenu");
- var activeDocPage = document.getElementsByClassName("activePage")[0];
- for (var i = 0; i < menusTriggers.length; i++) {
- menusTriggers[i].checked = true;
- }
- activeDocPage.parentElement.parentElement.previousElementSibling.previousElementSibling.checked = false;
-});
-
</script>
diff --git a/templates/partials/shared/nav.html b/templates/partials/shared/nav.html
index a4a4b99..adb1a70 100644
--- a/templates/partials/shared/nav.html
+++ b/templates/partials/shared/nav.html
@@ -22,13 +22,16 @@
{% endfor %}
{% endif %}
{% endfor %}
- <button
+ <a
id="nav-search-btn"
+ href="javascript:openSearchModal()"
type="button"
title="Open Search (alt + S)"
class="focus:bg-white hover:bg-white hover:shadow px-4 py-2 rounded-lg">
- <svg id="nav-search-btn-icon" class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>
- </button>
+ <svg id="nav-search-btn-icon" class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
+ </svg>
+ </a>
<a
href="https://garagehq.deuxfleurs.fr/_releases.html"
class="group flex items-center justify-center space-x-1 font-semibold shadow hover:shadow px-2 py-1.5 rounded text-white transition-all duration-500 bg-gradient-to-tl from-garage-orange via-orange-500 to-orange-300 bg-size-200 bg-pos-0 hover:bg-pos-100">
diff --git a/templates/partials/shared/search.html b/templates/partials/shared/search.html
index cb0ae2e..c41feca 100644
--- a/templates/partials/shared/search.html
+++ b/templates/partials/shared/search.html
@@ -17,9 +17,16 @@
<div class="search-results__items max-h-96 overflow-y-scroll p-2 md:p-4 focus:outline outline-garage-orange"></div>
</div>
</section>
- <button aria-label="close" id="close-modal-btn" class="absolute top-4 right-4 flex items-center group rounded-full shadow-inner bg-gray-300 border border-transparent hover:border-gray-500 bg-opacity-50 p-2">
- <svg id="close-modal-btn-icon" class="w-6 h-6 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
+ <a
+ aria-label="close"
+ type="button"
+ id="close-modal-btn"
+ href="javascript:closeSearchModal()"
+ class="absolute top-4 right-4 flex items-center group rounded-full shadow-inner bg-gray-300 border border-transparent hover:border-gray-500 bg-opacity-50 p-2">
+ <svg id="close-modal-btn-icon" class="w-6 h-6 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
+ </svg>
<small class="text-xs text-gray-400">(Esc)</small>
- </button>
+ </a>
</div>
</section> \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-21 21:27:55 +0000