binaryatrocity/acks-tools
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Navbar updates

Browse Source
This commit is contained in:
Brandon Cornejo 2020-12-09 23:14:12 -06:00
parent d07b9a0055
commit 4fa529b0a3
2 changed files with 74 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

83
acks/templates/base.html
View File

@ -1,19 +1,25 @@
{% set player_bar = [
('/npc/spells', 'spells', 'Spells'),
('/worldmap', 'worldmap', 'Maps'),
('https://reddit.com/r/PalismaACKS/wiki', 'redditwiki', 'Wiki'),
] %}
{% set judge_bar = [
('/lairs', 'lairs', 'Lairs'),
('http://autarch.co/treasure', 'treasure', 'Treasure'),
('/quest/list', 'questlist', 'Quests'),
('/npc/party', 'npcparty', 'Generate Party'),
('/npc/single', 'npcsingle', 'Generate NPC'),
('/wiki', 'wiki', 'Wiki'),
]%}
{% set navigation_bar = [ {% set navigation_bar = [
('/', 'index', 'Home'), ('/', 'index', 'Home'),
('/handbook', 'handbook', 'Handbook'), ('/handbook', 'handbook', 'Handbook'),
('/worldmap', 'worldmap', 'Maps'), (player_bar, 'section', 'Player Resources'),
('.header', 'generate', 'Generate'), (judge_bar, 'section', 'Judge Resources'),
('.header', 'other', 'Other'), ('https://reddit.com/r/PalismaACKS', 'subreddit', '/r/PalismaACKS'),
('/npc/spells', 'spells', 'Spells'),
('/quest/list', 'questlist', 'Quests'),
('/wiki', 'wiki', 'Wiki'),
('/lairs', lairs', 'Lairs'),
] %}
{% set generation_bar = [
('/npc/party', 'npcparty', 'NPC Party'),
('/npc/single', 'npcsingle', 'Single NPC'),
('http://autarch.co/treasure', 'treasure', 'Treasure'),
] %} ] %}
{% set active_page = active_page|default('index') %} {% set active_page = active_page|default('index') %}
<!doctype html> <!doctype html>
@ -33,7 +39,20 @@
<script src="https://cdn.jsdelivr.net/npm/uikit@3.2.4/dist/js/uikit.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/uikit@3.2.4/dist/js/uikit.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/uikit@3.2.4/dist/js/uikit-icons.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/uikit@3.2.4/dist/js/uikit-icons.min.js"></script>
{% block head %} {% endblock %} <style>
h1 strong {
display: block;
font-size: 50%;
opacity: 0.65;
}
.uk-navbar-nav > li > a {
font-size: 1em;
text-transform: none;
}
</style>
{% block head %}
{% endblock %}
</head> </head>
<body> <body>
<nav class="uk-navbar-container" uk-navbar> <nav class="uk-navbar-container" uk-navbar>
@ -44,26 +63,24 @@
<div class="uk-navbar-center uk-visible@m"> <div class="uk-navbar-center uk-visible@m">
<ul class="uk-navbar-nav"> <ul class="uk-navbar-nav">
{% for href, id, label in navigation_bar %} {% for href, id, label in navigation_bar %}
<li {% if id == active_page %} class="uk-active" {% endif %}> {% if id == 'section' %}
{% if id == 'generate' %} <li>
<a href="">{{ label|e }}</a> <a href="">{{ label|e }}</a>
<div class="uk-navbar-dropdown"> <div class="uk-navbar-dropdown">
<ul class="uk-nav uk-navbar-dropdown-nav"> <ul class="uk-nav uk-navbar-dropdown-nav">
{% for ghref, gid, glabel in generation_bar %} {% for phref, pid, plabel in href %}
<li> <li>
<a href="{{ ghref | e }}" {% if gid == 'treasure' %}target="_blank"{% endif %}> <a href="{{ phref|e }}">{{ plabel|e }}</a>
{{ glabel|e }}
</a>
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>
</div> </div>
{% else %}
{% if href != '.header' %}
<a href="{{ href|e }}">{{ label|e }}</a>
{% endif %}
{% endif %}
</li> </li>
{% else %}
<li {% if id == active_page %} class="uk-active" {% endif %}>
<a href="{{ href|e }}">{{ label|e }}</a>
</li>
{% endif %}
{% endfor %} {% endfor %}
</ul> </ul>
</div> </div>
@ -72,17 +89,14 @@
<div class="uk-offcanvas-bar uk-flex uk-flex-column"> <div class="uk-offcanvas-bar uk-flex uk-flex-column">
<ul class="uk-nav uk-nav-primary uk-nav-center uk-margin-auto-vertical"> <ul class="uk-nav uk-nav-primary uk-nav-center uk-margin-auto-vertical">
{% for href, id, label in navigation_bar %} {% for href, id, label in navigation_bar %}
{% if href == '.header' %} {% if id == 'section' %}
<li class="uk-nav-header">{{ label|e }}</li> <li class="uk-nav-header uk-margin-large-top">{{ label|e }}</li>
{% if id == 'generate' %} {% for phref, pid, plabel in href %}
{% for ghref, gid, glabel in generation_bar %} <li {% if pid == active_page %} class="uk-active" {% endif %}>
<li {% if gid == active_page %} class="uk-active" {% endif %}> <a href="{{ phref|e }}">{{ plabel|e }}</a>
<a href="{{ ghref | e }}" {% if gid == 'treasure' %}target="_blank"{% endif %}>
{{ glabel|e }}
</a>
</li> </li>
{% endfor %} {% endfor %}
{% endif %} <li class="uk-margin-large-bottom"/>
{% else %} {% else %}
<li {% if id == active_page %} class="uk-active" {% endif %}> <li {% if id == active_page %} class="uk-active" {% endif %}>
<a href="{{ href|e }}">{{ label|e }}</a> <a href="{{ href|e }}">{{ label|e }}</a>
@ -101,5 +115,8 @@
ACKS &amp; related &copy; <a href="http://www.autarch.co/">Autarch</a>. ACKS &amp; related &copy; <a href="http://www.autarch.co/">Autarch</a>.
</div> </div>
</footer> </footer>
{% block scripts %}
{% endblock %}
</body> </body>
</html> </html>

34
acks/templates/lair_gallery.html
View File

@ -1,7 +1,7 @@
{% extends "base.html" %} {% extends "base.html" %}
{% set active_page = "lairs" %} {% set active_page = "lairs" %}
{% block title %}Maps{% endblock %} {% block title %}Dynamic Lairs{% endblock %}
{% block content %} {% block content %}
<div class="uk-flex uk-flex-center uk-margin-bottom uk-margin-top"> <div class="uk-flex uk-flex-center uk-margin-bottom uk-margin-top">
<h1 class="uk-text-center"><strong>Adventurer Conqueror King</strong>Dynamic Lairs</h1> <h1 class="uk-text-center"><strong>Adventurer Conqueror King</strong>Dynamic Lairs</h1>
@ -11,6 +11,7 @@
<!-- Animal Lairs --> <!-- Animal Lairs -->
<h2 class="uk-text-center"><strong>Animal Lairs</strong></h2> <h2 class="uk-text-center"><strong>Animal Lairs</strong></h2>
<div uk-slider> <div uk-slider>
<ul class="uk-slider-nav uk-dotnav uk-flex-center uk-margin"></ul>
<div class="uk-position-relative"> <div class="uk-position-relative">
<div class="uk-slider-container uk-light"> <div class="uk-slider-container uk-light">
<ul id="animal-lairs" class="uk-slider-items uk-child-width-1-2 uk-child-width-1-3@s uk-child-width-1-4@m"> <ul id="animal-lairs" class="uk-slider-items uk-child-width-1-2 uk-child-width-1-3@s uk-child-width-1-4@m">
@ -22,12 +23,12 @@
<a class="uk-position-center-left-out" href="#" uk-slidenav-previous uk-slider-item="previous"></a> <a class="uk-position-center-left-out" href="#" uk-slidenav-previous uk-slider-item="previous"></a>
<a class="uk-position-center-right-out" href="#" uk-slidenav-next uk-slider-item="next"></a> <a class="uk-position-center-right-out" href="#" uk-slidenav-next uk-slider-item="next"></a>
</div> </div>
<ul class="uk-slider-nav uk-dotnav uk-flex-center uk-margin"></ul>
</div> </div>
<!-- Humanoid Lairs --> <!-- Humanoid Lairs -->
<h2 class="uk-text-center"><strong>Humanoid Lairs</strong></h2> <h2 class="uk-text-center"><strong>Humanoid Lairs</strong></h2>
<div uk-slider> <div uk-slider>
<ul class="uk-slider-nav uk-dotnav uk-flex-center uk-margin"></ul>
<div class="uk-position-relative"> <div class="uk-position-relative">
<div class="uk-slider-container uk-light"> <div class="uk-slider-container uk-light">
<ul id="humanoid-lairs" class="uk-slider-items uk-child-width-1-2 uk-child-width-1-3@s uk-child-width-1-4@m"> <ul id="humanoid-lairs" class="uk-slider-items uk-child-width-1-2 uk-child-width-1-3@s uk-child-width-1-4@m">
@ -39,28 +40,12 @@
<a class="uk-position-center-left uk-position-small uk-hidden-hover" href="#" uk-slidenav-previous uk-slider-item="previous"></a> <a class="uk-position-center-left uk-position-small uk-hidden-hover" href="#" uk-slidenav-previous uk-slider-item="previous"></a>
<a class="uk-position-center-right uk-position-small uk-hidden-hover" href="#" uk-slidenav-next uk-slider-item="next"></a> <a class="uk-position-center-right uk-position-small uk-hidden-hover" href="#" uk-slidenav-next uk-slider-item="next"></a>
</div> </div>
<ul class="uk-slider-nav uk-dotnav uk-flex-center uk-margin"></ul>
</div> </div>
</div> </div>
<script src="https://cdn.jsdelivr.net/npm/lightgallery.js@1.4.0/dist/js/lightgallery.min.js" integrity="sha256-0Zhc9IDI5elFpwJZlvdAM4u/6qlxi4qIOUlHDVl5wjU=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/lg-thumbnail.js@1.2.0/dist/lg-thumbnail.min.js" integrity="sha256-h70L9O3prxviKHrPHwrId33HakkgnURiB1KBHDyZOJc=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/lg-fullscreen.js@1.2.0/dist/lg-fullscreen.min.js" integrity="sha256-5VFY2GRRpY51CgT/ku3jPvpWybxJ2n+pbDNz05amGwk=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/lg-zoom.js@1.3.0/dist/lg-zoom.min.js" integrity="sha256-pw9GIEB9jGoek+S5xfa2Uz/8dZVjZsIYVJxy3jK3qgI=" crossorigin="anonymous"></script>
<script type="text/javascript">
lightGallery(document.getElementById('animal-lairs'));
lightGallery(document.getElementById('humanoid-lairs'));
</script>
{% endblock %} {% endblock %}
{% block head %} {% block head %}
<style> <style>
h1 strong {
display: block;
font-size: 50%;
opacity: 0.65;
}
li.gallery-img-li { li.gallery-img-li {
overflow: hidden; overflow: hidden;
border-radius: 4px; border-radius: 4px;
@ -78,3 +63,16 @@ li.gallery-img-li > img {
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/lightgallery.js@1.4.0/dist/css/lightgallery.min.css" integrity="sha256-s47mXWRWvrLQNL9VRQX0ykfkIVSLfNJuingF/SZztsM=" crossorigin="anonymous"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/lightgallery.js@1.4.0/dist/css/lightgallery.min.css" integrity="sha256-s47mXWRWvrLQNL9VRQX0ykfkIVSLfNJuingF/SZztsM=" crossorigin="anonymous">
{% endblock %} {% endblock %}
{% block scripts %}
<script src="https://cdn.jsdelivr.net/npm/lightgallery.js@1.4.0/dist/js/lightgallery.min.js" integrity="sha256-0Zhc9IDI5elFpwJZlvdAM4u/6qlxi4qIOUlHDVl5wjU=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/lg-thumbnail.js@1.2.0/dist/lg-thumbnail.min.js" integrity="sha256-h70L9O3prxviKHrPHwrId33HakkgnURiB1KBHDyZOJc=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/lg-fullscreen.js@1.2.0/dist/lg-fullscreen.min.js" integrity="sha256-5VFY2GRRpY51CgT/ku3jPvpWybxJ2n+pbDNz05amGwk=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/lg-zoom.js@1.3.0/dist/lg-zoom.min.js" integrity="sha256-pw9GIEB9jGoek+S5xfa2Uz/8dZVjZsIYVJxy3jK3qgI=" crossorigin="anonymous"></script>
<script type="text/javascript">
lightGallery(document.getElementById('animal-lairs'));
lightGallery(document.getElementById('humanoid-lairs'));
</script>
{% endblock %}