diff options
| -rw-r--r-- | static/js/wiki.js | 15 | ||||
| -rw-r--r-- | static/style.css | 20 | ||||
| -rw-r--r-- | templates/wiki/base.html | 6 |
3 files changed, 40 insertions, 1 deletions
diff --git a/static/js/wiki.js b/static/js/wiki.js new file mode 100644 index 00000000..6ef4efa9 --- /dev/null +++ b/static/js/wiki.js @@ -0,0 +1,15 @@ +"use strict"; + +(function(){ // Use a closure to avoid polluting global scope + const visible_class = "uk-visible@s"; + const sidebar = document.getElementById("wiki-sidebar"); + const display_button = document.getElementById("wiki-sidebar-button"); + + display_button.onclick = function() { + if (sidebar.classList.contains(visible_class)) { + sidebar.classList.remove(visible_class) + } else { + sidebar.classList.add(visible_class) + } + } +}()); diff --git a/static/style.css b/static/style.css index b404ced3..b76b2e57 100644 --- a/static/style.css +++ b/static/style.css @@ -226,4 +226,24 @@ td.right-border, th.right-border { textarea.fira-code { line-height: 1.3 !important; +} + +#wiki-sidebar { + transition: width ease 1s; +} + +#wiki-sidebar-button { + color: white; + height: 3rem; + width: 3rem; + min-height: 3rem; + min-width: 3rem; + align-items: center; + justify-content: center; + /*box-shadow: unset; */ + border: 1px solid rgba(0, 0, 0, 0.11); +} + +.code{ + overflow-x: scroll; }
\ No newline at end of file diff --git a/templates/wiki/base.html b/templates/wiki/base.html index 126ab4a3..9fe4b4e9 100644 --- a/templates/wiki/base.html +++ b/templates/wiki/base.html @@ -31,7 +31,7 @@ <div class="uk-offcanvas-content uk-flex uk-flex-column"> {% include "main/navigation.html" %} <div class="uk-flex uk-flex-row uk-flex-1"> - <div class="uk-card uk-card-body uk-flex-left uk-flex uk-card-primary"> + <div class="uk-card uk-card-body uk-flex-left uk-flex uk-card-primary uk-visible@s" id="wiki-sidebar"> <ul class="uk-nav-default uk-nav-parent-icon" uk-nav id="wiki-nav"> {% if data is defined and current_page == "wiki.page" %} {% if "headers" in data and data.headers %} @@ -188,6 +188,9 @@ </li> </ul> </div> + <a class="uk-flex-left uk-flex uk-flex-column uk-background-primary uk-hidden@s uk-hidden@m uk-hidden@l uk-hidden@xl" id="wiki-sidebar-button"> + <div class="uk-flex-center"><i class="uk-icon fa-fw far fa-bars"></i></div> + </a> <div class="uk-section" style="flex-grow: 1; margin: 0 1rem 1rem;"> {% block content %}{% endblock %} </div> @@ -209,5 +212,6 @@ </footer> <script src='{{ static_file('js/countdown.js') }}'></script> + <script src='{{ static_file('js/wiki.js') }}'></script> </body> </html> |