github
/
hugo-geekdoc
mirror of https://github.com/thegeeklab/hugo-geekdoc.git
0
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: add origin size to image shortcode (#490)

This commit is contained in:
Robert Kaussow 2022-09-02 10:58:44 +02:00 committed by GitHub
parent 2e1098d3e3
commit b9876a8640
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
exampleSite/content/en/shortcodes/images/_index.md
View File

@ -43,12 +43,12 @@ If you need more flexibility for your embedded images, you could use the `img` s
## Attributes
| Name | Description | default |
| ---- | ------------------------------------------------------- | ----------------- |
| name | name of the image resource defined in your front matter | empty |
| alt | description for displayed image | resource `.Title` |
| size | Thumbnail size (profile\|tiny\|small\|medium\|large) | empty |
| lazy | enable or disable image lazy loading | true |
| Name | Description | default |
| ---- | ------------------------------------------------------------ | ----------------- |
| name | name of the image resource defined in your front matter | empty |
| alt | description for displayed image | resource `.Title` |
| size | Thumbnail size (origin\|profile\|tiny\|small\|medium\|large) | empty |
| lazy | enable or disable image lazy loading | true |
## Usage

11
layouts/shortcodes/img.html
View File

@ -6,18 +6,19 @@
{{- with $source }}
{{- $caption := default .Title $customAlt }}
{{- $origin := .Permalink }}
{{- $profile := (.Fill "180x180 Center").Permalink }}
{{- $tiny := (.Resize "320x").Permalink }}
{{- $small := (.Resize "600x").Permalink }}
{{- $medium := (.Resize "1200x").Permalink }}
{{- $large := (.Resize "1800x").Permalink }}
{{- $size := dict "profile" $profile "tiny" $tiny "small" $small "medium" $medium "large" $large }}
{{- $size := dict "origin" $origin "profile" $profile "tiny" $tiny "small" $small "medium" $medium "large" $large }}
<div class="flex justify-center">
<figure
class="gdoc-post__figure
class="gdoc-markdown__figure
{{- if eq $customSize "profile" }}{{ print " gdoc-post__figure--round" }}{{ end }}"
>
<a class="gdoc-markdown__link--raw" href="{{ .Permalink }}">
@ -31,7 +32,11 @@
/>
<img
{{- if $lazyLoad }}{{ print " loading=\"lazy\"" | safeHTMLAttr }}{{- end }}
src="{{ $size.large }}"
{{- if eq $customSize "origin" }}
src="{{ $size.origin }}"
{{- else }}
src="{{ $size.large }}"
{{- end }}
alt="{{ $caption }}"
/>
</picture>