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

Add DJS layout

Browse Source
This commit is contained in:
Daniel J. Summers 2022-04-26 00:30:37 -04:00
parent 96e7a4c23b
commit 08ec7ea653
4 changed files with 422 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

@ -1,7 +1,7 @@
{ {
"RethinkDB": { "RethinkDB": {
"hostname": "data02.bitbadger.solutions", "hostname": "data02.bitbadger.solutions",
"database": "myWebLog" "database": "myWebLog-dev"
}, },
"Generator": "myWebLog 2.0-alpha01" "Generator": "myWebLog 2.0-alpha01"
} }

147
src/MyWebLog/themes/daniel-j-summers/layout.liquid Normal file
View File

@ -0,0 +1,147 @@
<!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">
<meta name="generator" content="{{ generator }}">
<title>{{ page_title }} &raquo; {{ web_log.name }}</title>
<link rel="preload" href="https://fonts.googleapis.com/css?family=Quicksand|Oswald" 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="/themes/{{ web_log.theme_path }}/style.css" as="style">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" href="/themes/{{ web_log.theme_path }}/style.css">
{% if is_home -%}
<link rel="alternate" type="application/rss+xml" title="{{ web_log.name | escape }}" href="/feed.xml">
{%- endif %}
<script src="/themes/{{ web_log.theme_path }}/djs.js"></script>
</head>
<body>
<nav class="site-header" role="navigation">
<p><a class="nav-home" href="/">{{ web_log.name }}</a></p>
{%- if web_log.subtitle %}<p>{{ web_log.subtitle.value }}</p>{% endif -%}
<p class="nav-spacer"></p>
{% for page in page_list %}
<p class="desktop"><a href="{{ page.permalink }}">{{ page.title }}</a></p>
{% endfor %}
<p class="desktop">
<a href="https://devotions.summershome.org" target="_blank" rel="noopener">A Word from the Word</a>
</p>
<p class="mobile"><a href="#links">Site Links</a></p>
</nav>
{{ content }}
<footer class="part-1" id="links">
{% for page in page_list %}
<p class="mobile"><a href="{{ page.permalink }}">{{ page.title }}</a></p>
{% endfor %}
<p class="mobile">
<a href="https://devotions.summershome.org" target="_blank" rel="noopener">A Word from the Word</a>
</p>
</footer>
<footer class="part-2">
<div>
<div class="item">
<h4 class="item-heading">Tip Jar</h4>
<div class="text-center">
<p style="padding: 5px 0;">What do we holler?<br>&ldquo;Thanks for the dollar!&rdquo;</p>
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="encrypted"
value="-----BEGIN PKCS7-----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-----END PKCS7-----">
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donate_LG.gif" style="border:0;"
name="submit" alt="PayPal - The safer, easier way to pay online!">
<img src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" alt="" style="border:0;" width="1"
height="1">
</form>
</div>
</div>
<div class="item">
<h4 class="item-heading">Let&rsquo;s Go Geocaching</h4>
<div class="text-center">
<a href="https://www.geocaching.com/guide/" title="What Is Geocaching?" target="_blank" rel="noopener">
<img src="https://img.geocaching.com/stats/img.aspx?txt=I+am+the+search+engine!&uid=61a3c13b-9dbb-41d2-a695-9e3432d4d5ea"
alt="My Geocaching Stats" title="What Is Geocaching?" style="border:0;">
</a>
</div>
</div>
</div>
<div>
<div class="item">
<h4 class="item-heading">Tennessee Football</h4>
<div>
<table style="width:100%;"><tbody><tr>
<td style="width:75px;">
<a href="https://utsports.com" style="background:none;padding:0;" target="_blank" rel="noopener">
<img src="/themes/{{ web_log.theme_path }}/img/tennessee.png" alt="T" title="Tennessee Sports"
style="border:0;" width="75px">
</a>
</td>
<td class="text-center" style="line-height:1.3em;">
2021 Season &mdash; <strong>NR</strong><br>
<small>
(5-5 &bull; 3-4 SEC/3<sup>rd</sup> East)<br><br>
Last &mdash; L (17-41) vs. <sub>1</sub> Georgia<br>
Next &mdash; 11/20 vs. South Alabama
</small>
</td>
</tr></tbody></table>
</div>
</div>
<div class="item">
<h4 class="item-heading">Colorado State Football</h4>
<div>
<table style="width:100%;"><tbody><tr>
<td style="width:75px;">
<a href="https://csurams.com" style="background:none;padding:0;" target="_blank" rel="noopener">
<img src="/themes/{{ web_log.theme_path }}/img/csurams.png" alt="CSU Rams Logo"
title="Colorado State Sports" style="border:0;" height="75px" width="75px">
</a>
</td>
<td class="text-center" style="line-height:1.3em;">
2021 Season &mdash; <strong>NR</strong><br>
<small>
(3-6 &bull; 2-3 MWC/4<sup>th</sup> Mountain)<br><br>
Last &mdash; L (17-31) at Wyoming<br>
Next &mdash; 11/13 vs. Air Force
</small>
</td>
</tr></tbody></table>
</div>
</div>
</div>
<div>
<div class="item">
<h4 class="item-heading">Some Other Places to Find Me</h4>
<div class="text-center">
<a class="twitter-timeline" href="https://twitter.com/DanJSum" data-height="300">Tweets by DanJSum</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<br><br>
<a href="https://www.facebook.com/daniel.j.summers" title="Daniel J. Summers&rsquo;s Facebook profile">
<img src="https://badge.facebook.com/badge/1270539383.37.619606444.png" style="border:0;"
alt="Daniel J. Summers&rsquo;s Facebook profile">
</a>
</div>
</div>
</div>
</footer>
<footer class="part-3">
<div class="pull-left">
<a rel="license noopener" href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank">
<img src="https://licensebuttons.net/l/by-nc/4.0/88x31.png" alt="Creative Commons License"
style="border-width:0;">
</a>
</div>
<div class="copy">
&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
</a><br>
&nbsp; Designed by
<a href="https://bitbadger.solutions" title="Building the site you need to ensure your success!">
Bit Badger Solutions
</a>
&bull; Powered by <a href="https://github.com/bit-badger/myWebLog/tree/v2">myWebLog</a>
</div>
</footer>
</body>
</html>

