SlopUI.Icons (SlopUI v0.1.0)

Copy Markdown View Source

The small set of icons the library's own chrome uses (close buttons, chevrons, status glyphs, the editor toolbar). They are Phosphor Icons in the regular weight, vendored here so the library carries no icon dependency (MIT, see priv/phosphor/LICENSE).

For your app's own icons use use SlopUI.Icons with icon sets: Phosphor in any weight, Heroicons, or a folder of your own SVGs. See SlopUI.Icons.Set.

Summary

Functions

Builds an icon/1 component for your app from one or more icon sets.

A built-in icon. Inherits currentColor; size it with CSS (defaults to 1em).

Functions

__using__(opts)

(macro)

Builds an icon/1 component for your app from one or more icon sets.

use SlopUI.Icons,
  sets: [
    phosphor: [weight: :regular, icons: ~w(house users bell)],
    hero: [icons: ~w(arrow-path)],
    app: [dir: "assets/icons", icons: :all]
  ]

See SlopUI.Icons.Set for the presets and options.

icon(assigns)

A built-in icon. Inherits currentColor; size it with CSS (defaults to 1em).

Attributes

  • name (:string) (required) - Must be one of "calendar", "logout", "ellipsis", "markdown", "maximize", "magnifier", "eye-off", "trash", "eye", "link", "mail", "check-circle", "strikethrough", "list-ol", "chart", "users", "exclamation-triangle", "image", "plus", "list-check", "credit-card", "info-circle", "heading", "chevron-right", "quote", "bold", "table", "home", "moon", "sun", "document", "x-circle", "list-ul", "upload", "minus", "menu", "x-mark", "italic", "folder", "chevron-left", "inbox", "code-block", "chevron-down", "user", "cog", "clock", "clipboard", "computer", "lock", "check", "code", or "bell".
  • class (:any) - Defaults to nil.
  • Global attributes are accepted.