130 lines
5.2 KiB
HTML
130 lines
5.2 KiB
HTML
{% include head.html %}
|
|
|
|
|
|
<body>
|
|
|
|
<div class="site-ctr">
|
|
<!-- Navbar -->
|
|
{% include nav.html %}
|
|
|
|
<div class="reactive-bg">
|
|
|
|
<div class="color-space" id="color-space">
|
|
<div class="container" style="height:100%; text-align:right">
|
|
{% if page.backing_img %}
|
|
<img src="{{page.backing_img}}" style="{{page.backing_scalar}};padding-right:5%"></img>
|
|
{% else %}
|
|
<img src="/assets/images/innovation__monochromatic.svg" style="height:90%;padding-right:5%"></img>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="content-container">
|
|
|
|
|
|
|
|
<div class="title-container container">
|
|
<h1 id="page-title">{{page.title}}</h1>
|
|
<h4 id="page-subtitle">{{page.description}}</h4>
|
|
|
|
{% assign page_date = page.date | split: " " %}
|
|
<h6>
|
|
<small class="text-muted" {% if page.written %} data-toggle="tooltip" data-placement="top"
|
|
title="Written {{page.written}}" {% endif %} style="color:gray;">{{page_date.first}}</small>
|
|
{% for category in page.categories %}
|
|
<a href="/categories?c={{category}}"><span class="badge"
|
|
style="background-color: var(--light-gray);color:#333;">{{category}}</span></a>
|
|
{% endfor %}
|
|
</h6>
|
|
|
|
|
|
</div><br>
|
|
|
|
<div class="inner-content-container container">
|
|
<!-- Main content -->
|
|
{{content}}
|
|
|
|
{% if page.categories %}
|
|
<br>
|
|
<hr>
|
|
<div class="retention">
|
|
|
|
<!-- Thank you text -->
|
|
<h6>Thank you for reading this post. If you enjoyed the content, and want to let me know, or
|
|
want
|
|
to
|
|
ask any questions, please contact me via one of the methods <a href="/about">listed
|
|
here</a>. If
|
|
you would like to be notified about future posts, feel free to load <a href="/feed.xml">my
|
|
rss
|
|
feed</a> into your favorite feed reader, or <a
|
|
href="https://twitter.com/ewpratten">follow
|
|
me on Twitter</a> for notifications about my work and future posts.</h6>
|
|
|
|
<!-- Other posts to check out -->
|
|
<h6>If you have the time to read some more, I recommend checking out one of the following posts:
|
|
</h6>
|
|
<div class="card-group">
|
|
{% assign i = 0 %}
|
|
{% for post in site.posts %}
|
|
{% if i < 3 and post.title != page.title %}
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<h5 class="card-title">{{post.title}}</h5>
|
|
<h6 class="card-text">{{post.excerpt}}</h6>
|
|
</div>
|
|
<div class="card-footer">
|
|
{% assign post_date = post.date | split: " " %}
|
|
<small class="text-muted">Published: {{post_date.first}}</small>
|
|
<a href="{{post.url}}"><button class="btn btn-outline-primary btn-sm"
|
|
style="float:right;">Read Post</button></a>
|
|
</div>
|
|
</div>
|
|
{% assign i = i | plus:1 %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
</div>
|
|
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
{% include footer.html %}
|
|
|
|
|
|
<!-- A little script to set the header and nav color based on page type -->
|
|
<!-- <script>
|
|
|
|
// Read from liquid
|
|
var page_type = "{{page.type}}";
|
|
|
|
// Selectors
|
|
var color_space = document.getElementById("color-space");
|
|
var navbar = document.getElementById("navbar");
|
|
|
|
// Colors
|
|
var red = getComputedStyle(document.documentElement)
|
|
.getPropertyValue('--color-red');
|
|
var purple = getComputedStyle(document.documentElement)
|
|
.getPropertyValue('--color-purple');
|
|
|
|
// DEBUG
|
|
console.log(red);
|
|
console.log(purple);
|
|
|
|
// Set color
|
|
if (page_type == "post") {
|
|
color_space.setAttribute("background-color", red, "!important");
|
|
navbar.setAttribute("background-color", red, "!important");
|
|
} else {
|
|
color_space.setAttribute("background-color", purple, "!important");
|
|
navbar.setAttribute("background-color", purple, "!important");
|
|
}
|
|
|
|
</script> -->
|
|
|
|
</body> |