Add htmx support to bit-badger and personal

- Tweak transitions on tech-blog
- Fix URL forwarding on settings save
- Add newer/older posts to tech-blog single post template
This commit is contained in:
2022-05-31 19:17:23 -04:00
parent 1fd2bfd08e
commit 7bd9b8d35c
12 changed files with 213 additions and 42 deletions

View File

@@ -0,0 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ page_title }} &raquo; Bit Badger Solutions</title>
</head>
<body>
{{ content }}
</body>
</html>

View File

@@ -7,7 +7,7 @@
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Oswald|Raleway">
{% page_head -%}
</head>
<body>
<body hx-boost="true" hx-target="main" hx-indicator="#loadOverlay" hx-swap="innerHTML show:body:top">
<header class="site-header">
<div class="header-logo">
<a href="{{ "" | relative_link }}">
@@ -27,8 +27,9 @@
</a>
</div>
</header>
{{ content }}
<footer>
<div class="load-overlay" id="loadOverlay"><h1>Loading&hellip;</h1></div>
<main>{{ content }}</main>
<footer hx-boost="false">
<div>
<small>
{% if logged_on -%}
@@ -43,5 +44,6 @@
A <strong><a href="{{ "" | relative_link }}">Bit Badger Solutions</a></strong> original design
</div>
</footer>
{% page_foot %}
</body>
</html>

View File

@@ -0,0 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>
{%- if is_home -%}
{{ web_log.name }}{% if web_log.subtitle %} | {{ web_log.subtitle.value }}{% endif %}
{%- else -%}
{{ page_title | strip_html }}{% if page_title and page_title != "" %} &raquo; {% endif %}{{ web_log.name }}
{%- endif -%}
</title>
</head>
<body>
{{ content }}
</body>
</html>

View File

@@ -18,7 +18,7 @@
<script src="{{ "djs.js" | theme_asset }}"></script>
{% page_head -%}
</head>
<body>
<body hx-boost="true" hx-target="main" hx-indicator="#loadOverlay" hx-swap="innerHTML show:body:top">
<nav class="site-header" role="navigation">
<p><a class="nav-home" href="{{ "" | relative_link }}">{{ web_log.name }}</a></p>
{%- if web_log.subtitle %}<p>{{ web_log.subtitle.value }}</p>{% endif -%}
@@ -31,7 +31,8 @@
</p>
<p class="mobile"><a href="#links">Site Links</a></p>
</nav>
{{ content }}
<div class="load-overlay" id="loadOverlay"><h1>Loading...</h1></div>
<main>{{ content }}</main>
<footer class="part-1" id="links">
{%- for page in page_list %}
<p class="mobile"><a href="{{ page | relative_link }}">{{ page.title }}</a></p>
@@ -128,7 +129,7 @@
style="border-width:0;">
</a>
</div>
<div class="copy">
<div class="copy" hx-boost="false">
&nbsp; Licensed by the
<a rel="license noopener" href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank">
Creative Commons Attribution-NonCommercial 4.0 International License
@@ -145,5 +146,6 @@
{%- endif %}
</div>
</footer>
{% page_foot %}
</body>
</html>

View File

@@ -53,16 +53,18 @@
<ul class="pager">
{% if model.newer_link -%}
<li class="previous item">
<h4 class="item-heading"><a href="{{ model.newer_link.value }}">&laquo;</a> Previous Post</h4>
<a href="{{ model.newer_link.value }}">{{ model.newer_name.value }}</a>
<h4 class="item-heading">
<a href="{{ model.newer_link.value | relative_link }}">&laquo;</a> Previous Post
</h4>
<a href="{{ model.newer_link.value | relative_link }}">{{ model.newer_name.value }}</a>
</li>
{%- else -%}
<li></li>
{% endif %}
{% if model.older_link -%}
<li class="next item">
<h4 class="item-heading">Next Post <a href="{{ model.older_link.value }}">&raquo;</a></h4>
<a href="{{ model.older_link.value }}">{{ model.older_name.value }}</a>
<h4 class="item-heading">Next Post <a href="{{ model.older_link.value | relative_ling }}">&raquo;</a></h4>
<a href="{{ model.older_link.value | relative_link }}">{{ model.older_name.value }}</a>
</li>
{%- endif -%}
</ul>

View File

@@ -69,7 +69,7 @@
</div>
</aside>
</div>
<footer>
<footer class="site-footer">
<span>
A production of
<a href="https://bitbadger.solutions" title="Bit Badger Solutions" target="_blank" rel="noopener"

View File

@@ -3,13 +3,14 @@
<h1 class="entry-title">
{{ post.title }}
</h1>
<p class="entry-meta">
Posted by {{ model.authors | value: post.author_id }} on {{ post.published_on | date: "dddd, MMMM d, yyyy" }}
at {{ post.published_on | date: "h:mm tt" | downcase }}
</p>
<header class="entry-header">
<p>
Posted by {{ model.authors | value: post.author_id }} on {{ post.published_on | date: "dddd, MMMM d, yyyy" }}
at {{ post.published_on | date: "h:mm tt" | downcase }}
</p>
{%- assign cat_count = post.category_ids | size -%}
{%- if cat_count > 0 %}
<p class="entry-meta">
<p>
<small>
Categorized under
{% for cat_id in post.category_ids -%}
@@ -20,23 +21,38 @@
</small>
</p>
{%- endif %}
</header>
<div class="entry-content">{{ post.text }}</div>
<div class="entry-footer">
<footer class="entry-footer">
{%- assign tag_count = post.tags | size -%}
{%- if tag_count > 0 %}
<span>
Tagged
<p>
Tagged:
{% for tag in post.tags -%}
<a href="{{ tag | tag_link }}" title="Tagged &ldquo;{{ tag | escape }}&rdquo;"
rel="tag">{{ tag }}</a>{% unless forloop.last %}, {% endunless %}
{%- endfor %}
</span> &bull;
</p>
{%- endif %}
Bookmark the
<a href="{{ post | absolute_link }}" rel="bookmark"
title="Permanent link to &ldquo;{{ post.title | strip_html | escape }}&rdquo;">
permalink
</a>
{%- if logged_on %} &bull; <a href="{{ post | edit_post_link }}">Edit Post</a>{% endif %}
</div>
<p>
Bookmark:
<a href="{{ post | absolute_link }}" rel="bookmark"
title="Permanent link to &ldquo;{{ post.title | strip_html | escape }}&rdquo;">
the permalink
</a>
</p>
<p>{%- if logged_on %}Edit: <a href="{{ post | edit_post_link }}">this post</a>{% else %}&nbsp;{% endif %}</p>
{% if model.newer_link -%}
<p>
Next Newer Post:
<a href="{{ model.newer_link.value | relative_link }}">{{ model.newer_name.value }}</a>
</p>
{% endif %}
{% if model.older_link -%}
<p>
Next Older Post:
<a href="{{ model.older_link.value | relative_link }}">{{ model.older_name.value }}</a>
</p>
{%- endif -%}
</footer>
</article>