Browse Source

trying to get photo feed working again

master
jk 5 years ago
parent
commit
54e911804a
  1. 812
      content/css/style.css
  2. 12
      content/photo/5eb1ea18/index.md
  3. 11
      content/photo/5eb1eb7a/index.md
  4. 11
      content/photo/5eb1ec65/index.md
  5. 11
      content/photo/5eb273c6/index.md
  6. 12
      content/photo/help/index.md
  7. 14
      layouts/_default/section.html
  8. 17
      themes/anatole/layouts/_default/single.html
  9. 28
      themes/anatole/layouts/index.html
  10. 2
      themes/anatole/layouts/partials/taxonomy/photo.html
  11. 35
      themes/anatole/static/css/style.css

812
content/css/style.css

@ -1,812 +0,0 @@
@charset "UTF-8";
@import url('https://rsms.me/inter/inter.css');
html { font-family: 'Inter', sans-serif; height:100%;}
@supports (font-variation-settings: normal) {
html { font-family: 'Inter var', sans-serif; }
}
:root {
--dark-link:#59ABE3;
--dark-text:#f8f8f8;
--dark-bg:#2b2b2b;
--dark-opacity: 0.75;
--light-text:#2b2b2b;
--light-bg:#f8f8f8;
--light-link:#0065BF;
--light-opacity:1;
--text-colour: var(--dark-text);
--bg-colour: var(--dark-bg);
--link-colour: var(--dark-link);
--opacity-img: var(--dark-opacity);
}
@media (prefers-color-scheme: light) {
--text-colour: var(--light-text);
--bg-colour: var(--light-bg);
--link-colour: var(--light-link);
--opacity-img: var(--light-opacity);
}
[data-theme="light"]{
--text-colour: var(--light-text);
--bg-colour: var(--light-bg);
--link-colour: var(--light-link);
--opacity-img: var(--light-opacity);
}
/* Switched mode */
.theme-switch:checked ~ *,
.theme-switch:checked + *,
.theme-switch:checked + * + *{
--text-colour:var(--light-text);
--bg-colour:var(--light-bg);
--link-colour:var(--light-link);
--opacity-img: var(--light-opacity);
}
.theme-switch{
display:none;
}
.light{
display:inline;
float:right;
color:var(--text-colour);
}
html {
-webkit-animation-fill-mode: forwards;
}
body {
color: var(--text-colour);
font-size: 15px;
width: 100%;
margin: 0 auto 30px auto;
background: var(--bg-colour);
}
#page{
display:block;
height:100%;
color: var(--text-colour);
background: var(--bg-colour);
}
.main, .content {
background: var(--bg-colour);
color: var(--text-colour);
height:95%;
display:block;
}
p {
line-height: 1.9em;
font-weight: 400;
font-size: 14px;
}
a {
text-decoration: none;
}
img {
opacity: var(--opacity-img);
transition: opacity .5s ease-in-out;
}
img:hover {
opacity: 1
}
.category {
padding: 4px 6px;
border-radius: 3px;
border: 1px solid var(--text-colour);
}
.blog {
padding: 4px 6px;
border-radius: 3px;
background: var(--link-colour);
border: 1px solid var(--text-colour);
}
.tag::before {
content: "#";
opacity: .75;
}
.tag, .category {
display: inline-block;
font-size: 15px;
line-height: 1;
margin: 5px 8px 5px 0;
}
pre {
background: var(--bg-colour);
padding: 5px;
}
.info i{
opacity: 0.5;
margin-right: 5px;
}
a:link, a:visited {
opacity: 1;
-webkit-transition: all .15s linear;
-moz-transition: all .15s linear;
-o-transition: all .15s linear;
-ms-transition: all .15s linear;
transition: all .15s linear;
color: var(--text-colour);
}
a:hover, a:active {
color: var(--link-colour);
}
.content {
background: var(--bg-colour);
position:fixed;
left:30%;
height: 100%;
float: right;
width: 80%;
margin-top: 60px;
overflow:auto;
-ms-overflow-style:none;
}
.content::-webkit-scrollbar{
display:none;
}
.page-top {
width: 70%;
position: fixed;
right: 0;
z-index: 3;
height: 60px;
border-bottom: 1px solid var(--text-colour);
background: var(--bg-colour);
}
.page-top .nav {
width:95%;
list-style: none;
padding: 18px 30px;
float: left;
font-size: 14px;
display:inline-block;
}
.page-top .nav li{
position: relative;
display: initial;
padding-right: 20px;
}
.page-top .nav a {
color: var(--text-colour);
}
.page-top .nav a:hover {
color: var(--link-colour);
}
.page-top .language-selector {
position:relative;
display:inline;
float:right;
vertical-align:top;
}
.page-top .language-selector ul{
list-style:none;
padding:0;
margin:0;
display:inline;
}
.page-top .language-selector li{
vertical-align:top;
margin:0;
padding:0;
padding-bottom:22px;
}
.page-top .language-selector i{
vertical-align:top;
display:inline;
padding:0px 10px;
}
.page-top .language-selector label{
margin:0px;
padding:0px;
display:inline;
}
.sidebar {
width: 30%;
background: var(--bg-colour);
-webkit-background-size: cover;
background-size: cover;
height: 100%;
top: 0;
left: 0;
position: fixed;
z-index: 4;
border-right: 1px solid var(--text-colour);
}
.sidebar #logo{
max-width: 300px;
width: 80%;
margin: 0 auto;
display:block;
padding: 10px;
}
.sidebar img.u-photo{
width:150px;
border-radius: 50%;
}
.sidebar .logo-title {
text-align: center;
padding-top: 240px;
}
.sidebar .logo-title .description {
font-size: 14px;
width: 60%;
margin: 0 auto;
color: var(--text-colour);
padding-bottom:10px;
}
.sidebar .logo-title .logo {
margin: 0 auto;
}
.sidebar .logo-title .title h3 {
text-transform: uppercase;
font-size: 2rem;
font-weight: bold;
letter-spacing: 2px;
line-height: 1;
margin: 1em;
}
.sidebar .logo-title .title a {
text-decoration: none;
color: var(--text-colour);
font-size: 2rem;
font-weight: bold;
}
.sidebar .social-links {
list-style: none;
padding: 0;
font-size: 14px;
text-align: center;
}
.sidebar .social-links i {
margin-right: 3px;
}
.sidebar .social-links li {
display: inline;
padding: 0 4px;
line-height: 0;
}
.sidebar .social-links a {
color: var(--text-colour);
}
.sidebar .social-links a:hover {
color: var(--link-colour);
}
.post, .h-entry {
background: var(--bg-colour);
margin: 30px;
width:80%;
padding-left:20px;
}
.post .banner{
width:100%;
max-height: 300px;
object-fit:scale-down;
object-position:top;
}
.post .post-title h1 {
text-transform: uppercase;
font-size: 30px;
letter-spacing: 5px;
line-height: 1;
}
.post .post-title h2 {
text-transform: uppercase;
letter-spacing: 1px;
font-size: 28px;
line-height: 1;
font-weight: 600;
color: var(--text-colour);
}
.post .post-title h3 {
text-transform: uppercase;
letter-spacing: 1px;
line-height: 1;
font-weight: 600;
color: var(--text-colour);
font-size: 22px;
margin: 0;
}
.post .post-title a, .h-entry .post-title a {
text-decoration: none;
letter-spacing: 1px;
color: var(--text-colour);
}
.post .post-title a:hover, .h-entry .post-title a:hover {
text-decoration: underline;
}
.post .post-content a, .h-entry p a {
text-decoration: none;
color: var(--link-colour);
}
.post .post-content table, .h-entry table {
border-collapse:collapse;
}
.post .post-content table,.post .post-content table td, .post .post-content table th,
.h-entry table,.h-entry table td, .h-entry table th{
border: 1px dashed var(--text-colour);
}
.post .post-content table td, .post .post-content table th,.h-entry table td, .h-entry table th{
padding: 15px
}
.post .post-content a:hover, .h-entry a:hover {
color: var(--link-colour);
}
.post .post-content h3,section aside h3 {
color: var(--text-colour);
font-size: 22px;
font-weight: 600;
}
.post .post-content h4 {
color: var(--text-colour);
font-size: 16px;
}
.post .post-content img, .h-entry img {
max-width: 60%;
text-align: center;
margin: 0 auto;
display:block;
padding:10px;
}
.post .post-footer {
padding: 0 0 30px 0;
border-bottom: 1px solid var(--text-colour);
}
.post .post-footer .meta {
max-width: 100%;
height: 25px;
color: var(--text-colour);
}
.post .post-footer .meta .info {
float: left;
font-size: 12px;
margin-bottom: 1em;
}
.post .post-footer .info .separator a {
margin-right: 0.2em;
}
.post .post-footer .meta .info .date {
margin-right: 10px;
}
.info {
margin: 1em;
}
.post .post-footer .meta a {
text-decoration: none;
color: var(--text-colour);
padding-right: 10px;
}
.post .post-footer .meta a:hover {
color: var(--link-colour);
}
.post .post-footer .blog{
color: var(--text-colour);
}
.post .post-footer .blog:hover{
color: var(--text-colour);
}
.post .post-footer .meta i {
margin-right: 6px;
}
.post .post-footer .tags {
padding-bottom: 15px;
font-size: 13px;
}
.post .post-footer .tags ul {
list-style-type: none;
display: inline;
margin: 0;
padding: 0;
}
.post .post-footer .tags ul li {
list-style-type: none;
margin: 0;
padding-right: 5px;
display: inline;
}
.post .post-footer .tags a {
text-decoration: none;
color: var(--text-colour);
font-weight: 400;
}
.post .post-footer .tags a:hover {
text-decoration: none;
}
.like-reblog-buttons {
float: right;
}
.like-button {
float: right;
padding: 0 0 0 10px;
}
.reblog-button {
float: right;
padding: 0;
}
#install-btn {
position: fixed;
bottom: 0px;
right: 6px;
}
.footer {
clear: both;
text-align: center;
font-size: 14px;
margin: 0 auto;
bottom: 0;
position: absolute;
width: 100%;
padding-bottom: 20px;
background: var(--bg-colour);
}
.footer a {
color: var(--text-colour);
}
.footer a:hover {
color: var(--link-colour);
}
/*for archive*/
.archive {
width: 80%;
}
.description {
color: var(--text-colour);
}
.list-title{
margin:30px;
font-size:30px;
font-weight:bold;
color: var(--text-colour);
}
.list-title i{
font-size:22px;
vertical-align:middle;
color: var(--text-colour);
}
.list-with-title {
font-size: 14px;
margin: 30px;
padding: 0;
}
.list-with-title li {
list-style-type: none;
padding: 0;
}
.list-with-title .listing-title {
font-size: 24px;
color: var(--text-colour);
font-weight: 600;
line-height: 2.2em;
}
.list-with-title .listing {
padding: 0;
}
.list-with-title .listing .listing-post {
padding-bottom: 5px;
}
.list-with-title .listing .listing-post .post-time {
float: right;
color: var(--text-colour);
}
.list-with-title .listing .listing-post a {
color: var(--text-colour);
}
.list-with-title .listing .listing-post a:hover {
color: var(--link-colour);
}
/* share */
.share {
margin: 0px 30px;
display: inline-flex;
}
/* about */
.about {
margin: 30px;
width:80%;
}
.about h3 {
font-size: 22px;
}
/* links*/
.links {
margin: 30px;
}
.links h3 {
font-size: 22px;
}
.links a {
cursor: pointer;
}
/* Comments */
.comment-count {
color: #666;
}
.tab-community {
color: #666;
}
.readmore {
font-size: 14px;
text-align:left;
padding:0;
text-decoration:underline;
}
.back-button {
padding-top: 30px;
max-width: 100px;
padding-left: 40px;
float: left;
}
/* Buttons */
a.btn {
color: #868686;
font-weight: 400;
}
.btn {
display: inline-block;
position: relative;
outline: 0;
color: rgba(0, 0, 0, 0.44);
background: transparent;
font-size: 14px;
text-align: center;
text-decoration: none;
cursor: pointer;
border: 1px solid rgba(0, 0, 0, 0.15);
white-space: nowrap;
font-weight: 400;
font-style: normal;
border-radius: 999em;
}
.btn:hover {
display: inline-block;
position: relative;
outline: 0px;
color: #464545;
background: transparent;
font-size: 14px;
text-align: center;
text-decoration: none;
cursor: pointer;
border: 1px solid #464545;
white-space: nowrap;
font-weight: 400;
font-style: normal;
border-radius: 999em;
}
[role="back"] {
padding: 0.5em 1.25em;
line-height: 1.666em;
}
[role="home"] {
padding: 0.5em 1.25em;
line-height: 1.666em;
}
[role="navigation"] {
padding: 0.5em 1.25em;
line-height: 1.666em;
}
[role="tags"] {
padding: 6px 12px;
}
/* Menu */
.menu {
float: right;
padding-top: 30px;
}
.menu .btn-down {
margin: 0px;
}
.menu .btn-down li {
list-style: none;
width: 100px;
}
.menu .btn-down li a {
display: inline-block;
position: relative;
padding: 0.5em 1.25em;
outline: 0;
color: rgba(0, 0, 0, 0.44);
background: transparent;
font-size: 14px;
text-align: center;
text-decoration: none;
cursor: pointer;
border: 1px solid rgba(0, 0, 0, 0.15);
white-space: nowrap;
font-weight: 400;
font-style: normal;
border-radius: 999em;
margin-top: 5px;
}
.menu .btn-down li a:hover {
position: relative;
padding: 0.5em 1.25em;
outline: 0;
color: #fff;
background: #3CBD10;
font-size: 14px;
text-align: center;
text-decoration: none;
cursor: pointer;
border: 1px solid rgba(0, 0, 0, 0.15);
white-space: nowrap;
font-weight: 400;
font-style: normal;
border-radius: 999em;
margin-top: 5px;
}
.menu .btn-down div {
position: absolute;
visibility: hidden;
width: 100px;
float: right;
}
.page_404 {
text-align: center;
padding-top: 50px;
}
.pixelfed_embed {
margin:0 auto;
display:block;
}
.contents hr {
color: var(--text-colour);
}
.contents .note, .contents .article {
background-color: var(--bg-colour);
border-radius:10px;
padding:10px;
width: 80%;
margin: 10px;
display:block;
}
.contents .note .author, .contents .article .author{
width: 60px;
display:block;
float:left;
height:100%;
margin:0px;
padding:0px;
}
.contents .note .author img, .contents .article .author img{
max-width:50px;
vertical-align: top;
margin:0px;
padding:0px;
}
.contents aside {
width:95%;
display:inline-block;
vertical-align:top;
margin:0px;
padding:0px;
}
.contents aside time{
font-size:12px;
}
.pagination {
list-style:none;
margin: 0 auto;
border:0px;
padding-top:20px;
display:block;
max-width: 1000px;
width:100%;
}
.pagination li{
display:inline-block;
padding:10px 80px;
height: 80px;
}
.page-top .nav #Likes, .page-top .nav #Replies, .page-top .nav #Re-posts{
display:none;
}
@media screen and (max-width: 960px) {
.sidebar {
width: 100%;
position: absolute;
border-right: none;
z-index: 1;
}
.sidebar .logo-title {
padding-top: 100px;
}
.sidebar .logo-title .title img {
width: 70px;
}
.sidebar .logo-title .title h3 {
font-size: 20px;
}
.sidebar #logo{
padding-top:80px;
}
.page-top {
width: 100%;
}
.page-top .nav{
width: 90%;
}
.page-top .nav #Likes, .page-top .nav #Replies, .page-top .nav #Re-posts{
display:none;
}
.page-top .language-selector i{
padding:0 5px;
}
.post-title h3, section aside h3 {
line-height: 1.6;
}
.content {
margin-top: 680px;
width: 100%;
z-index: 2;
position: absolute;
left:0;
height:100%;
border-top: 1px solid var(--text-colour);
}
.about, .post, .archive, .contents{
width:95%;
margin-left:15px;
}
.footer {
display: none;
}
.share {
display: grid;
}
.pagination li{
display:inline-block;
padding:0px 30px;
height: 30px;
}
}

