Skip to content

wiz-custom-foto

The wiz-custom-foto component is designed to display an image with various style and content options. Its primary use case is to dynamically show employee-specific photos or fallback to a default image when no specific photo is available. It also includes options for styling and contextual enhancements, making it suitable for modular approach.

With this component, you can do the following:

  • Display any image be specifying its file path or fallback to a default image
  • Style the image and its enclosing container with customizable properties like dimensions, background color, and additional CSS.
  • Dynamically generate the image source based on external employee_name parameters

Usage

Markup:

vue
<wiz-custom-foto></wiz-custom-foto>

Properties


The following properties are available:
PropertyTypeDefault valueDescription
altstringN/AThe text displayed in the email if the photo fails to load.
backgroundstringrgba(204, 204, 0, 28)Background color of the image container. Allowed: HEX, RGB, RGBA.
cssobjectDefault styling object: "width"="auto", "height"="auto", "max-width"="100%", "margin-bottom"="-4px".Inline CSS properties for additional styling.
heightstringautohe height of the image in pixels. "auto" allowed.
linkstringN/AA target URL the photo redirects to (optional).
srcstringN/AA URL or file path to the image.
widthstringautoThe width of the image in pixels. "auto" allowed.