Storehouse.Components (Storehouse v0.2.0)

Copy Markdown View Source

Function components for HEEx, from Storehouse.Responsive's data.

import Storehouse.Components

<.img file={@photo.image} preset={:photo} sizes="(min-width: 60rem) 60rem, 100vw" alt={@photo.caption} />

Summary

Functions

An <img> of file with preset's sizes (Storehouse.Responsive.resolve/3): its src, srcset, sizes, width and height, and its placeholder and colour painted under it while it loads, when its analysis has them.

Functions

img(assigns)

An <img> of file with preset's sizes (Storehouse.Responsive.resolve/3): its src, srcset, sizes, width and height, and its placeholder and colour painted under it while it loads, when its analysis has them.

Attributes

  • file (Storehouse.File) (required)
  • preset (:atom) (required)
  • sizes (:string) - the layout's slot for it, at each screen's width. Defaults to nil.
  • src (:integer) - the width of src, for a browser without srcset. Defaults to nil.
  • placeholder (:boolean) - paint the placeholder and colour under it while it loads. Defaults to true.
  • options (:list) - Storehouse.Variants.url/3's. Defaults to [].
  • Global attributes are accepted. Supports all globals plus: ["alt", "loading", "decoding", "fetchpriority", "crossorigin", "referrerpolicy"].