12
content/photo/5eb1ea18/index.md

@ -1,12 +0,0 @@
---
date: '2020-05-05 23:35:04'
draft: false
photo:
- '/images/2020/05/1588718102480-796978-800.jpeg'
posttype: photo
slug: 5eb1ea18
name: '5eb1ea18'
thumbnail:
- '/images/2020/05/1588718102480-796978-200.jpeg'
---
Grains

11
content/photo/5eb1eb7a/index.md

@ -1,11 +0,0 @@
---
date: '2020-05-05 23:40:58'
draft: false
photo:
- 'https://jk.nipponalba.scot/images/2020/05/1588718457168-519857-800.jpeg'
posttype: photo
slug: 5eb1eb7a
thumbnail:
- 'https://jk.nipponalba.scot/images/2020/05/1588718457168-519857-200.jpeg'
---
One more time

11
content/photo/5eb1ec65/index.md

@ -1,11 +0,0 @@
---
date: '2020-05-05 23:44:53'
draft: false
photo:
- '/images/2020/05/1588718692455-561741-800.jpeg'
posttype: photo
slug: 5eb1ec65
thumbnail:
- '/images/2020/05/1588718692455-561741-200.jpeg'
---
Work!

11
content/photo/5eb273c6/index.md

@ -1,11 +0,0 @@
---
date: '2020-05-06 09:22:30'
draft: false
photo:
- '/images/2020/05/1588753348847-489423-800.jpeg'
posttype: photo
slug: 5eb273c6
thumbnail:
- '/2020/05/1588753348847-489423-200.jpeg'
---
Another photo test - trying to manipulate photo url at the endpoint as I can't work out how to do it in hugo..

