ettore.dreucci/cocoa-eh-hugo-theme
1
0
Fork 0
mirror of https://github.com/Noettore/cocoa-eh-hugo-theme.git synced 2025-10-15 11:46:41 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add choice for progressive images

Browse Source
This commit is contained in:
Alexis Tacnet
2017-02-07 01:38:05 +01:00
parent 7833a7ddaa
commit 647d2fad5c
5 changed files with 23 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
layouts/_default/single.html
View File

@@ -4,7 +4,11 @@
<div class="content"> <div class="content">
{{ partial "page-heading.html" . }} {{ partial "page-heading.html" . }}
<div class="markdown"> <div class="markdown">
{{ .Content }} {{ if .Site.Params.progressively }}
{{ .Content | replaceRE "<img src=(.*)\\/(.*) alt=(.*)>" "<figure class=\"progressive\"><img class=\"progressive__img progressive--not-loaded\" data-progressive=$1/high/$2 src=$1/low/$2 alt=$3></figure>" | safeHTML }}
{{ else }}
{{ .Content }}
{{ end }}
</div> </div>
</div> </div>
</div> </div>

6
layouts/blog/single.html
View File

@@ -13,7 +13,11 @@
</div> </div>
</div> </div>
<div class="markdown"> <div class="markdown">
{{ .Content | replaceRE "<img src=(.*)\\/(.*) alt=(.*)>" "<figure class=\"progressive\"><img class=\"progressive__img progressive--not-loaded\" data-progressive=$1/high/$2 src=$1/low/$2 alt=$3></figure>" | safeHTML }} {{ if .Site.Params.progressively }}
{{ .Content | replaceRE "<img src=(.*)\\/(.*) alt=(.*)>" "<figure class=\"progressive\"><img class=\"progressive__img progressive--not-loaded\" data-progressive=$1/high/$2 src=$1/low/$2 alt=$3></figure>" | safeHTML }}
{{ else }}
{{ .Content }}
{{ end }}
<br> <br>
<p><a href="{{ .Section }}">Back to posts</a></p> <p><a href="{{ .Section }}">Back to posts</a></p>
</div> </div>

8
layouts/partials/footer_scripts.html
View File

@@ -9,7 +9,9 @@
</script> </script>
{{ end }} {{ end }}
<script src="{{ .Site.BaseURL }}js/progressively.min.js"></script> {{ if .Site.Params.progressively }}
<script> <script src="{{ .Site.BaseURL }}js/progressively.min.js"></script>
<script>
progressively.init({delay: 50, throttle: 300}); progressively.init({delay: 50, throttle: 300});
</script> </script>
{{ end }}

4
layouts/partials/head_includes.html
View File

@@ -7,7 +7,9 @@
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/reset.css"> <link rel="stylesheet" href="{{ .Site.BaseURL }}css/reset.css">
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/main.css"> <link rel="stylesheet" href="{{ .Site.BaseURL }}css/main.css">
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/progressively.min.css"> {{ if .Site.Params.progressively }}
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/progressively.min.css">
{{ end }}
{{range .Site.Params.extracssfiles}} {{range .Site.Params.extracssfiles}}
<link rel="stylesheet" href="{{.}}"> <link rel="stylesheet" href="{{.}}">

8
static/css/main.css
View File

@@ -583,9 +583,6 @@ a {
a:hover { a:hover {
color: #2a6496; color: #2a6496;
} }
img {
max-width: 100%;
}
img.profile { img.profile {
min-width: 100%; min-width: 100%;
} }
@@ -747,6 +744,7 @@ section.main .content .markdown figure {
section.main .content .markdown figure img { section.main .content .markdown figure img {
height: 100%; height: 100%;
width: auto; width: auto;
max-width: 100%;
display: block; display: block;
position: static; position: static;
margin: auto; margin: auto;
@@ -772,6 +770,10 @@ section.main .content .markdown figure img {
width: 110%; width: 110%;
margin-left: -5%; margin-left: -5%;
} }
section.main .content .markdown img {
width: 110%;
margin-left: -5%;
}
} }
section.main .content .markdown table { section.main .content .markdown table {
margin-bottom: 1rem; margin-bottom: 1rem;