mirror of
https://github.com/Brandon-Rozek/website-theme.git
synced 2024-09-18 14:15:11 -04:00
Created new toots layout
This commit is contained in:
parent
440c6a7db4
commit
adf2a4c4d2
5 changed files with 105 additions and 28 deletions
|
|
@ -315,6 +315,38 @@ footer {
|
|||
|
||||
/* END FOOTER */
|
||||
|
||||
/*
|
||||
** MASTODON TOOTS
|
||||
*/
|
||||
.toot {
|
||||
margin-bottom: 2rem;
|
||||
padding: 15px;
|
||||
border: 1px solid #656565;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.toot .date {
|
||||
vertical-align: top;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.toot-avatar { display: inline-block; }
|
||||
.toot .e-content img { border: 2px solid black; }
|
||||
|
||||
.toot .e-content p:first-of-type {
|
||||
display: inline-block;
|
||||
}
|
||||
.toot-photos {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
main .e-content .toot-photos img {
|
||||
width: 100%;
|
||||
max-width: 300px;
|
||||
}
|
||||
.toot-social { margin-top: 1rem; }
|
||||
|
||||
/* END TOOTS */
|
||||
|
||||
/*
|
||||
** EXTRA
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -1,34 +1,6 @@
|
|||
{{ $url := .Get 0 }}
|
||||
{{ $dataJ := getJSON $url }}
|
||||
|
||||
<style>
|
||||
.toot {
|
||||
margin-bottom: 2rem;
|
||||
padding: 15px;
|
||||
border: 1px solid #656565;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.toot .date {
|
||||
vertical-align: top;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.toot-avatar { display: inline-block; }
|
||||
.toot .e-content img { border: 2px solid black; }
|
||||
|
||||
.toot .e-content p:first-of-type {
|
||||
display: inline-block;
|
||||
}
|
||||
.toot-photos {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
main .e-content .toot-photos img {
|
||||
width: 100%;
|
||||
max-width: 300px;
|
||||
}
|
||||
.toot-social { margin-top: 1rem; }
|
||||
</style>
|
||||
|
||||
{{ range sort $dataJ "created_at" "desc" }}
|
||||
{{ if ne .content "" }}
|
||||
|
|
|
|||
1
layouts/shortcodes/unsafe.html
Normal file
1
layouts/shortcodes/unsafe.html
Normal file
|
|
@ -0,0 +1 @@
|
|||
{{ .Inner }}
|
||||
41
layouts/toots/list.html
Normal file
41
layouts/toots/list.html
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
{{ define "main"}}
|
||||
{{ partial "header.html" . }}
|
||||
<main>
|
||||
<style>main { text-align: left; }</style>
|
||||
{{ partial "search.html" . }}
|
||||
<p>
|
||||
This is an experimental page showing my toots from Mastodon.
|
||||
Currently, this does not support boosts and it does not automatically refresh.
|
||||
Feel free to check out
|
||||
<a href="https://fosstodon.org/@brozek">my profile at Fosstodon</a>
|
||||
</p>
|
||||
{{ $listPageDateFormat := .Site.Params.listPageDateFormat | default "January, 2006"}}
|
||||
{{ range $index, $value := .Pages.GroupByDate $listPageDateFormat }}
|
||||
{{ range .Pages }}
|
||||
<article class="toot h-entry">
|
||||
<div class="e-content">
|
||||
<img class="toot-avatar" width=50 src="{{ .Params.account.avatar }}"/>
|
||||
<p class="date">Tooted on <time class="dt-published" datetime='{{ .Date }}'>{{ dateFormat "January 2, 2006 15:04" (time .Date) }}</time></p>
|
||||
{{ .Content | safeHTML }}
|
||||
{{ if gt (len .Params.media_attachments) 0 }}
|
||||
<div class="toot-photos">
|
||||
{{ range .Params.media_attachments}}
|
||||
{{ if eq .type "image" }}
|
||||
<img src="{{ .preview_url }}" alt="{{ .description }}"/>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="toot-social">
|
||||
<span><i class='fas fa-share'></i> {{ .Params.replies_count }} </span>
|
||||
<span><i class='fas fa-retweet'></i> {{ .Params.reblogs_count }} </span>
|
||||
<span><i class='fas fa-star'></i> {{ .Params.favourites_count }} </span>
|
||||
<span>| Source: <a href="{{ .Params.syndication }}">{{ .Params.syndication }}</a></span>
|
||||
</div>
|
||||
</article>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</main>
|
||||
{{ partial "footer.html" . }}
|
||||
{{ end }}
|
||||
31
layouts/toots/single.html
Normal file
31
layouts/toots/single.html
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
{{ define "main"}}
|
||||
{{ .Scratch.Set "customTitleHeaderSet" true }}
|
||||
{{ .Scratch.Set "customTitleHeader" "Toots" }}
|
||||
{{ .Scratch.Set "customTitleHeaderLink" "/toots" }}
|
||||
{{ partial "header.html" . }}
|
||||
<main>
|
||||
<article class="toot h-entry">
|
||||
<div class="e-content">
|
||||
<img class="toot-avatar" width=50 src="{{ .Params.account.avatar }}"/>
|
||||
<p class="date">Tooted on <time class="dt-published" datetime='{{ .Date }}'>{{ dateFormat "January 2, 2006 15:04" (time .Date) }}</time></p>
|
||||
{{ .Content | safeHTML }}
|
||||
{{ if gt (len .Params.media_attachments) 0 }}
|
||||
<div class="toot-photos">
|
||||
{{ range .Params.media_attachments}}
|
||||
{{ if eq .type "image" }}
|
||||
<img src="{{ .preview_url }}" alt="{{ .description }}"/>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="toot-social">
|
||||
<span><i class='fas fa-share'></i> {{ .Params.replies_count }} </span>
|
||||
<span><i class='fas fa-retweet'></i> {{ .Params.reblogs_count }} </span>
|
||||
<span><i class='fas fa-star'></i> {{ .Params.favourites_count }} </span>
|
||||
<span>| Source: <a href="{{ .Params.syndication }}">{{ .Params.syndication }}</a></span>
|
||||
</div>
|
||||
</article>
|
||||
</main>
|
||||
{{ partial "footer.html" . }}
|
||||
{{ end }}
|
||||
Loading…
Reference in a new issue