12
content/photo/help/index.md

@ -1,12 +0,0 @@
---
date: '2020-05-05 23:49:37'
draft: false
photo:
- '/images/2020/05/1588718976294-525143-800.jpeg'
posttype: photo
slug: help
thumbnail:
- '/images/2020/05/1588718976294-525143-200.jpeg'
title: help
---
It stopped workin

14
layouts/_default/section.html

@ -10,14 +10,16 @@
<aside> <aside>
{{if eq .Type "article" }}<a href="{{ .RelPermalink }}" class="link u-url"><h3 class="">{{ .Title }}</h3></a><b>{{ .Description }}</b>{{ end }} {{if eq .Type "article" }}<a href="{{ .RelPermalink }}" class="link u-url"><h3 class="">{{ .Title }}</h3></a><b>{{ .Description }}</b>{{ end }}
<div class="e-content"> <div class="e-content">
{{ with .Page.Params.Photo }}
{{range .Page.Params.Photo, $photo := .}}
{{ printf $photo }}
{{end}}
{{ end }}
{{ .Content }} {{ .Content }}
{{ if eq .Type "photo"}}
<div class="photos">
{{ range .Page.Params.Photo }}
<a class="u-url" href="{{ . }}"><img class="u-photo thumb" src="{{ replace . "800." "200."}}"/></a>
{{end}}
</div>
{{end}}
</div> </div>
<a href="{{ .RelPermalink }}" class="link u-url"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "02/01/2006 15:04 GMT" }}</time></a>
<a href="{{ .RelPermalink }}" class="link u-url time"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "02/01/2006 15:04 GMT" }}</time></a>
{{if eq .Type "article" }}<div class="post-footer"> {{if eq .Type "article" }}<div class="post-footer">
<div class="info"> <div class="info">
{{ with .Page.Params.Blog }}{{ partial "taxonomy/blog.html" . }}{{ end }} {{ with .Page.Params.Blog }}{{ partial "taxonomy/blog.html" . }}{{ end }}