18
src/MyWebLog/wwwroot/themes/daniel-j-summers/djs.js Normal file
View File

@ -0,0 +1,18 @@
djs = {
displayVotd: res => {
const votd = res.votd
const votdItem = document.querySelector('.votd-item')
votdItem.querySelector('.verse').innerHTML = votd.text
const reference = votdItem.querySelector('.votd-reference')
reference.href = votd.permalink.replace('&amp;', '&')
const ref = votd.display_ref
const isPassage = ref.indexOf(',') >= 0 || ref.indexOf('-') >= 0 || ref.indexOf(';') >= 0
if (isPassage) {
document.querySelector('.votd-heading').innerText = 'Passage of the Day'
}
reference.innerHTML = ref
votdItem.querySelector('.version-link').href = votd.copyrightlink.replace('&amp;', '&').replace('&amp;', '&')
votdItem.style.display = 'block'
}
}

256
src/MyWebLog/wwwroot/themes/daniel-j-summers/style.css Normal file
View File

@ -0,0 +1,256 @@
@import "https://fonts.googleapis.com/css?family=Quicksand|Oswald";
:root {
--text-color: rgb(0, 0, 0);
--accent-color: rgb(21, 140, 186);
--bkg-color: rgb(68, 68, 68);
--hdr-text-color: hsl(0, 0%, 100%);
--hdr-bkg-color: hsl(0, 0%, 95%);
--item-bkg-color: hsl(0, 0%, 100%);
}
@media ( prefers-color-scheme: dark ) {
:root {
--text-color: rgb(210, 210, 210);
--hdr-bkg-color: hsl(0, 0%, 7%);
--item-bkg-color: hsl(0, 0%, 12%);
}
}
html {
background-color: var(--bkg-color);
}
body {
font-family: Quicksand, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 1.2rem;
background-color: var(--bkg-color);
margin: 0;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto;
color: var(--text-color);
}
a :link, a:visited {
color: var(--accent-color);
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
h1, h2, h3, h4, p {
margin-top: 0;
margin-bottom: 1rem;
}
h1, h2, h3, h4 {
font-family: Oswald, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}
h1 {
font-size: 2rem;
}
h1 a:link, h1 a:visited {
color: var(--accent-color);
}
blockquote {
margin: 1rem 2rem 1rem 1rem;
border-left: solid 3px var(--accent-color);
padding-left: 1rem;
}
sup, sub {
font-size: .85rem;
}
sup {
vertical-align: text-top;
}
sub {
vertical-align: baseline;
}
img {
max-width: 100%;
}
/* ----- SITE HEADER ----- */
.site-header p, footer.part-1 p {
margin-top: .8rem;
margin-right: 1.2rem;
color: var(--hdr-text-color);
}
.site-header p a:link, .site-header p a:visited {
font-size: 1rem;
color: var(--hdr-text-color);
}
.site-header {
min-height: 4rem;
padding: 0 .4rem;
margin-bottom: 1rem;
display: flex;
flex-flow: row wrap;
align-items: flex-end;
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 p a.nav-home {
font-family: Oswald, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-weight: bold;
margin-left: .2rem;
color: var(--hdr-text-color);
font-size: 1.5rem;
}
.nav-spacer {
flex-grow: 1;
}
/* ----- CONTENT STYLES ----- */
.index-title {
color: var(--hdr-text-color);
border-bottom: solid 2px var(--accent-color);
}
.content {
max-width: 60rem;
margin: 0 auto auto;
padding: 0 .4rem;
}
.item {
border: solid 1px black;
border-radius: .5rem;
background-color: var(--item-bkg-color);
padding: .4rem;
margin-bottom: 1.2rem;
}
.item-heading {
margin: -.4rem -.4rem .4rem;
border-top-left-radius: .5rem;
border-top-right-radius: .5rem;
border-bottom: solid 1px darkgray;
padding-bottom: .2rem;
text-align: center;
color: var(--accent-color);
background-color: var(--hdr-bkg-color);
}
.pager {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
padding: 0;
}
.pager li {
list-style-type: none;
display: inline-block;
}
/* ----- SIDEBAR STYLES ----- */
.sidebar {
font-size: 1rem;
}
.votd-item {
display: none;
}
.votd-credits {
margin-top: 1rem;
text-align: right;
}
.cat-list {
padding-left: 0
}
.cat-list ul {
padding-left: 1rem;
}
.cat-list ul li {
list-style-type: none;
padding-bottom: .2rem;
}
.cat-list ul li ul > li {
padding-top: .2rem;
}
.cat-list-count {
font-size: .8rem;
padding-left: .4rem;
}
.cat-list-count:before {
content: '(';
}
.cat-list-count:after {
content: ')';
}
/* ----- FOOTER STYLES ----- */
footer.part-1 {
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));
min-height: 2rem;
display: flex;
flex-flow: row wrap;
justify-content: space-around;
align-items: center;
padding-bottom: 1rem;
}
footer.part-2 {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
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));
padding-bottom: .4rem;
}
footer.part-2 > div {
flex-basis: 30%;
min-width: 400px;
}
footer.part-2 sup {
line-height: 1;
}
footer.part-3 {
padding: 0 .4rem 1rem .4rem;
background-color: var(--bkg-color);
}
.copy, .copy a:link, .copy a:visited {
font-size: 1rem;
color: #dddddd;
text-decoration: none;
}
.copy a:hover {
text-decoration: underline;
}
/* ----- UTILITY CLASSES ----- */
.desktop {
display: none;
}
.float-left {
float: left;
}
.float-right {
float: right;
}
.small-caps {
font-variant: small-caps;
}
.text-center {
text-align: center;
}
/* ----- SCALE UP STYLES ----- */
@media screen and ( min-width: 50rem ) {
body {
grid-template-columns: 1fr 16rem;
}
.desktop {
display: unset;
}
.mobile {
display: none;
}
.site-header, .single, footer {
grid-column: 1 / -1;
}
.sidebar {
max-width: 15rem;
}
footer.part-2 {
grid-gap: 0;
}
}