Doggo Storybook 0.10.2

Image

Renders an image with an optional caption.

Read more Read less

Usage

<.image
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio={{16, 9}}
>
  <:caption>
    Spotlight on canine couture: A dog fashion show where four-legged models
    dazzle the runway with the latest in pet apparel.
  </:caption>
</.image>
Default Open in playground
A dog wearing a colorful poncho walks down a fashion show runway. 
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio={{16, 9}}
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
Caption Open in playground
A dog wearing a colorful poncho walks down a fashion show runway.
Spotlight on canine couture: A dog fashion show where four-legged models dazzle the runway with the latest in pet apparel.
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio={{16, 9}}
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
>
  <:caption>Spotlight on canine couture: A dog fashion show where four-legged models dazzle the runway with the latest in pet apparel.</:caption>
</.image>
Ratio Open in playground
A dog wearing a colorful poncho walks down a fashion show runway.
A dog wearing a colorful poncho walks down a fashion show runway.
A dog wearing a colorful poncho walks down a fashion show runway.
A dog wearing a colorful poncho walks down a fashion show runway.
A dog wearing a colorful poncho walks down a fashion show runway.
A dog wearing a colorful poncho walks down a fashion show runway.
A dog wearing a colorful poncho walks down a fashion show runway.
A dog wearing a colorful poncho walks down a fashion show runway.
A dog wearing a colorful poncho walks down a fashion show runway.
A dog wearing a colorful poncho walks down a fashion show runway. 
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio={nil}
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio="1-by-1"
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio="3-by-2"
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio="2-by-3"
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio="4-by-3"
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio="3-by-4"
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio="5-by-4"
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio="4-by-5"
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio="16-by-9"
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>
<.image
  alt="A dog wearing a colorful poncho walks down a fashion show runway."
  ratio="9-by-16"
  src="https://github.com/woylie/doggo/blob/main/assets/dog_poncho.jpg?raw=true"
/>