Site param "inlinecss", improvements here & there
This commit is contained in:
parent
858e30eb5a
commit
6e47ef329e
|
|
@ -152,7 +152,7 @@ body {
|
|||
min-width: 0;
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
@mixin clearfix {
|
||||
display: block;
|
||||
&::after {
|
||||
display: block;
|
||||
|
|
@ -178,14 +178,16 @@ textarea {
|
|||
}
|
||||
|
||||
/* Button */
|
||||
.btn {
|
||||
@mixin btn {
|
||||
padding: 5px 10px;
|
||||
font-weight: 700;
|
||||
white-space: pre-line;
|
||||
@include color(color, contrast-text);
|
||||
@include color(background, contrast-background);
|
||||
&:hover {
|
||||
* {
|
||||
@include color(color, contrast-text);
|
||||
}
|
||||
@include color(background, main-color);
|
||||
}
|
||||
* {
|
||||
|
|
@ -477,6 +479,7 @@ select {
|
|||
}
|
||||
|
||||
/* Posts/Pages */
|
||||
|
||||
.main-header {
|
||||
margin-bottom: 20px;
|
||||
.main-title {
|
||||
|
|
@ -486,21 +489,9 @@ select {
|
|||
margin: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.post-meta {
|
||||
@extend .meta;
|
||||
padding: 5px 0;
|
||||
@include color-border(border-top, 1px, dotted, border);
|
||||
@include color-border(border-bottom, 1px, dotted, border);
|
||||
}
|
||||
}
|
||||
|
||||
.main-content {
|
||||
@extend .content;
|
||||
@extend .clearfix;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.meta {
|
||||
@mixin meta {
|
||||
font-size: .8125rem;
|
||||
vertical-align: baseline;
|
||||
@include color(color, meta);
|
||||
|
|
@ -520,12 +511,26 @@ select {
|
|||
}
|
||||
}
|
||||
|
||||
.post-meta {
|
||||
@include meta;
|
||||
padding: 5px 0;
|
||||
@include color-border(border-top, 1px, dotted, border);
|
||||
@include color-border(border-bottom, 1px, dotted, border);
|
||||
}
|
||||
|
||||
.main-content {
|
||||
@extend .content;
|
||||
@include clearfix;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.oldcontent {
|
||||
padding: 5px;
|
||||
@include color-border(border, 1px, solid, border);
|
||||
}
|
||||
|
||||
.content {
|
||||
@include clearfix;
|
||||
a {
|
||||
font-weight: 700;
|
||||
text-decoration: underline;
|
||||
|
|
@ -557,32 +562,25 @@ select {
|
|||
}
|
||||
|
||||
.tags {
|
||||
@extend .clearfix;
|
||||
@include clearfix;
|
||||
margin-bottom: 20px;
|
||||
font-size: .75rem;
|
||||
line-height: 1;
|
||||
@include color(color, contrast-text);
|
||||
.tags-list {
|
||||
&-list {
|
||||
list-style: none;
|
||||
.tag-item {
|
||||
}
|
||||
&-item {
|
||||
@include btn;
|
||||
float: left;
|
||||
margin: 0 6px 6px 0;
|
||||
text-transform: uppercase;
|
||||
@include color(background, contrast-background);
|
||||
&:hover {
|
||||
@include color(background, main-color);
|
||||
}
|
||||
.tag-link {
|
||||
@extend .btn;
|
||||
display: block;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
@extend .clearfix;
|
||||
@include clearfix;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
font-size: .75rem;
|
||||
|
|
@ -597,7 +595,7 @@ select {
|
|||
@include color(background, main-color);
|
||||
}
|
||||
.action-link {
|
||||
@extend .btn;
|
||||
@include btn;
|
||||
display: block;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
|
@ -615,7 +613,7 @@ select {
|
|||
/* Authorbox */
|
||||
.authorbox {
|
||||
@include subarticle-element;
|
||||
@extend .clearfix;
|
||||
@include clearfix;
|
||||
line-height: 1.5;
|
||||
display: block;
|
||||
@media screen and (max-width: $break1) {
|
||||
|
|
@ -661,6 +659,7 @@ select {
|
|||
flex-grow: 1;
|
||||
}
|
||||
.action {
|
||||
@include btn;
|
||||
margin-left: 6px;
|
||||
}
|
||||
@media screen and (max-width: $break1) {
|
||||
|
|
@ -682,73 +681,55 @@ select {
|
|||
}
|
||||
}
|
||||
|
||||
.mentions {
|
||||
@include subarticle-element;
|
||||
line-height: 1.5;
|
||||
display: block;
|
||||
@media screen and (max-width: $break1) {
|
||||
text-align: center;
|
||||
}
|
||||
.caption {
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.mentions-list {
|
||||
margin-top: 5px;
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* List content */
|
||||
.list {
|
||||
.list-item {
|
||||
&-item {
|
||||
padding-bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
@include color-border(border-bottom, 1px, solid, border);
|
||||
.list-header {
|
||||
}
|
||||
&-header {
|
||||
margin-bottom: 10px;
|
||||
.list-title {
|
||||
}
|
||||
&-title {
|
||||
margin: 0;
|
||||
&:hover {
|
||||
@include color(color, main-color);
|
||||
}
|
||||
}
|
||||
.list-meta {
|
||||
@extend .meta;
|
||||
&-meta {
|
||||
@include meta;
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
.list-excerpt {
|
||||
&-excerpt {
|
||||
@extend .content;
|
||||
@extend .clearfix;
|
||||
@include clearfix;
|
||||
}
|
||||
&-footer {
|
||||
@include clearfix;
|
||||
}
|
||||
.list-footer {
|
||||
@extend .clearfix;
|
||||
.read-more {
|
||||
@extend .btn;
|
||||
@include btn;
|
||||
float: right;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
.pagination {
|
||||
margin-top: 20px;
|
||||
.item {
|
||||
&-item {
|
||||
display: inline-block;
|
||||
padding: 10px 15px;
|
||||
font-weight: 700;
|
||||
@include color(color, strong-text);
|
||||
@include color(background, light-background);
|
||||
&:hover, &--current {
|
||||
}
|
||||
&-item:hover, .current {
|
||||
@include color(color, contrast-text);
|
||||
@include color(background, main-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Post Navigation */
|
||||
.post-nav {
|
||||
|
|
@ -797,20 +778,19 @@ select {
|
|||
}
|
||||
}
|
||||
|
||||
// Related articles
|
||||
|
||||
.related {
|
||||
/* Related articles and webmentions */
|
||||
.related, .mentions {
|
||||
@include subarticle-element;
|
||||
@media screen and (max-width: $break1) {
|
||||
min-width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
.caption {
|
||||
&-caption {
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.related-list {
|
||||
&-list {
|
||||
margin-top: 5px;
|
||||
list-style: none;
|
||||
}
|
||||
|
|
@ -861,7 +841,7 @@ input {
|
|||
width: 100%;
|
||||
}
|
||||
&[type=submit], &[type=reset] {
|
||||
@extend .btn;
|
||||
@include btn;
|
||||
min-width: 100px;
|
||||
border: 0;
|
||||
text-transform: uppercase;
|
||||
|
|
@ -920,11 +900,6 @@ textarea {
|
|||
}
|
||||
}
|
||||
|
||||
/* Photo summary */
|
||||
.photosummary .image {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Lightbox */
|
||||
.lightbox {
|
||||
display: none;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="{{ .Site.LanguageCode | default "en-us" }}">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
|
|
@ -10,8 +9,7 @@
|
|||
{{ template "_internal/opengraph.html" . }}
|
||||
{{ template "_internal/schema.html" . }}
|
||||
{{ template "_internal/twitter_cards.html" . }}
|
||||
{{ $styles := resources.Get "css/style.scss" | toCSS | minify | fingerprint }}
|
||||
<link rel="stylesheet" href="{{ $styles.RelPermalink }}" integrity="{{ $styles.Data.Integrity }}">
|
||||
{{ partialCached "styles" . }}
|
||||
<link rel="shortcut icon" href="{{ .Site.Params.favicon }}">
|
||||
{{ range .AlternativeOutputFormats }}
|
||||
<link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .Permalink | safeURL }}">
|
||||
|
|
@ -23,8 +21,6 @@
|
|||
{{ end }}
|
||||
{{ partialCached "indiewebhead" . (.Param "indieweb.enabled") }}
|
||||
{{ partialCached "customhead" . }}
|
||||
</head>
|
||||
<body class="body">
|
||||
<div class="body-container">
|
||||
{{ partialCached "header" . }}
|
||||
<div class="wrapper flex">
|
||||
|
|
@ -41,5 +37,3 @@
|
|||
{{ partialCached "footer" . }}
|
||||
</div>
|
||||
{{ partialCached "custombodyend" . }}
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<article class="list-item h-entry photosummary">
|
||||
<div class="list-excerpt">
|
||||
{{ range .Params.images }}
|
||||
<p><figure><a href="#{{ . | md5 }}-lightbox"><img class="image" src="{{ . | safeURL }}"></a></figure></p>
|
||||
<p><figure><a href="#{{ . | md5 }}-lightbox"><img style="width: 100%;" src="{{ . | safeURL }}"></a></figure></p>
|
||||
<a href="#_" class="lightbox" id="{{ . | md5 }}-lightbox"><img src="{{ . | safeURL }}"></a>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -6,14 +6,12 @@
|
|||
<h1 class="p-name post-title">{{ . }}</h1>
|
||||
{{ end }}
|
||||
{{ if not .Params.nometa }}
|
||||
<div class="post-meta">
|
||||
{{ partial "post_meta" . }}
|
||||
</div>
|
||||
{{ partial "post_actions" . }}
|
||||
{{ end }}
|
||||
</header>
|
||||
{{ partial "oldcontentwarning" . }}
|
||||
<div class="e-content content clearfix">
|
||||
<div class="e-content content">
|
||||
{{ with .Params.audio }}
|
||||
<p><audio controls preload="metadata" style="width: 100%;"><source src="{{ . }}"/></audio></p>
|
||||
{{ end }}
|
||||
|
|
|
|||
|
|
@ -5,11 +5,10 @@
|
|||
{{ with $mentions }}
|
||||
<div class="mentions">
|
||||
<details>
|
||||
<summary class="caption">{{ T "interactions" }}</summary>
|
||||
<summary class="mentions-caption">{{ T "interactions" }}</summary>
|
||||
<ul class="mentions-list">
|
||||
{{ range sort . ".date" "asc" }}
|
||||
{{ $sourceUrl := urls.Parse .source }}
|
||||
<li class="item"><a href="{{ .source }}" target="_blank" rel="nofollow noopener noreferrer">{{ $sourceUrl.Host }}</a> <i>{{ dateFormat $dateFormat .date }}</i></li>
|
||||
{{ range sort . ".date" "asc" }}{{ $sourceUrl := urls.Parse .source }}
|
||||
<li><a href="{{ .source }}" target="_blank" rel="nofollow noopener noreferrer">{{ $sourceUrl.Host }}</a> <i>{{ dateFormat $dateFormat .date }}</i></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</details>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
{{ if or (.Paginator.HasPrev) (.Paginator.HasNext) }}
|
||||
<div class="pagination">
|
||||
{{- with .Paginator.Prev }}
|
||||
<a class="item btn" href="{{ .URL }}">{{ .PageNumber }}</a>
|
||||
<a class="pagination-item" href="{{ .URL }}">{{ .PageNumber }}</a>
|
||||
{{- end }}
|
||||
<span class="item item--current">{{ .Paginator.PageNumber }}/{{ .Paginator.TotalPages }}</span>
|
||||
<span class="pagination-item current">{{ .Paginator.PageNumber }}/{{ .Paginator.TotalPages }}</span>
|
||||
{{- with .Paginator.Next }}
|
||||
<a class="item btn" href="{{ .URL }}">{{ .PageNumber }}</a>
|
||||
<a class="pagination-item" href="{{ .URL }}">{{ .PageNumber }}</a>
|
||||
{{- end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
|
@ -1,3 +1,4 @@
|
|||
<div class="post-meta">
|
||||
{{ if not .Date.IsZero }}
|
||||
<div class="item">
|
||||
<span><time class="dt-published" datetime="{{.Date.Format "2006-01-02T15:04:05Z07:00"}}">{{.Date.Format ( .Site.Params.dateformat | default "January 02, 2006")}}</time>{{ if not (eq .FirstSection.RelPermalink .RelPermalink) }} in <a href="{{ .FirstSection.RelPermalink }}">{{ .FirstSection.Title }}</a>{{ end }}</span>
|
||||
|
|
@ -38,3 +39,4 @@
|
|||
{{ i18n "translations" }}: {{ $delimiter := "" }}{{ range .Translations }}{{ $delimiter }}<a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>{{ $delimiter = ", " }}{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
|
@ -3,14 +3,14 @@
|
|||
{{ with (.GetTerms "series") }}
|
||||
<ul class="tags-list">
|
||||
{{ range sort . "Pages" "desc" }}
|
||||
<li class="tag-item"><div class="tag-link"><a class="p-category" href="{{ .RelPermalink }}" rel="tag">{{ .Title }}</a><sup>{{ len .Pages }}</sup></div></li>
|
||||
<li class="tags-item"><a class="p-category" href="{{ .RelPermalink }}" rel="tag">{{ .Title }}</a><sup>{{ len .Pages }}</sup></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
{{ with (.GetTerms "tags") }}
|
||||
<ul class="tags-list">
|
||||
{{ range sort . "Pages" "desc" }}
|
||||
<li class="tag-item"><div class="tag-link"><a class="p-category" href="{{ .RelPermalink }}" rel="tag">{{ .Title }}</a><sup>{{ len .Pages }}</sup></div></li>
|
||||
<li class="tags-item"><a class="p-category" href="{{ .RelPermalink }}" rel="tag">{{ .Title }}</a><sup>{{ len .Pages }}</sup></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
|
|
|
|||
|
|
@ -2,12 +2,10 @@
|
|||
{{ with $related }}
|
||||
<div class="related">
|
||||
<details>
|
||||
<summary class="caption">{{ T "related" }}</summary>
|
||||
<summary class="related-caption">{{ T "related" }}</summary>
|
||||
<ul class="related-list">
|
||||
{{ range . }}
|
||||
<li class="item">
|
||||
<a class="link" href="{{ .RelPermalink }}">{{ with .Title }}{{ . }}{{ else }}{{ .Summary | truncate 60 }}{{ end }}</a> <i>{{.Date.Format ( .Site.Params.dateformat | default "January 02, 2006")}}</i>
|
||||
</li>
|
||||
<li><a href="{{ .RelPermalink }}">{{ with .Title }}{{ . }}{{ else }}{{ .Summary | truncate 60 }}{{ end }}</a> <i>{{.Date.Format ( .Site.Params.dateformat | default "January 02, 2006")}}</i></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</details>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,6 @@
|
|||
{{ $styles := resources.Get "css/style.scss" | toCSS | minify | fingerprint }}
|
||||
{{ if .Site.Params.inlinecss }}
|
||||
<style>{{ $styles.Content | safeCSS }}</style>
|
||||
{{ else }}
|
||||
<link rel="stylesheet" href="{{ $styles.RelPermalink }}" integrity="{{ $styles.Data.Integrity }}">
|
||||
{{ end }}
|
||||
|
|
@ -5,7 +5,7 @@
|
|||
<form id="wm-form" method="post" action="{{ .Param "indieweb.endpoints.webmention" }}">
|
||||
<input type="url" name="source" id="wm-source" placeholder="{{ T "wmform_label" }}">
|
||||
<input type="hidden" name="target" value="{{ .Permalink }}">
|
||||
<input class="btn action" type="submit" value="{{ T "wmform_btn" }}">
|
||||
<input class="action" type="submit" value="{{ T "wmform_btn" }}">
|
||||
</form>
|
||||
<p id="anon-comment"><a href="https://quill.p3k.io/?dontask=1&me=https://commentpara.de&reply={{ .Permalink }}">{{ T "anon_comment" }}</a></p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<div class="tags">
|
||||
<ul class="tags-list">
|
||||
{{ range (.Paginate ( .Pages.ByTitle ) 100).Pages }}
|
||||
<li class="tag-item"><div class="tag-link"><a href="{{ .RelPermalink }}">{{ .Title }}</a><sup>{{ len .Pages }}</sup></div></li>
|
||||
<li class="tags-item"><a class="p-category" href="{{ .RelPermalink }}">{{ .Title }}</a><sup>{{ len .Pages }}</sup></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
|||
Reference in New Issue