From 2aa5a83686880e947a6614a42f93550d96b1f87f Mon Sep 17 00:00:00 2001 From: Jieiku Date: Sun, 2 Feb 2025 21:30:23 -0800 Subject: Add and Update Translations --- content/overview-images/index.md | 31 ++++++++++++++++++++++++++++--- 1 file changed, 28 insertions(+), 3 deletions(-) (limited to 'content/overview-images/index.md') diff --git a/content/overview-images/index.md b/content/overview-images/index.md index 05c45e5..c3cfd03 100644 --- a/content/overview-images/index.md +++ b/content/overview-images/index.md @@ -38,44 +38,57 @@ Optional Classes: - fl can be used to float the image left. - b1 can be used to add a 1px border. -** google lighthouse recommends setting alt, w, and h attributes. If alt is omitted then the filename is used. If w or h are omitted then get_image_metadata() fills these values. ** +*google lighthouse recommends setting alt, w, and h attributes. If alt is omitted then the filename is used. If w or h are omitted then get_image_metadata() fills these values.* ## Usage (same path) + ```rs {{/* img(src="ferris-happy.svg" class="ci b1" alt="Ferris is Happy" caption="Ferris" link="https://www.rust-lang.org/") */}} ``` + **Output** + ```html {{ img(src="ferris-happy.svg" class="ci b1" alt="Ferris is Happy" caption="Ferris" link="https://www.rust-lang.org/") }} ``` + {{ img(src="ferris-happy.svg" class="ci b1" alt="Ferris is Happy" caption="Ferris" link="https://www.rust-lang.org/") }} ## Usage (relative path ./) + ```rs {{/* img(src="./img/ferris-gesture.svg" alt="Ferris says Hello" caption="Ferris" link="https://www.rust-lang.org/") */}} ``` + **Output** + ```html {{ img(src="./img/ferris-gesture.svg" alt="Ferris says Hello" caption="Ferris" link="https://www.rust-lang.org/") }} ``` + {{ img(src="./img/ferris-gesture.svg" alt="Ferris says Hello" caption="Ferris" link="https://www.rust-lang.org/") }} ## Usage (root path /) + ```rs {{/* img(src="/images/ferris.svg" alt="Ferris the Rustacean") */}} ``` + **Output** + ```html {{ img(src="/images/ferris.svg" alt="Ferris the Rustacean") }} ``` + {{ img(src="/images/ferris.svg" alt="Ferris the Rustacean") }} # SVG image directly in code + ```html ``` - + # imgswap Shortcode @@ -92,34 +105,46 @@ When you hover your mouse over the image it will display the image to compare. - w is the width of the image. - h is the height of the image. -** google lighthouse recommends setting alt, w, and h attributes. If alt is omitted then the filename is used. If w or h are omitted then get_image_metadata() fills these values. ** +*google lighthouse recommends setting alt, w, and h attributes. If alt is omitted then the filename is used. If w or h are omitted then get_image_metadata() fills these values.* ## Usage (same path) + ```rs {{/* imgswap(main_src="ferris.svg" swap_src="ferris-happy.svg") */}} ``` + **Output** + ```html {{ imgswap(main_src="ferris.svg" swap_src="ferris-happy.svg") }} ``` + {{ imgswap(main_src="ferris.svg" swap_src="ferris-happy.svg") }} ## Usage (relative path ./) + ```rs {{/* imgswap(main_src="./img/ferris.svg" swap_src="./img/ferris-gesture.svg") */}} ``` + **Output** + ```html {{ imgswap(main_src="./img/ferris.svg" swap_src="./img/ferris-gesture.svg") }} ``` + {{ imgswap(main_src="./img/ferris.svg" swap_src="./img/ferris-gesture.svg") }} ## Usage (root path /) + ```rs {{/* imgswap(main_src="/images/ferris.svg" swap_src="/images/ferris-gesture.svg") */}} ``` + **Output** + ```html {{ imgswap(main_src="/images/ferris.svg" swap_src="/images/ferris-gesture.svg") }} ``` + {{ imgswap(main_src="/images/ferris.svg" swap_src="/images/ferris-gesture.svg") }} -- cgit v1.3.1