feat: improve image shortcode

charlesrocket · Jan 26, 2024 · e7be8f8 · e7be8f8
1 parent ed56fe7
commit e7be8f8
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 13 deletions.
diff --git a/content/posts/image/index.md b/content/posts/image/index.md
@@ -12,7 +12,7 @@ csp_img = ["raw.githubusercontent.com/charlesrocket/beastie/"]
 input:
 
 ```rs
-{{/* image(src="fireball.gif", link="https://halve-z.netlify.app/", alt="Fireball", caption="8bit fireball") */}}
+{{/* image(src="/fireball.gif", link="https://halve-z.netlify.app/", alt="Fireball", caption="8bit fireball") */}}
 ```
 
 - `src`: the path/URL to the image file (mandatory)
@@ -22,10 +22,10 @@ input:
 output:
 
 ```html
-{{ image(src="fireball.gif", link="https://halve-z.netlify.app/", alt="Fireball", caption="8bit fireball") }}
+{{ image(src="/fireball.gif", link="https://halve-z.netlify.app/", alt="Fireball", caption="8bit fireball") }}
 ```
 
-{{ image(src="fireball.gif", link="https://halve-z.netlify.app/", alt="Fireball", caption="8bit fireball") }}
+{{ image(src="/fireball.gif", link="https://halve-z.netlify.app/", alt="Fireball", caption="8bit fireball") }}
 
 input:
 
@@ -44,16 +44,16 @@ output:
 input:
 
 ```rs
-{{/* image(src="fireball.gif") */}}
+{{/* image(src="yawn.gif") */}}
 ```
 
 output:
 
 ```html
-{{ image(src="fireball.gif") }}
+{{ image(src="yawn.gif") }}
 ```
 
-{{ image(src="fireball.gif") }}
+{{ image(src="yawn.gif") }}
 
 ## CSP
 

diff --git a/content/posts/image/yawn.gif b/content/posts/image/yawn.gif
diff --git a/templates/shortcodes/image.html b/templates/shortcodes/image.html
@@ -1,9 +1,7 @@
-{%- if src is starting_with("https://") %}{% set image = src %}{% else %}{% set image = get_url(path=src, cachebust=true) %}{% set meta = get_image_metadata(path=src) %}{%- endif %}
+{%- if src is starting_with("https://") %}{% set image = src %}{%- elif src is starting_with("/") %}{% set image = get_url(path=src, cachebust=true) %}{% set meta = get_image_metadata(path=src) %}{% else %}{% set file = page.path ~ src %}{% set image = get_url(path=file, cachebust=true) %}{% set meta = get_image_metadata(path=file) %}{%- endif %}
 <figure>
-  <center>
-    {%- if link %}<a href={{ link | safe }}>{%- endif %}
-      <img class="align-center page-image" src="{{ image | safe }}"{% if meta %} width="{{ meta.width }}" height="{{ meta.height }}"{% endif %}{% if alt %} alt="{{ alt | safe }}"{% endif %}/>
-    {%- if link %}</a>{%- endif %}
+  {%- if link %}<a href={{ link | safe }}>{%- endif %}
+    <img class="align-center page-image" src="{{ image | safe }}"{% if meta %} width="{{ meta.width }}" height="{{ meta.height }}"{% endif %}{% if alt %} alt="{{ alt | safe }}"{% endif %}/>
+  {%- if link %}</a>{%- endif %}
   {%- if caption %}<figcaption>{{ caption | safe }}</figcaption>{%- endif %}
-  </center>
-</figure>
+</figure>