marcel
/
congo
mirror of https://github.com/jpanther/congo.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

LQIP prototype

stereobooster 2023-09-11 10:07:09 +02:00
parent 22e1f1727e
commit bfae27980f
2 changed files with 12 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
exampleSite/content/samples/markdown/index.md
View File

@ -9,6 +9,10 @@ This article offers a sample of basic Markdown formatting that can be used in Co
<!--more--> <!--more-->
## Image
![sample image](thumb-surendran-mp-IhWYiwSxm8g-unsplash.jpg)
## Headings ## Headings
The following HTML `<h1>`—`<h6>` elements represent six levels of section headings. `<h1>` is the highest section level while `<h6>` is the lowest. The following HTML `<h1>`—`<h6>` elements represent six levels of section headings. `<h1>` is the highest section level while `<h6>` is the lowest.

8
layouts/_default/_markup/render-image.html
View File

@ -23,6 +23,11 @@
{{ end }} {{ end }}
{{ with $resource }} {{ with $resource }}
<figure> <figure>
{{ if ne .MediaType.SubType "svg" }}
{{ $lqip := .Resize "20x webp" }}
<div class="mx-auto my-0 rounded-md"
style="background: url(data:image/webp;base64,{{ $lqip.Content | base64Encode }}); background-size: cover">
{{ end }}
<img <img
class="mx-auto my-0 rounded-md" class="mx-auto my-0 rounded-md"
{{ if eq .MediaType.SubType "svg" }} {{ if eq .MediaType.SubType "svg" }}
@ -46,6 +51,9 @@
loading="lazy" loading="lazy"
{{ end }} {{ end }}
/> />
{{ if ne .MediaType.SubType "svg" }}
</div>
{{ end }}
{{ with $caption }}<figcaption class="text-center">{{ . | markdownify }}</figcaption>{{ end }} {{ with $caption }}<figcaption class="text-center">{{ . | markdownify }}</figcaption>{{ end }}
</figure> </figure>
{{ else }} {{ else }}