jon
/
jk_na
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

styling updates
continuous-integration/drone/push Build is passing
Details

master
jk 4 years ago
parent
d645ed1648
commit
7865e5dcf6
7 changed files with 188 additions and 329 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 39
      layouts/_default/section.html
  2. 34
      themes/nipponalba/layouts/_default/single.html
  3. 13
      themes/nipponalba/layouts/index.html
  4. 23
      themes/nipponalba/layouts/partials/bookmarks.html
  5. 6
      themes/nipponalba/layouts/partials/taxonomy/categories.html
  6. 6
      themes/nipponalba/layouts/partials/taxonomy/tags.html
  7. 396
      themes/nipponalba/static/css/style.css

39
layouts/_default/section.html
View File

@ -9,12 +9,17 @@
<div class="author" style="display:none;"> <div class="author" style="display:none;">
<a rel="author" class="u-author h-card" rel="me" href="https://jk.nipponalba.scot">{{ .Site.Params.Title }}<img src="/images/profile.jpg"/></a> <a rel="author" class="u-author h-card" rel="me" href="https://jk.nipponalba.scot">{{ .Site.Params.Title }}<img src="/images/profile.jpg"/></a>
</div> </div>
<aside>
{{if eq .Type "article" }}<br/><a href="{{ .RelPermalink }}" class="link u-url"><h3 class="">{{ .Title }}</h3></a><b>{{ .Description }}</b><br/>{{ with .Page.Params.Image }}{{ partial "taxonomy/image.html" . }}{{ end }}{{ end }}
<aside class="index_content">
{{if eq .Type "article" }}<br/>{{ with .Page.Params.Image }}{{ partial "taxonomy/image.html" . }}{{ end }}<a href="{{ .Permalink }}" class="u-url"><h3 class="p-name entry-title">{{ .Title }}</h3></a><b>{{ .Description }}</b>{{ end }}
{{ if eq .Type "article" }}<div class="info">
{{ with .Page.Params.Blog }}Blog: {{ partial "taxonomy/blog.html" . }}{{ end }}<span id="info-date"><a href="{{ .Permalink }}" class="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></span><br/>
{{ with .Page.Params.category }}Categories: {{ partial "taxonomy/categories.html" . }}{{ end }}<span class="reading-time">{{ .ReadingTime }}-minute read</span><br/>
{{ with .Page.Params.tag }}Tags: {{ partial "taxonomy/tags.html" . }}{{ end }}
</div>{{ end }}
<div class="e-content"> <div class="e-content">
{{ .Content }} {{ .Content }}
{{ if eq .Type "photo"}} {{ if eq .Type "photo"}}
<div class="photos">
<div class="photogrid">
{{ range .Page.Params.Photo }} {{ range .Page.Params.Photo }}
<a class="u-url" href="{{ . }}"> <a class="u-url" href="{{ . }}">
<picture> <picture>
@ -27,33 +32,29 @@
</div> </div>
{{end}} {{end}}
</div> </div>
<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">
<div class="info">
{{ with .Page.Params.Blog }}{{ partial "taxonomy/blog.html" . }}{{ end }}
{{ with .Page.Params.category }}{{ partial "taxonomy/categories.html" . }}{{ end }}
{{ with .Page.Params.tag }}{{ partial "taxonomy/tags.html" . }}{{ end }}
</div>
</div>{{end}}
{{ if not (eq .Type "article") }}<div class="info">
{{ with .Page.Params.category }}Categories: {{ partial "taxonomy/categories.html" . }}{{ end }}<div id="info-date"><a href="{{ .Permalink }}" class="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></div><br/>
</div>{{ end }}
</aside> </aside>
</section><hr/> </section><hr/>
{{ else }} {{ else }}
{{ if .Params.inreplyto }}<section data-post-type="in-reply-to" data-post-id="{{ .Params.slug }}" class="h-entry" id="response">{{ end }} {{ if .Params.inreplyto }}<section data-post-type="in-reply-to" data-post-id="{{ .Params.slug }}" class="h-entry" id="response">{{ end }}
{{ if .Params.likeof }}<section data-post-type="like-of" data-post-id="{{ .Params.slug }}" class="h-entry" id="response">{{ end }} {{ if .Params.likeof }}<section data-post-type="like-of" data-post-id="{{ .Params.slug }}" class="h-entry" id="response">{{ end }}
{{ if .Params.repostof }}<section data-post-type="repost-of" data-post-id="{{ .Params.slug }}" class="h-entry" id="response">{{ end }} {{ if .Params.repostof }}<section data-post-type="repost-of" data-post-id="{{ .Params.slug }}" class="h-entry" id="response">{{ end }}
<div class="author">
<div class="author" style="display:none;">
<a rel="author" class="p-author h-card" rel="me" href="https://jk.nipponalba.scot"><img src="/images/profile.jpg"/><div class="title">{{ .Site.Params.Title }}</div></a> <a rel="author" class="p-author h-card" rel="me" href="https://jk.nipponalba.scot"><img src="/images/profile.jpg"/><div class="title">{{ .Site.Params.Title }}</div></a>
</div> </div>
<aside>
{{ if .Params.inreplyto }}<article class="h-cite"><p> Replied to {{ end }}
{{ if .Params.likeof }}<article class="h-cite"><p> Liked {{ end }}
{{ if .Params.repostof }}<article class="h-cite"><p>Shared {{ end }}
someone's
<aside><article class="h-cite"><p>{{ .Site.Params.Title }}
{{ if .Params.inreplyto }} replied to a{{ end }}
{{ if .Params.likeof }} liked a{{ end }}
{{ if .Params.repostof }} shared a{{ end }}
{{ if .Params.likeof }}<a href="{{ .Params.likeof }}" class="u-like-of"> post</a>{{ end }} {{ if .Params.likeof }}<a href="{{ .Params.likeof }}" class="u-like-of"> post</a>{{ end }}
{{ if .Params.inreplyto }}<a href="{{ .Params.inreplyto }}" class="u-in-reply-to"> post</a>{{ end }} {{ if .Params.inreplyto }}<a href="{{ .Params.inreplyto }}" class="u-in-reply-to"> post</a>{{ end }}
{{ if .Params.repostof }}<a href="{{ .Params.repostof }}" class="u-repost-of"> post</a>{{ end }}</p> {{ if .Params.repostof }}<a href="{{ .Params.repostof }}" class="u-repost-of"> post</a>{{ end }}</p>
{{ if .Content }}<div class="p-name p-content">{{ .Content }}</div><br/> {{end}}
<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 .Content }}<div class="p-name p-content">{{ .Content }}</div>{{end}}
{{ if not (eq .Type "article") }}<div class="info">
{{ with .Page.Params.category }}Categories: {{ partial "taxonomy/categories.html" . }}{{ end }}<span id="info-date"><a href="{{ .Permalink }}" class="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></span><br/>
</div>{{ end }}
</article> </article>
</aside> </aside>
</section><hr/> </section><hr/>