17
themes/anatole/layouts/_default/single.html

@ -3,14 +3,23 @@
<div class="{{.Type}}" data-post-type="{{.Type }}"><div class="author" style="display:none;"><a rel="author" class="u-author p-author h-card" href="{{ .RelPermalink }}"><img class="u-photo" src="/images/profile.jpg" /></a></div> <div class="{{.Type}}" data-post-type="{{.Type }}"><div class="author" style="display:none;"><a rel="author" class="u-author p-author h-card" href="{{ .RelPermalink }}"><img class="u-photo" src="/images/profile.jpg" /></a></div>
<div class="post-content">{{ with .Page.Params.Image }}{{ partial "taxonomy/image.html" . }}{{ end }}<h3 class="post-title p-name entry-title">{{ .Title }}</h3> <div class="post-content">{{ with .Page.Params.Image }}{{ partial "taxonomy/image.html" . }}{{ end }}<h3 class="post-title p-name entry-title">{{ .Title }}</h3>
<aside> <aside>
<div class="info">
{{ if eq .Type "article" }}<div class="info">
<i class="fa fa-sun"></i><a class="u-url" href="{{ .RelPermalink }}"><span class="date"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "Mon, Jan 2, 2006" }}</time></span></a> <i class="fa fa-sun"></i><a class="u-url" href="{{ .RelPermalink }}"><span class="date"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "Mon, Jan 2, 2006" }}</time></span></a>
{{ if eq .Type "article" }}<i class="fa fa-clock"></i><span class="reading-time">{{ .ReadingTime }}-minute read</span>{{end}}
</div>
<i class="fa fa-clock"></i><span class="reading-time">{{ .ReadingTime }}-minute read</span>
</div>{{end}}
<div class="e-content">{{ .Content }}</div>
<div class="e-content">{{ .Content }}
{{ if eq .Type "photo"}}
<div class="photos">
{{ range .Page.Params.Photo }}
<a class="u-url" href="{{ . }}"><img class="u-photo thumb" src="{{ replace . "800." "200."}}"/></a>
{{end}}
</div>
{{end}}
</div>
<div class="post-footer"> <div class="post-footer">
{{ if not (eq .Type "article")}}<a class="u-url" href="{{ .RelPermalink }}"><span class="date"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "Mon, Jan 2, 2006" }}</time></span>{{end}}
<div class="info"> <div class="info">
{{ with .Page.Params.Blog }}{{ partial "taxonomy/blog.html" . }}{{ end }} {{ with .Page.Params.Blog }}{{ partial "taxonomy/blog.html" . }}{{ end }}
{{ with .Page.Params.Categories }}{{ partial "taxonomy/categories.html" . }}{{ end }} {{ with .Page.Params.Categories }}{{ partial "taxonomy/categories.html" . }}{{ end }}

