View Source Shino.UI.AspectRatio (shino v0.1.1-alpha.0)

Provides aspect ratio related components.

Displays content within a desired ratio.

References

Summary

Functions

Renders a div with fixed ratio.

Functions

Renders a div with fixed ratio.

Examples

<.aspect_ratio ratio={16 / 9}>
  <img
     class="w-full h-full"
     src="https://images.unsplash.com/photo-1535025183041-0991a977e25b?w=300&dpr=2&q=80"
     alt="Landscape photograph by Tobias Tullius"
  />
</.aspect_ratio>

Attributes

  • ratio (:float) (required)
  • style (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)