34
themes/nipponalba/layouts/_default/single.html
View File

@ -4,17 +4,18 @@
<div class="author" style="display:none;"> <div class="author" style="display:none;">
<a rel="author" class="u-author h-card" rel="me" href="https://jk.nipponalba.scot">{{ .Site.Params.Title }}<img src="/images/profile.jpg"/></a> <a rel="author" class="u-author h-card" rel="me" href="https://jk.nipponalba.scot">{{ .Site.Params.Title }}<img src="/images/profile.jpg"/></a>
</div> </div>
<div class="post-content">{{ with .Page.Params.Image }}{{ partial "taxonomy/image.html" . }}{{ end }}<h3 class="post-title p-name entry-title">{{ .Title }}</h3><b>{{ .Description }}</b>
{{ with .Page.Params.Image }}{{ partial "taxonomy/image.html" . }}{{ end }}<h3 class="p-name entry-title">{{ .Title }}</h3><b>{{ .Description }}</b>
<aside> <aside>
{{ 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-clock"></i><span class="reading-time">{{ .ReadingTime }}-minute read</span>
</div>{{end}}
{{ if eq .Type "article" }}<div class="info">
{{ with .Page.Params.Blog }}Blog: {{ partial "taxonomy/blog.html" . }}{{ end }}<span id="info-date"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "02/01/2006 15:04 GMT" }}</time></span><br/>
{{ with .Page.Params.category }}Categories: {{ partial "taxonomy/categories.html" . }}{{ end }}<span class="reading-time">{{ .ReadingTime }}-minute read</span><br/>
{{ with .Page.Params.tag }}Tags: {{ partial "taxonomy/tags.html" . }}{{ end }}
</div>{{ end }}
<div class="e-content"> <div class="e-content">
{{ .Content }} {{ .Content }}
{{ if eq .Type "photo"}} {{ if eq .Type "photo"}}
<div class="photos">
<div class="photogrid">
{{ range .Page.Params.Photo }} {{ range .Page.Params.Photo }}
<a href="{{ . }}"><img class="u-photo thumb" src="{{ replace . "800." "300."}}"/></a> <a href="{{ . }}"><img class="u-photo thumb" src="{{ replace . "800." "300."}}"/></a>
{{end}} {{end}}
@ -25,9 +26,9 @@
</div> </div>
{{ end }}<br/> {{ end }}<br/>
</div> </div>
<div class="post-footer-page">
<div class="date"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "02/01/2006 15:04 GMT" }}</time></div>
{{ if not (eq .Type "article") }}<div class="info">
{{ with .Page.Params.category }}Categories: {{ partial "taxonomy/categories.html" . }}{{ end }}<span id="info-date"><a href="{{ .Permalink }}" class="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></span><br/>
</div>{{ end }}
{{ $pathJSON := (print .Permalink "bridgy.json") }} {{ $pathJSON := (print .Permalink "bridgy.json") }}
{{ $relpathJSON := (print .RelPermalink "bridgy.json") }} {{ $relpathJSON := (print .RelPermalink "bridgy.json") }}
{{ if fileExists $relpathJSON }} {{ if fileExists $relpathJSON }}
@ -36,12 +37,6 @@
Syndicated to <a href="{{ printf $mJSON.url}}">Pleroma</a> Syndicated to <a href="{{ printf $mJSON.url}}">Pleroma</a>
</div> </div>
{{ end }} {{ end }}
<div class="info">
{{ with .Page.Params.Blog }}Blog: {{ partial "taxonomy/blog.html" . }}<br/>{{ end }}
{{ with .Page.Params.category }}Categories: {{ partial "taxonomy/categories.html" . }}<br/>{{ end }}
{{ with .Page.Params.tag }}Tags: {{ partial "taxonomy/tags.html" . }}{{ end }}
</div>
</div>
<a href="https://brid.gy/publish/mastodon"></a> <a href="https://brid.gy/publish/mastodon"></a>
<div class="interactions"><h4>Interactions</h4></div> <div class="interactions"><h4>Interactions</h4></div>
<div class="webmention-form"> <div class="webmention-form">
@ -62,7 +57,7 @@
</div> </div>
{{ end }} {{ end }}
</aside></div>
</aside>
</article> </article>
{{ else if eq .Type "bookmarkof" }} {{ else if eq .Type "bookmarkof" }}
{{ $cats := slice }} {{ $cats := slice }}
@ -81,7 +76,7 @@
</div> </div>
<aside> <aside>
<article class="h-cite"> <article class="h-cite">
<u><a href="{{ .bookmarkof | absURL }}" class="u-bookmark-of" target="_blank">{{ .name }}</a></u> - <div class="p-name p-content">{{ .content | markdownify }}</div>
<a href="{{ .bookmarkof | absURL }}" class="u-bookmark-of" target="_blank">{{ .name }}</a> - <div class="p-name p-content">{{ .content | markdownify }}</div>
</article> </article>
</aside> </aside>
</section> </section>
@ -99,8 +94,9 @@
{{ if .Params.repostof }}<p>Shared <a href="{{ .Params.repostof }}" class="u-url u-repost-of"> {{ .Params.repostof }}</a>{{ end }}</p> {{ if .Params.repostof }}<p>Shared <a href="{{ .Params.repostof }}" class="u-url u-repost-of"> {{ .Params.repostof }}</a>{{ end }}</p>
{{ if .Content }}<div class="p-name p-content"><p>{{ .Content }}</p></div> {{end}} {{ if .Content }}<div class="p-name p-content"><p>{{ .Content }}</p></div> {{end}}
</div> </div>
<div class="date"><a href="{{ .Permalink }}" class="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></div>
</article>
{{ if not (eq .Type "article") }}<div class="info">
{{ with .Page.Params.category }}Categories: {{ partial "taxonomy/categories.html" . }}{{ end }}<span id="info-date"><a href="{{ .Permalink }}" class="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></span><br/>
</div>{{ end }}
{{end}} {{end}}
{{end}} {{end}}

