Avatar
Fallbacks and sizes
AMJLRC
open System
open FSharp.ViewEngine
open Acme.Components.Primitives
open Acme.Components.Application
open type Html
open type Svg
open type Datastar
let avatarFallbackExample =
div {
_class "flex flex-wrap items-center gap-4"
Avatar.create "Alex Morgan" "AM" |> Avatar.small |> Avatar.render
Avatar.create "Jamie Lee" "JL" |> Avatar.render
Avatar.create "Riley Chen" "RC" |> Avatar.large |> Avatar.render
}Image

open System
open FSharp.ViewEngine
open Acme.Components.Primitives
open Acme.Components.Application
open type Html
open type Svg
open type Datastar
let avatarImageExample =
Avatar.create "FSharp.ViewEngine" "FV"
|> Avatar.withImage "/android-chrome-512x512.png"
|> Avatar.large
|> Avatar.renderDecorative
AM
open System
open FSharp.ViewEngine
open Acme.Components.Primitives
open Acme.Components.Application
open type Html
open type Svg
open type Datastar
let decorativeAvatarExample =
Avatar.create "Decorative account mark" "AM"
|> Avatar.decorative
|> Avatar.render