28
themes/anatole/layouts/index.html

@ -3,22 +3,34 @@
<div class="about"> <div class="about">
<h1>Latest post</h1> <h1>Latest post</h1>
{{ range first 1 .Site.RegularPages }} {{ range first 1 .Site.RegularPages }}
<article class="h-entry entry">
<a rel="author" class="p-author h-card" href="{{ .RelPermalink }}" style="display:none;"><img class="u-photo" src="/images/profile.jpg" />{{ .Site.Params.Title }}</a>
{{if eq .Type "article"}}<h3 class="post-title p-name entry-title"><a class="u-url" href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
<h4 class="decription"><a href="{{ .RelPermalink }}">{{ .Description }}</a></h4>{{end}}
<div class="info">
<i class="fa fa-sun"></i><a class="u-url" href="{{ .RelPermalink }}"><span class="date"><span class="date"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "Mon, Jan 2, 2006" }}</time></span></a>
<article class="post h-entry entry contents">
<div class="{{.Type}}" data-post-type="{{.Type }}"><div class="author" style="display:none;"><a rel="author" class="u-author p-author h-card" href="{{ .RelPermalink }}"><img class="u-photo" src="/images/profile.jpg" /></a></div>
<div class="post-content">{{ with .Page.Params.Image }}{{ partial "taxonomy/image.html" . }}{{ end }}<h3 class="post-title p-name entry-title">{{ .Title }}</h3>
<aside>
<div class="index_info">
<i class="fa fa-sun"></i><a class="u-url" href="{{ .RelPermalink }}"><span class="date"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "Mon, Jan 2, 2006" }}</time></span></a>
<i class="fa fa-clock"></i><span class="reading-time">{{ .ReadingTime }}-minute read</span> <i class="fa fa-clock"></i><span class="reading-time">{{ .ReadingTime }}-minute read</span>
</div> </div>
<div class="e-content">{{ .Content }}</div>
<div class="post-footer">
<div class="e-content">{{ .Content }}
{{ if eq .Type "photo"}}
<div class="photos">
{{ range .Page.Params.Photo }}
<a class="u-url" href="{{ . }}"><img class="u-photo thumb" src="{{ replace . "800." "200."}}"/></a>
{{end}}
</div>
{{end}}
</div>
<div class="index-post-footer">
<div class="info"> <div class="info">
{{ with .Page.Params.Blog }}{{ partial "taxonomy/blog.html" . }}{{ end }} {{ with .Page.Params.Blog }}{{ partial "taxonomy/blog.html" . }}{{ end }}
{{ with .Page.Params.Categories }}{{ partial "taxonomy/categories.html" . }}{{ end }} {{ with .Page.Params.Categories }}{{ partial "taxonomy/categories.html" . }}{{ end }}
{{ with .Page.Params.Tags }}{{ partial "taxonomy/tags.html" . }}{{ end }} {{ with .Page.Params.Tags }}{{ partial "taxonomy/tags.html" . }}{{ end }}
</div> </div>
</div> </div>
</aside></div>
</div>
</article> </article>
<a href="https://brid.gy/publish/mastodon"></a> <a href="https://brid.gy/publish/mastodon"></a>
{{ end }} {{ end }}