13
themes/nipponalba/layouts/index.html
View File

@ -24,11 +24,16 @@
<div class="author" style="display:none;"> <div class="author" style="display:none;">
<a rel="author" class="u-author h-card" rel="me" href="https://jk.nipponalba.scot">{{ .Site.Params.Title }}<img src="/images/profile.jpg"/></a> <a rel="author" class="u-author h-card" rel="me" href="https://jk.nipponalba.scot">{{ .Site.Params.Title }}<img src="/images/profile.jpg"/></a>
</div> </div>
<div class="post-content">{{ with .Page.Params.Image }}{{ partial "taxonomy/image.html" . }}{{ end }}<h3 class="post-title p-name entry-title">{{ .Title }}</h3>
{{ with .Page.Params.Image }}{{ partial "taxonomy/image.html" . }}{{ end }}<h3 class="p-name entry-title">{{ .Title }}</h3>
<aside> <aside>
<div class="index_info"> <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>
{{ if eq .Type "article" }}
{{ with .Page.Params.Blog }}Blog: {{ partial "taxonomy/blog.html" . }}{{ end }}<span id="info-date"><time class="dt-published" datetime="{{ .Date.Format "2 Jan 2006 15:04 GMT" }}">{{ .Date.Format "02/01/2006 15:04 GMT" }}</time></span><br/>
{{ with .Page.Params.category }}Categories: {{ partial "taxonomy/categories.html" . }}{{ end }}<span class="reading-time">{{ .ReadingTime }}-minute read</span><br/>
{{ with .Page.Params.tag }}Tags: {{ partial "taxonomy/tags.html" . }}{{ end }}
{{ else }}
<span id="index-info-date"><a href="{{ .Permalink }}" class="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></span><br/>{{ with .Page.Params.category }}Categories: {{ partial "taxonomy/categories.html" . }}{{ end }}
{{ end }}
</div> </div>
<div class="e-content">{{ .Content }} <div class="e-content">{{ .Content }}
@ -48,7 +53,7 @@
{{ with .Page.Params.tag }}{{ partial "taxonomy/tags.html" . }}{{ end }} {{ with .Page.Params.tag }}{{ partial "taxonomy/tags.html" . }}{{ end }}
</div> </div>
</div> </div>
</aside></div>
</aside>
</div> </div>
<a href="https://brid.gy/publish/mastodon"></a> <a href="https://brid.gy/publish/mastodon"></a>
</article> </article>

