fixing avatar reactivity
This commit is contained in:
parent
cf8d28d1c1
commit
fc4c052c83
|
@ -1,14 +1,5 @@
|
||||||
<section>
|
<section>
|
||||||
{{ range first 1 (where .Site.RegularPages.ByDate.Reverse "Section" "blog") }}
|
|
||||||
{{ $d1 := time.ParseDuration "-168h" }}
|
|
||||||
{{ $t1 := time.Now.Add $d1 }}
|
|
||||||
{{ $t2 := time.AsTime .PublishDate }}
|
|
||||||
{{ if $t2.After $t1 }}
|
|
||||||
<div id="avatar-frame" class="online">
|
<div id="avatar-frame" class="online">
|
||||||
{{ else }}
|
|
||||||
<div id="avatar-frame" class="busy">
|
|
||||||
{{ end }}
|
|
||||||
{{ end }}
|
|
||||||
<span class="gloss"></span>
|
<span class="gloss"></span>
|
||||||
<img class="u-photo" width="100px" src="/images/avatar.jpg">
|
<img class="u-photo" width="100px" src="/images/avatar.jpg">
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
<p>
|
<p>
|
||||||
peanut butter in the internet vent.
|
{{ range first 1 (where .Site.RegularPages.ByDate.Reverse "Section" "blog") }}
|
||||||
|
Last updated <time id="last-update" datetime="{{ .PublishDate }}">{{ .PublishDate.Format "January 2, 2006" }}</time>.
|
||||||
|
{{ end }}
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -7,6 +7,7 @@
|
||||||
<title>{{ .Page.Title }}</title>
|
<title>{{ .Page.Title }}</title>
|
||||||
<link rel="stylesheet" href="/css/main.css">
|
<link rel="stylesheet" href="/css/main.css">
|
||||||
<link rel="icon" type="image/png" href="/favicon.png">
|
<link rel="icon" type="image/png" href="/favicon.png">
|
||||||
|
<script src="/js/avatar.js" defer></script>
|
||||||
<script src="/js/quotes.js" defer></script>
|
<script src="/js/quotes.js" defer></script>
|
||||||
<link rel="webmention" href="https://webmention.io/yequari.com/webmention" />
|
<link rel="webmention" href="https://webmention.io/yequari.com/webmention" />
|
||||||
<link rel="pingback" href="https://webmention.io/yequari.com/xmlrpc" />
|
<link rel="pingback" href="https://webmention.io/yequari.com/xmlrpc" />
|
||||||
|
|
|
@ -262,7 +262,7 @@ nav li a:hover, nav li a:active {
|
||||||
.sidebar {
|
.sidebar {
|
||||||
flex: 0 1 20%;
|
flex: 0 1 20%;
|
||||||
border-right: 1px solid;
|
border-right: 1px solid;
|
||||||
border-image: linear-gradient(transparent 5vh, grey 5.1vh, grey 94%, transparent 95%) 1;
|
border-image: linear-gradient(transparent 30px, grey 31px, grey 97%, transparent 98%) 1;
|
||||||
padding: 30px 15px;
|
padding: 30px 15px;
|
||||||
/* background: linear-gradient(aqua 0%, transparent 15%); */
|
/* background: linear-gradient(aqua 0%, transparent 15%); */
|
||||||
/* border-radius: 15px 0 0 0; */
|
/* border-radius: 15px 0 0 0; */
|
||||||
|
@ -371,6 +371,7 @@ code {
|
||||||
pre code{
|
pre code{
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
display: block;
|
display: block;
|
||||||
|
max-width: 640px;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul.pagination {
|
ul.pagination {
|
||||||
|
|
|
@ -0,0 +1,14 @@
|
||||||
|
let latest = document.querySelector('#last-update');
|
||||||
|
let avatar = document.querySelector('#avatar-frame');
|
||||||
|
|
||||||
|
let latestDate = Date.parse(latest.attributes.getNamedItem('datetime').value);
|
||||||
|
let threshold = new Date();
|
||||||
|
threshold.setDate(threshold.getDate() - 7);
|
||||||
|
|
||||||
|
console.log(latestDate)
|
||||||
|
|
||||||
|
if (latestDate < threshold) {
|
||||||
|
avatar.className = 'busy';
|
||||||
|
} else {
|
||||||
|
avatar.className = 'online';
|
||||||
|
}
|
Loading…
Reference in New Issue