2
themes/anatole/layouts/partials/taxonomy/photo.html

@ -1,7 +1,7 @@
<span class="separator"> <span class="separator">
{{- range $index, $el := . -}} {{- range $index, $el := . -}}
<a href="{{printf "$s" ( . | urlize) | relLangURL }}"><img class="p-photo" src="{{ printf (replace $s "-800" "-200") ( . | urlize ) | relLangURL }}" /></a>
<a href="{{printf "$s" ( . | urlize) | relLangURL }}"><img class="p-photo" src="{{ printf "$s" ( . | urlize ) | relLangURL }}" /></a>
{{- end -}} {{- end -}}
</span> </span>

35
themes/anatole/static/css/style.css

@ -128,7 +128,9 @@ pre {
opacity: 0.5; opacity: 0.5;
margin-right: 5px; margin-right: 5px;
} }
.index_info i{
opacity: 0.5;
}
a:link, a:visited { a:link, a:visited {
opacity: 1; opacity: 1;
-webkit-transition: all .15s linear; -webkit-transition: all .15s linear;
@ -369,6 +371,9 @@ width:95%;
padding: 0 0 30px 0; padding: 0 0 30px 0;
border-bottom: 1px solid var(--text-colour); border-bottom: 1px solid var(--text-colour);
} }
.index-post-footer{
padding: 0 0 30px 0;
}
.post .post-footer .meta { .post .post-footer .meta {
max-width: 100%; max-width: 100%;
height: 25px; height: 25px;
@ -382,9 +387,12 @@ width:95%;
.post .post-footer .info .separator a { .post .post-footer .info .separator a {
margin-right: 0.2em; margin-right: 0.2em;
} }
.post .post-footer .meta .info .date {
.post .post-footer .meta .info .date{
margin-right: 10px; margin-right: 10px;
} }
.index_info .date {
margin: 0 10px;
}
.info { .info {
margin: 1em; margin: 1em;
} }
@ -726,7 +734,28 @@ a.btn {
} }
.contents aside time{ .contents aside time{
font-size:12px;
font-size:13px;
width:100%;
}
.contents aside a.time{
text-decoration:underline dashed;
}
.contents aside .info time{
font-size:15px;
}
.contents .photos{
display:inline-block;
width:100%;
float:left;
min-width:100%;
margin-bottom:10px;
}
.contents .thumb{
width:300px;
float:left;
display:inline;
padding:0px;
border: 1px solid var(--text-colour);
} }
.pagination { .pagination {