23
themes/nipponalba/layouts/partials/bookmarks.html
View File

@ -1,23 +0,0 @@
{{ $cats := slice }}
{{ range .Site.Data.bookmarks }}
{{ $cats = $cats | append .category }}
{{ end }}
{{ $cats = uniq $cats | sort }}
{{ range $cats }}
{{ $cat := . }}
<h4>{{ $cat }}</h4>
{{ range $.Site.Data.bookmarks }}
{{ if eq .category $cat }}
<section data-post-type="bookmark-of" data-post-id="{{ .Params.slug }}" class="bookmark h-entry">
<div class="author" style="display:none">
<a rel="author" class="p-author h-card" rel="me" href="https://jk.nipponalba.scot"><img src="/images/profile.jpg"/><div class="title">{{ .Site.Params.Title }}</div></a>
</div>
<aside>
<article class="h-cite">
<u><a href="{{ .bookmarkof | absURL }}" class="u-bookmark-of" target="_blank">{{ .name }}</a></u> - <div class="p-name p-content">{{ .content | markdownify }}</div>
</article>
</aside>
</section>
{{ end }}
{{ end }}
{{ end }}

6
themes/nipponalba/layouts/partials/taxonomy/categories.html
View File

@ -1,6 +1,6 @@
<span class="separator">
<ul class="categories">
{{- range $index, $el := . -}} {{- range $index, $el := . -}}
<a class="category p-category" href="{{ ( printf "categories/%s/" ( . | urlize ) ) | relLangURL }}">{{ . }}</a>
<li><a class="category p-category" href="{{ ( printf "categories/%s/" ( . | urlize ) ) | relLangURL }}">{{ . }}</a></li>
{{- end -}} {{- end -}}
</span>
</ul>

