bit-badger/myWebLog
1
0
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases 11 Activity

Add devotional theme

Browse Source
This commit is contained in:
Daniel J. Summers 2022-06-02 12:12:45 -04:00
parent e65fcc3831
commit de92761b04
10 changed files with 712 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/MyWebLog/appsettings.json
View File

@ -3,7 +3,7 @@
"hostname": "data02.bitbadger.solutions",
"database": "myWebLog_dev"
},
"Generator": "myWebLog 2.0-alpha27",
"Generator": "myWebLog 2.0-alpha28",
"Logging": {
"LogLevel": {
"MyWebLog.Handlers": "Debug"

183
src/MyWebLog/themes/awftw/index.liquid Normal file
View File

@ -0,0 +1,183 @@
<div class="content">
{% if is_category or is_tag %}
<h1 class="index-title">{{ page_title }}</h1>
<!--
TODO: Convert this to Liquid
if page.tag || page.category
h1.index-title
if page.category
if oldTestamentBooks.indexOf(page.category) >= 0 || newTestamentBooks.indexOf(page.category) >= 0
| Posts referencing the
if page.category !== 'Old Testament' && page.category !== 'New Testament'
= ' book of'
= ' ' + page.category
else
| Posts categorized &ldquo;#{page.category}&rdquo;
else
| Posts tagged &ldquo;#{page.tag}&rdquo;
if 1 !== page.current
small &nbsp; &nbsp; (page #{page.current})
-->
{% endif %}
{% for post in model.posts %}
<article class="item">
<h1 class="item-heading">
<a href="{{ post.permalink | relative_link }}"
title="Permanent Link to &ldquo;{{ post.title | strip_html | escape }}&rdquo;">
{{ post.title }}
</a>
</h1>
<p class="item-meta">
<i class="fa fa-calendar" title="Date"></i> {{ post.published_on | date: "dddd, MMMM d, yyyy" }} &nbsp;
{% comment %} TODO: reading time?
#[i.fa.fa-clock-o(title='Clock' aria-hidden='true')] #[= readingTime(post.content, 'minutes', 175)]
{% endcomment %}
</p>
{%- assign media = post.meta | value: "media" -%}
{%- unless media == "-- media not found --" %}
<aside class="podcast">
<p class="text-center"><strong>Listen While<br>You Read</strong></p>
<audio controls onplaying="awftw.countPlay('{{ media }}')">
<source src="https://files.bitbadger.solutions/devotions/{{ media }}">
</audio>
<p class="text-center">
<a class="dl" href="https://pdcst.click/c/awftw/files.bitbadger.solutions/devotions/{{ media }}" download>
<i class="fa fa-download" title="Download Audio"></i>
</a>
</p>
</aside>
{%- endunless %}
{{ post.text }}
</article>
{% endfor %}
<nav aria-label="pagination">
<div>{% if model.newer_link %}<a href="{{ model.newer_link.value }}">&#xab; Newer Posts</a>{% endif %}</div>
<div>{% if model.older_link %}<a href="{{ model.older_link.value }}">Older Posts &#xbb;</a>{% endif %}</div>
</nav>
</div>
<div class="sidebar">
<div class="item">
<h4 class="item-heading">Author</h4>
<p>Daniel is a man who wants to be used of God however He sees fit.</p>
<hr class="sidebar-sep">
<ul>
<li><a href="https://daniel.summershome.org/my-testimony">Daniel&rsquo;s Testimony</a></li>
<li><a href="{{ "2007/about-daniels-weekly-devotions.html" | relative_link }}">About This Site</a></li>
</ul>
</div>
<div class="item">
<h4 class="item-heading">Series</h4>
<h4 class="text-center">Advent Readings</h4>
<p class="text-center">
<a href="{{ "2019/advent-readings.html" | relative_link }}"
title="Advent Readings &bull; A Word from the Word">
About the Series
</a> &bull;
<a href=" {{ "category/series/advent-readings/" | relative_link }}">Read All</a>
<small class="count">(-{% comment %} TODO: count
#{catCount('series/advent-readings')})
{% endcomment %})</small>
</p>
<hr class="sidebar-sep">
<h4 class="text-center">Twisted Scripture</h4>
<p class="text-center">
<a href="{{ "2017/twisted-scripture.html" | relative_link }}"
title="Twisted Scripture &bull; A Word from the Word">
About the Series
</a> &bull;
<a href="{{ "category/series/twisted-scripture/" | relative_link }}">Read All</a>
<small class="count">(-{% comment %} TODO: count
#{catCount('series/twisted-scripture')})
{% endcomment %})</small>
</p>
<hr class="sidebar-sep">
<h4 class="text-center">The &ldquo;3:16s&rdquo; of the New Testament</h4>
<p class="text-center">
<a href="{{ "2007/the-316s-of-the-new-testament.html" | relative_link }}"
title="The &ldquo;3:16s&rdquo; of the New Testament &bull; A Word from the Word">
About the Series
</a> &bull;
<a href="{{ "category/series/the-3-16-s-of-the-new-testament/" | relative_link }}">Read All</a>
<small class="count">(-{% comment %} TODO: count
#{catCount('series/the-3-16-s-of-the-new-testament')})
{% endcomment %})</small>
</p>
</div>
{% comment %}
TODO: group categories by Old Testament / New Testament / Topics
(may work better once the categories are loaded and we can hard-code IDs
{% endcomment %}
<div class="item">
<h4 class="item-heading">Books</h4>
<p>Each devotion is categorized under the books of the Bible which are referenced within it.</p>
<hr class="sidebar-sep">
<h4 class="text-center">Old Testament</h4>
<p class="text-center">
<a href="{{ "category/old-testament/" | relative_link }}"
title="Devotions referencing the Old Testament">
See All
</a> <small class="count">(-{% comment %} TODO: count
#{catCount('old-testament')})
{% endcomment %})</small>
</p>
<ul>
{% for cat_id in ot_books -%}
{%- assign cat = categories | where: "id", cat_id | first -%}
<li>
{% if cat.post_count == 0 -%}
<span title="Devotions referencing the book of {{ cat.name }}">{{ cat.name }}</span>
<small class="count">(0)</small>
{%- else -%}
<a href="{{ cat | category_link }}"
title="Devotions referencing the book of {{ cat.name}}">
{{ cat.name }}
</a> <small class="count">({{ cat.post_count }})</small>
{%- endif %}
</li>
{%- endfor %}
</ul>
<hr class="sidebar-sep">
<h4 class="text-center">New Testament</h4>
<p class="text-center">
<a href="{{ "category/new-testament/" | relative_link }}"
title="Devotions referencing the New Testament">
See All
</a> <small class="count">(-{% comment %} TODO: count
#{catCount('new-testament')})
{% endcomment %})</small>
</p>
<ul>
{% for cat_id in nt_books -%}
{%- assign cat = categories | where: "id", cat_id | first -%}
<li>
{% if cat.post_count == 0 %}
<span title="Devotions referencing the book of {{ cat.name }}">{{ cat.name }}</span>
<small class="count">(0)</small>
{% else %}
<a href="{{ cat | category_link }}"
title="Devotions referencing the book of {{ cat.name }}">
{{ cat.name }}
</a> <small class="count">({{ cat.post_count }})</small>
{% endif %}
</li>
{% endfor %}
</ul>
</div>
<div class="item">
{% comment %}
- var topics = cats.filter(excludeBooks).filter(cat => !cat.slug.startsWith('series')).sort((a, b) => a.name.localeCompare(b.name))
{% endcomment %}
<h4 class="item-heading">Topics</h4>
<ul>
{% for cat_id in topics %}
{%- assign cat = categories | where: "id", cat_id | first -%}
<li>
<a href="{{ cat | category_link }}"
title="Devotions about {{ cat.name | escape }}">
{{ cat.name }}
</a> <small class="count">({{ cat.post_count }})</small>
</li>
{% endfor %}
</ul>
</div>
</div>

47
src/MyWebLog/themes/awftw/layout.liquid Normal file
View File

@ -0,0 +1,47 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<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>
<link rel="preload" href="https://fonts.googleapis.com/css?family=Quicksand|Federo|Istok+Web" as="style">
<link rel="preload" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" as="style">
<link rel="preload" href="{{ "style.css" | theme_asset }}" as="style">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
{% page_head -%}
</head>
<body {% comment %} hx-boost="true" hx-target="main" hx-indicator="#loadOverlay" hx-swap="innerHTML show:body:top" {% endcomment %}>
<header class="site-header">
<p class="site-title"><a class="navbar-brand" href="{{ "" | relative_link }}">{{ web_log.name }}</a></p>
{%- if web_log.subtitle %}<p class="site-subtitle">{{ web_log.subtitle.value }}</p>{% endif -%}
<p class="site-page">
<a href="{{ "gods-simple-plan-of-salvation/" | relative_link }}">God&rsquo;s Simple Plan of Salvation</a>
</p>
<p class="site-page"><a href="{{ "podcast/" | relative_link }}">Podcast</a></p>
</header>
{% comment %}<div class="load-overlay" id="loadOverlay"><h1>Loading...</h1></div>{% endcomment %}
<main class="container">{{ content }}</main>
<footer class="part-1"></footer>
<footer class="page-footer">
Designed by
<a href="https://bitbadger.solutions" title="Building the site you need to ensure your success!" target="_blank"
rel="noopener">
Bit Badger Solutions
</a> &bull; Powered by
<a href="https://github.com/bit-badger/myWebLog/tree/v2" target="_blank" rel="noopener">myWebLog</a> &bull;
{% if logged_on %}
<a href="{{ "admin/dashboard" | relative_link }}">Dashboard</a>
{% else %}
<a href="{{ "user/log-on" | relative_link }}">Log On</a>
{%- endif %}
</footer>
{% page_foot %}
</body>
</html>

6
src/MyWebLog/themes/awftw/single-page.liquid Normal file
View File

@ -0,0 +1,6 @@
<div class="content">
<article class="item">
<h1 class="item-heading">{{ page.title }}</h1>
{{ page.text }}
</article>
</div>

147
src/MyWebLog/themes/awftw/single-post.liquid Normal file
View File

@ -0,0 +1,147 @@
{%- assign post = model.posts | first -%}
<div class="content">
<article class="item">
<h1 class="item-heading">{{ post.title }}</h1>
{% assign media = post.meta | value: "media" %}
{%- unless media == "-- media not found --" %}
<aside class="podcast">
<p class="text-center"><strong>Listen While<br>You Read</strong></p>
<audio controls onplaying="awftw.countPlay('{{ media }}')">
<source src="https://files.bitbadger.solutions/devotions/{{ media }}">
</audio>
<p class="text-center">
<a class="dl" href="https://pdcst.click/c/awftw/files.bitbadger.solutions/devotions/{{ media }}" download>
<i class="fa fa-download" title="Download Audio"></i>
</a>
</p>
</aside>
{%- endunless %}
{{ post.text }}
</article>
<nav aria-label="pagination">
<div class="nav-previous">
{% if model.newer_link %}
<span class="post-nav">Previous Post</span><br>
<a class="post-nav-title" href="{{ model.newer_link.value }}">{{ model.newer_name.value }}</a>
{% endif %}
</div>
<div class="nav-next">
{% if model.older_link %}
<span class="post-nav">Next Post</span> <br>
<a class="post-nav-title" href="{{ model.older_link.value }}">{{ model.older_name.value }}</a>
{% endif %}
</div>
</nav>
</div>
<div class="sidebar post-sidebar">
<div class="item">
<h4 class="item-heading">Date</h4>
<div class="date-posted">
<i class="fa fa-calendar" title="Date" aria-hidden="true"></i>
{{ post.published_on | date: "dddd, MMMM d, yyyy" }}
</div>
</div>
{% comment %}
TODO: reading time?
<div class="item">
<h4 class="item-heading">Reading Time</h4>
<div class="text-center">
<i class="fa fa-clock-o" title="Clock" aria-hidden="true"></i>
#[= readingTime(page.content, 'minutes', 175)]
</div>
</div>
{% endcomment %}
{%- if post_ot_book_count > 0 or post_nt_book_count > 0 %}
<div class="item">
<h4 class="item-heading">Scripture</h4>
{%- if post_ot_book_count > 0 %}
<ul>
<li>
{%- assign cat_id = post_ot_books | first -%}
{%- assign cat = categories | where: "id", cat_id | first -%}
<span class=post-meta" style="white-space:nowrap;">
<i class="fa fa-book" title="Book" aria-hidden="true"></i>
<a href="{{ cat | category_link }}" title="References the {{ cat.name }}">{{ cat.name }}</a>
</span>
<ul>
{%- assign skipped_one = false -%}
{%- for cat_id in post_ot_books %}
{%- if skipped_one %}
{% assign cat = categories | where: "id", cat_id | first %}
<span class=post-meta" style="white-space:nowrap;">
<i class="fa fa-book" title="Book" aria-hidden="true"></i>
<a href="{{ cat | category_link }}" title="References the book of {{ cat.name }}">
{{ cat.name }}
</a>
</span>
{%- else -%}
{%- assign skipped_on = true -%}
{%- endif %}
{%- endfor %}
</ul>
</li>
</ul>
{%- endif %}
{%- if post_nt_book_count > 0 %}
<ul>
<li>
{%- assign cat_id = post_nt_books | first -%}
{%- assign cat = categories | where: "id", cat_id | first -%}
<span class=post-meta" style="white-space:nowrap;">
<i class="fa fa-book" title="Book" aria-hidden="true"></i>
<a href="{{ cat | category_link }}" title="References the {{ cat.name }}">{{ cat.name }}</a>
</span>
<ul>
{%- assign skipped_one = false -%}
{%- for cat_id in post_nt_books %}
{%- if skipped_one %}
{% assign cat = categories | where: "id", cat_id | first %}
<span class=post-meta" style="white-space:nowrap;">
<i class="fa fa-book" title="Book" aria-hidden="true"></i>
<a href="{{ cat | category_link }}" title="References the book of {{ cat.name }}">
{{ cat.name }}
</a>
</span>
{%- else -%}
{%- assign skipped_on = true -%}
{%- endif %}
{%- endfor %}
</ul>
</li>
</ul>
{%- endif %}
</div>
{%- endif %}
{%- if post_topic_count > 0 %}
<div class="item">
<h4 class="item-heading">Topics</h4>
<ul>
{%- for cat_id in post_topics %}
{%- assign cat = categories | where: "id", cat_id | first -%}
<li>
<span class="post-meta" style="white-space:nowrap;">
<i class="fa fa-folder-open-o" title="Category" aria-hidden="true"></i>
<a href="{{ cat | category_link }}" title="Categorized under {{ cat.name | escape }}">{{ cat.name }}</a>
</span>
</li>
{%- endfor %}
</ul>
</div>
{%- endif %}
{%- assign tag_count = post.tags | size -%}
{%- if tag_count > 0 %}
<div class="item">
<h4 class="item-heading">Tags</h4>
<ul>
{%- for tag in post.tags %}
<li>
<span class="post-meta" style="white-space:nowrap;">
<a href="{{ tag | tag_link }}" title="Tagged &ldquo;{{ tag }}&rdquo;">
<i class="fa fa-tag" aria-hidden="true"></i> {{ tag }}
</a>
</span>
{%- endfor %}
</ul>
</div>
{%- endif %}
</div>

BIN
src/MyWebLog/wwwroot/themes/awftw/img/paper.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.1 KiB

BIN
src/MyWebLog/wwwroot/themes/awftw/img/podcast/awftw.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 120 KiB

BIN
src/MyWebLog/wwwroot/themes/awftw/img/ribbon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.7 KiB

12
src/MyWebLog/wwwroot/themes/awftw/script.js Normal file
View File

@ -0,0 +1,12 @@
const awftw = {
counted: false,
countPlay: function (fileLink) {
if (!this.counted) {
const request = new XMLHttpRequest()
request.open('HEAD', 'https://pdcst.click/c/awftw/files.bitbadger.solutions/devotions/' + fileLink, true)
request.onload = function () { awftw.counted = true }
request.onerror = function () { }
request.send()
}
}
}

316
src/MyWebLog/wwwroot/themes/awftw/style.css Normal file
View File

@ -0,0 +1,316 @@
@import url('https://fonts.googleapis.com/css?family=Quicksand|Federo|Istok+Web');
:root {
--text-color: hsl(0, 0%, 10%);
--accent-color: green;
--link-color: green;
--superscript-color: #707070;
--bkg-color: lightgray;
--heading-bkg-color: darkgray;
--item-bkg-color: white;
--title-text-color: white;
--audio-bkg-color: hsla(0, 0%, 0%, .05);
--audio-text-color: hsla(0, 0%, 0%, .5);
}
@media (prefers-color-scheme: dark) {
:root {
--text-color: hsl(0, 0%, 80%);
--accent-color: hsl(120, 100%, 15%);
--link-color: hsl(120, 100%, 34%);
--superscript-color: hsl(0, 0%, 70%);
--bkg-color: hsl(0, 0%, 20%);
--heading-bkg-color: hsla(0, 0%, 100%, .2);
--item-bkg-color: hsla(0, 0%, 7%);
--audio-bkg-color: hsl(0, 0%, 10%);
--audio-text-color: hsl(0, 0%, 50%);
}
blockquote.bible {
background-color: var(--bkg-color);
background-image: linear-gradient(hsl(0, 0%, 85%), hsl(0, 0%, 85%)), url('../img/paper.png') repeat;
background-blend-mode: soft-light;
color: hsl(0, 0%, 95%);
}
.ref {
text-shadow: white 0 0 6px, white 0 0 6px, white 0 0 6px, white 0 0 6px;
}
.ref sup {
text-shadow: none;
}
.index-title {
text-shadow: white 0 0 6px, white 0 0 6px;
}
}
html {
background-color: var(--accent-color);
}
body {
font-family: "Istok Web",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
font-size: 1.1rem;
margin: 0;
color: var(--text-color);
background-color: var(--bkg-color);
}
a {
text-decoration: none;
}
a:link, a:visited {
color: var(--link-color);
}
a:hover {
text-decoration: underline;
}
h1, h2, h3, h4, p, ul {
margin-top: 0;
margin-bottom: 1rem;
}
.site-header {
display: flex;
flex-flow: row wrap;
align-items: flex-end;
margin-bottom: 1rem;
background-image: -webkit-gradient(linear, left top, left bottom, from(var(--accent-color)), to(var(--bkg-color)));
background-image: -webkit-linear-gradient(top, var(--accent-color), var(--bkg-color));
background-image: -moz-linear-gradient(top, var(--accent-color), var(--bkg-color));
background-image: linear-gradient(to bottom, var(--accent-color), var(--bkg-color));
}
.site-header a {
color: var(--title-text-color);
}
.site-header p {
padding-right: 2rem;
}
.site-title,
.index-title,
.item-heading,
.item-meta,
.post-meta,
.post-nav-title,
.page-footer a {
font-family: Federo,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
}
.site-title {
font-size: 2rem;
font-weight: bold;
padding-left: 1rem;
padding-top: .3rem;
}
.site-title a {
color: var(--title-text-color);
}
.container {
display: flex;
flex-direction: row;
justify-content: space-around;
max-width: 1400px;
margin: auto;
}
@media all and (max-width:78rem) {
.container {
flex-direction: column;
align-items: center;
}
}
.index-title {
color: black;
text-align: center;
}
.content {
max-width: 60rem;
margin: 0;
}
.sidebar {
min-width: 10rem;
max-width: 18rem;
font-size: 1rem;
display: flex;
flex-direction: column;
}
@media all and (max-width:60rem) {
.content {
padding: 0 .4rem;
}
}
@media all and (max-width:78rem) {
.sidebar {
width: 100%;
max-width: 60rem;
padding: 0;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-around;
}
.sidebar .item {
max-width: 12rem;
}
}
.sidebar h4 {
font-size: 1.2rem;
}
.sidebar ul {
padding-left: 1rem;
margin-bottom: .5rem;
}
.sidebar ul li {
list-style-type: none;
margin-bottom: .5rem;
}
.sidebar ul li ul > li {
margin-top: .5rem;
}
.sidebar .item > ul {
padding-left: 0;
}
.post-sidebar {
margin-top: 4rem;
}
@media all and (max-width:78rem) {
.post-sidebar {
margin-top: 0;
}
}
hr.sidebar-sep {
margin: 0 -.4rem .5rem -.4rem;
height: 1px;
border: 0;
color: var(--accent-color);
background-color: var(--accent-color);
}
blockquote {
margin: 1rem 2rem 1rem 1rem;
border-left: solid 3px var(--accent-color);
padding-left: 1rem;
}
blockquote.bible {
padding: 11px;
margin-left: 2rem;
border: 0;
background: var(--bkg-color) url('img/paper.png') repeat;
font-family: Quicksand, serif;
border-top: solid 1px black;
display: flow-root;
}
blockquote.bible cite {
display: block;
padding-right: 11px;
text-align: right;
background: var(--item-bkg-color) url('img/ribbon.png') no-repeat bottom left;
color: var(--text-color);
height: 28px;
font-style: normal;
position: relative;
top: 5px;
margin: 0 -11px -11px -12px;
}
.ref {
color: red;
}
blockquote.bible sup {
color: var(--superscript-color);
padding-right: .35rem;
}
.lord, .sc {
font-variant: small-caps;
}
.u {
text-decoration: underline;
}
blockquote {
font-size: 1.2rem;
}
blockquote footer cite {
font-style: normal;
}
blockquote footer cite::before {
content: ", ";
}
cite {
font-size: 1rem;
}
nav {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
margin-bottom: 1rem;
}
.nav-next {
text-align: right;
}
.post-nav {
font-size: .8rem;
text-transform: uppercase;
}
footer.part-1 {
height: 2rem;
background-image: -webkit-gradient(linear, left top, left bottom, from(var(--bkg-color)), to(var(--accent-color)));
background-image: -webkit-linear-gradient(top, var(--bkg-color), var(--accent-color));
background-image: -moz-linear-gradient(top, var(--bkg-color), var(--accent-color));
background-image: linear-gradient(to bottom, var(--bkg-color), var(--accent-color));
}
footer.page-footer {
padding: 0 .5rem .5rem 0;
text-align: right;
background-color: var(--accent-color);
color: var(--title-text-color);
font-size: 1rem;
}
footer.page-footer a:link,
footer.page-footer a:visited {
color: var(--title-text-color);
}
small.count {
padding-left: .35rem;
}
h1 {
font-size: 2rem;
}
.item {
border: solid 1px black;
background-color: var(--item-bkg-color);
padding: .4rem;
margin-bottom: 1.2rem;
}
.item-heading {
margin: -.4rem;
margin-bottom: .4rem;
border-bottom: solid 2px var(--link-color);
padding-bottom: .2rem;
text-align: center;
background-color: var(--heading-bkg-color);
}
.item-heading,
.item-heading a {
color: var(--title-text-color);
}
.item-meta {
margin: -.4rem;
margin-bottom: 1.2rem;
font-size: 1rem;
text-align: center;
}
.date-posted {
padding: 0 1rem;
}
.text-center {
text-align: center;
}
aside.podcast {
display: flex;
justify-content: space-around;
align-items: center;
background: var(--audio-bkg-color);
border: solid 1px var(--accent-color);
border-radius: .5rem;
color: var(--audio-text-color);
margin: 0 .5rem 1rem .5rem;
}
aside.podcast audio {
width: 100%;
}
aside.podcast p {
margin: 0 .5rem;
white-space: nowrap;
}
a.dl:link,
a.dl:visited {
color: var(--audio-text-color);
}