6
themes/nipponalba/layouts/partials/taxonomy/tags.html
View File

@ -1,6 +1,6 @@
<span class="separator">
<ul class="tags">
{{- range $index, $el := . -}} {{- range $index, $el := . -}}
<a class="tag" href="{{ ( printf "tags/%s/" ( . | urlize ) ) | relLangURL }}">{{ . }}</a>
<li><a class="tag" href="{{ ( printf "tags/%s/" ( . | urlize ) ) | relLangURL }}">{{ . }}</a></li>
{{- end -}} {{- end -}}
</span>
</ul>

396
themes/nipponalba/static/css/style.css
View File

@ -73,11 +73,11 @@ body {
p { p {
line-height: 1.9em; line-height: 1.9em;
font-weight: 400; font-weight: 400;
font-size: 14px;
font-size: 15px;
} }
a { a {
text-decoration: none; text-decoration: none;
color: var(--link-colour);
} }
a:link, a:visited { a:link, a:visited {
opacity: 1; opacity: 1;
@ -86,10 +86,10 @@ a:link, a:visited {
-o-transition: all .15s linear; -o-transition: all .15s linear;
-ms-transition: all .15s linear; -ms-transition: all .15s linear;
transition: all .15s linear; transition: all .15s linear;
color: var(--text-colour);
color: var(--link-colour);
} }
a:hover, a:active { a:hover, a:active {
color: var(--link-colour);
color: var(--text-colour);
} }
img { img {
opacity: var(--opacity-img); opacity: var(--opacity-img);
@ -98,7 +98,27 @@ img {
img:hover { img:hover {
opacity: 1 opacity: 1
} }
table {
border-collapse:collapse;
}
table, td, th{
border: 1px dotted var(--text-colour);
padding:15px;
}
h3 {
color: var(--text-colour);
font-size: 22px;
font-weight: 600;
line-height: 1.6;
}
h4 {
color: var(--text-colour);
font-size: 16px;
}
pre {
background: var(--bg-colour);
padding: 5px;
}
#page{ #page{
color: var(--text-colour); color: var(--text-colour);
background: var(--bg-colour); background: var(--bg-colour);
@ -129,7 +149,13 @@ img:hover {
background: var(--bg-colour); background: var(--bg-colour);
margin: 0 auto; margin: 0 auto;
} }
.page-top .nav {
.page-top a {
color: var(--text-colour);
}
.page-top a:hover {
color: var(--link-colour);
}
.nav {
width:80%; width:80%;
list-style: none; list-style: none;
padding: 18px 0px; padding: 18px 0px;
@ -137,52 +163,39 @@ width:80%;
font-size: 14px; font-size: 14px;
display:inline-block; display:inline-block;
} }
.page-top .nav li{
.nav li{
position: relative; position: relative;
display: initial; display: initial;
padding-right: 20px; padding-right: 20px;
} }
.page-top .nav a {
color: var(--text-colour);
}
.page-top .nav a:hover {
color: var(--link-colour);
}
.page-top .selectors{
.selectors{
width:130px; width:130px;
float:right; float:right;
display:inline-block; display:inline-block;
vertical-align:middle; vertical-align:middle;
padding: 10px 0px; padding: 10px 0px;
} }
.page-top .language-selector {
.selectors i{
margin:0;
padding-left:10px;;
}
.language-selector {
position:relative; position:relative;
display:inline-block; display:inline-block;
float:right; float:right;
padding:0px 10px;padding:0; padding:0px 10px;padding:0;
margin:0; margin:0;
} }
.page-top .language-selector ul{
.language-selector ul{
list-style:none; list-style:none;
padding:0; padding:0;
margin:0; margin:0;
} }
.page-top .selectors .theme-selector{
.theme-selector{
margin:0; margin:0;
padding:0; padding:0;
} }
.page-top .selectors i{
margin:0;
padding-left:10px;;
}
.content { .content {
background: var(--bg-colour);
color: var(--text-colour);
display:block;
width: 100% !important;
margin-top: 0 auto;
padding:0;
height: 95%; height: 95%;
overflow:auto; overflow:auto;
-ms-overflow-style: none; -ms-overflow-style: none;
@ -191,14 +204,13 @@ width:80%;
.content::-webkit-scrollbar{ .content::-webkit-scrollbar{
display:none; display:none;
} }
.content .profile{
.profile{
width:85% !important; width:85% !important;
display:block; display:block;
margin: 0 auto; margin: 0 auto;
padding-top:30px; padding-top:30px;
} }
.content .profile .profile-left{
.profile-left{
width:20% !important; width:20% !important;
min-width: 200px; min-width: 200px;
padding:0; padding:0;
@ -206,92 +218,92 @@ width:80%;
display:inline-block; display:inline-block;
vertical-align:middle; vertical-align:middle;
} }
.content .profile .profile-right{
.profile-right{
vertical-align:top; vertical-align:top;
width:65%;
width:75%;
display:inline-block; display:inline-block;
padding:0; padding:0;
margin:0; margin:0;
text-align:justify; text-align:justify;
} }
.content .profile img{
.profile-right a{
color: var(--text-colour);
}
.profile-right a:hover{
color: var(--link-colour);
}
.profile img{
width:165px; width:165px;
border-radius: 5%; border-radius: 5%;
margin-right: 40px; margin-right: 40px;
} }
.content .profile .description {
font-size: 14px;
color: var(--text-colour);
margin-left: 10px;
}
.content .profile .logo {
margin: 0 auto;
}
.content .profile .title{
.profile .title{
text-transform: uppercase; text-transform: uppercase;
font-size: 1.5rem;
font-size: 1.8rem;
font-weight: bold; font-weight: bold;
letter-spacing: 2px;
letter-spacing: 1.5px;
line-height: 1; line-height: 1;
display:inline-block; display:inline-block;
padding-left:10px; padding-left:10px;
margin-bottom:5px;
}
.content .profile .title a {
text-decoration: none;
color: var(--text-colour);
font-size: 2rem;
font-weight: bold;
} }
.content .profile .social-links {
.social-links {
list-style: none; list-style: none;
padding: 0; padding: 0;
} }
.content .profile .social-links i {
.social-links i {
margin-right: 3px; margin-right: 3px;
} }
.content .profile .social-links li {
.social-links li {
display: inline; display: inline;
} }
.content .profile .social-links a {
.social-links a {
color: var(--text-colour); color: var(--text-colour);
} }
.content .profile .social-links a:hover {
.social-links a:hover {
color: var(--link-colour); color: var(--link-colour);
} }
.category {
padding: 4px 6px;
border-radius: 3px;
border: 1px solid var(--text-colour);
.info i{
opacity: 0.5;
margin-right: 5px;
} }
.blog {
padding: 4px 6px;
border-radius: 3px;
background: var(--link-colour);
border: 1px solid var(--text-colour);
.info{
padding: 30px 0;
font-size:13px;
}
#info-date{
float:right;
}
#info-date .dt-published{
font-size:13px;
}
.category, .blog, .tag, #info-date {
display: inline-block;
font-size: 13px;
line-height: 1.5;
}
.categories, .tags{
display:inline;
margin:0;
padding:0;
}
.categories li, .tags li{
list-style:none;
display:inline;
} }
.tag::before { .tag::before {
content: "#"; content: "#";
opacity: .75; opacity: .75;
} }
.tag, .category {
display: inline-block;
font-size: 15px;
line-height: 1;
margin: 5px 8px 5px 0;
.categories li::after, .tags li::after{
content: ", ";
} }
pre {
background: var(--bg-colour);
padding: 5px;
.categories li:last-child:after, .tags li:last-child:after{
content: "";
} }
.info i{
opacity: 0.5;
margin-right: 5px;
}
.info{
padding: 30px 0;
.reading-time{
display:inline;
float:right;
font-weight:bold;
} }
.index_info i{ .index_info i{
opacity: 0.5; opacity: 0.5;
@ -300,161 +312,36 @@ pre {
padding-bottom:150px; padding-bottom:150px;
} }
.post{ .post{
background: var(--bg-colour);
margin: 30px 0; margin: 30px 0;
}
.post .banner{
}
.index_content{
text-align:justify;
width:100%;
}
.banner{
width:90%; width:90%;
max-height: 300px; max-height: 300px;
object-fit:scale-down; object-fit:scale-down;
object-position:top; 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 {
.h-entry p a {
text-decoration: none; text-decoration: none;
color: var(--link-colour); 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 dotted 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 {
.h-entry a:hover {
color: var(--link-colour); 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 {
.h-entry img {
text-align: center; text-align: center;
max-width: 800px; max-width: 800px;
margin: 0 auto; margin: 0 auto;
display:block; display:block;
padding:10px; padding:10px;
} }
.post .post-footer {
padding: 0 0 100px 0;
border-bottom: 1px dotted var(--text-colour);
}
.post .post-footer-page {
padding: 0 0 0 0;
width:100%;
display:block;
}
.post .post-footer .meta, .post .post-footer-page .meta {
max-width: 100%;
height: 25px;
color: var(--text-colour);
}
.post .post-footer .meta .info, .post .post-footer-page .meta .info {
float: left;
font-size: 12px;
margin-bottom: 1em;
}
.post .post-footer .info .separator a, .post .post-footer-page .info .separator a{
margin-right: 0.2em;
}
.post .post-footer .meta .info .date, .post .post-footer-page .meta .info .date{
margin-right: 10px;
}
.index_info .date {
margin: 0 10px;
}
.post .post-footer .meta a, .post .post-footer-page .meta a{
text-decoration: none;
color: var(--text-colour);
padding-right: 10px;
}
.post .post-footer .meta a:hover, .post .post-footer-page .meta a:hover,{
color: var(--link-colour);
}
.post .post-footer .blog, .post .post-footer-page .blog{
color: var(--text-colour);
}
.post .post-footer .blog:hover, .post .post-footer-page .blog:hover{
color: var(--text-colour);
}
.post .post-footer .meta i, .post .post-footer-page .meta i{
margin-right: 6px;
}
.post .post-footer .tags, .post .post-footer-page .tags{
padding-bottom: 15px;
font-size: 13px;
}
.post .post-footer .tags ul, .post .post-footer-page .tags ul{
list-style-type: none;
display: inline;
margin: 0;
padding: 0;
}
.post .post-footer .tags ul li, .post .post-footer-page .tags ul li{
list-style-type: none;
margin: 0;
padding-right: 5px;
display: inline;
}
.post .post-footer .tags a, .post .post-footer-page .tags a{
text-decoration: none;
color: var(--text-colour);
font-weight: 400;
}
.post .post-footer .tags a:hover, .post .post-footer-page .tags a:hover{
text-decoration: none;
}
.post .post-footer-page .syndication{
display:inline;
float:right;
text-align:right;
font-size:13px;
}
.post .post-footer-page .date{
.syndication{
display:inline; display:inline;
float:left; float:left;
}
.post .post-footer-page{
display:block;
width:100%
font-size:13px;
} }
.interactions{ .interactions{
margin:20px 0 10px 0; margin:20px 0 10px 0;
@ -483,13 +370,13 @@ width:100%
margin-top: 0 20px 0 0 ; margin-top: 0 20px 0 0 ;
padding: 0 0 200px 0; padding: 0 0 200px 0;
} }
.webmentions .remote_profile{
.remote_profile{
height: 100%; height: 100%;
width: 70px; width: 70px;
display:inline-block; display:inline-block;
vertical-align:top; vertical-align:top;
} }
.webmentions .remote_profile img{
.remote_profile img{
width: 50px; width: 50px;
border-radius: 50%; border-radius: 50%;
display:inline; display:inline;
@ -497,7 +384,7 @@ width:100%
border:0; border:0;
padding:0; padding:0;
} }
.webmentions .interaction{
.interaction{
border:1px dotted var(--text-colour); border:1px dotted var(--text-colour);
padding: 10px; padding: 10px;
display:block; display:block;
@ -505,27 +392,27 @@ width:100%
min-height:60px; min-height:60px;
vertical-align:top; vertical-align:top;
} }
.webmentions .interaction .intactivity{
.interaction .intactivity{
font-size:13px; font-size:13px;
font-style:italic; font-style:italic;
line-height:18px; line-height:18px;
} }
.webmentions .interaction .intcontent{
.interaction .intcontent{
display:inline-block; display:inline-block;
font-size:15px; font-size:15px;
vertical-align:top; vertical-align:top;
max-width: 90%; max-width: 90%;
} }
.webmentions .interaction time{
.interaction time{
font-size:12px; font-size:12px;
} }
.webmentions .interaction h4{
.interaction h4{
line-height:15px; line-height:15px;
padding:0; padding:0;
margin:0; margin:0;
display:block; display:block;
} }
.webmentions .interaction.like, .webmentions .interaction.share{
.interaction.like, .interaction.share{
border:0; border:0;
color: var(--text-colour); color: var(--text-colour);
padding:2px; padding:2px;
@ -534,11 +421,12 @@ width:100%
width:100%; width:100%;
min-height:30px; min-height:30px;
} }
.webmentions .interaction.like img, .webmentions .interaction.share img{
.interaction.like img,.interaction.share img{
display:inline-flex; display:inline-flex;
float:left; float:left;
width:30px; width:30px;
height:30px; height:30px;
margin:0;
border-radius: 50%; border-radius: 50%;
} }
.footer { .footer {
@ -628,53 +516,43 @@ width:100%
margin:0 auto; margin:0 auto;
display:block; display:block;
} }
.content hr {
hr {
color: var(--text-colour); color: var(--text-colour);
} }
.content .author{
width: 75px;
display:inline-block;
margin:0;
padding:0;
}
.content .author img{
width:50px;
margin: auto 0;
}
.content .author .title{
.author .title{
display:none; display:none;
} }
.content aside{
#response .h-cite{
width:100%; width:100%;
display:inline-block; display:inline-block;
vertical-align: top;
vertical-align:top;
padding:0;
} }
.content #response p-content{
width:90%;
#response p{
margin:0;
} }
.content aside time, .h-cite time, .content #response time{
time{
font-size:13px; font-size:13px;
width:100%;
}
.content aside a.time{
text-decoration:underline dashed;
}
.content aside .info time{
font-size:15px;
} }
.bookmark .p-content{ .bookmark .p-content{
display:inline; display:inline;
margin:0; margin:0;
padding:0; padding:0;
} }
.photos{
display:inline-block;
.photo{
display:flex;
width:100%;
}
.photogrid{
display:block;
width:100%; width:100%;
float:left; float:left;
min-width:100%; min-width:100%;
margin-bottom:10px; margin-bottom:10px;
} }
.content img.thumb{
img.thumb{
width:300px; width:300px;
float:left; float:left;
display:inline; display:inline;
@ -703,7 +581,12 @@ hr{
.pagination-bottom{ .pagination-bottom{
padding-bottom:100px; padding-bottom:100px;
} }
.pagination a {
color: var(--text-colour);
}
.pagination a:hover {
color: var(--link-colour);
}
.anchor { .anchor {
display:none; display:none;
} }
@ -760,9 +643,6 @@ hr{
.page-top .language-selector i{ .page-top .language-selector i{
padding:0 5px; padding:0 5px;
} }
.post-title h3, section aside h3 {
line-height: 1.6;
}
.content { .content {
width:90%; width:90%;