Link

Overview

A Link module can be used for adding clickable images with embedded links.

Link Properties

Link URL (required) String, url Sets the url embedded into the Link module.

Link Text String Defines text to be added after the image. The Link Text will also include the embedded Link URL.

Link Description (ARIA) String Sets an ARIA text description for accessibility readers.

Is Link External? Checkbox, default disabled This property should be checked off if an external url (not hosted on lcdbackstage.com) is being linked.

Style Properties

Font Size String Sets the font size of the Link. Example: 6px or 1em

Font Family String - Arial Sets the font for the Link Text to the specified font-family name or generic family name

Link Text Color String - Valid color string (white) or hex code (#FFFFF) Overrides the default color of the Link Text.

Link Text Decoration String, css property Sets the appearance of decorative lines on the Link Text. This property accepts values for the following style properties: text-decoration-line, text-decoration-color, text-decoration-style, and text-decoration-thickness.

Active Style Override String, css property If defined, overrides the default appearance of decorative lines on the Link Text when the Link is actively being clicked. Accepts the same values as Link Text Decoration.

Focus Style Override String, css property If defined, overrides the default appearance of decorative lines on the Link Text when the Link has entered the :focused state; this is different from being actively clicked. Accepts the same values as Link Text Decoration.

Hover Style Override String, css property If defined, overrides the default appearance of decorative lines on the Link Text when the mouse cursor is hovering over the Link; this is different from being actively clicked. Accepts the same values as Link Text Decoration.

Link Image

URL (required) String, url Url of the asset image. This property accepts the url of the Link image.

Alt Text String Sets an Accessibility reader text description of the Link image.

Min Width String Defines the minimum width of the Link image. This property accepts lengths followed by a relative unit (em, ex, or px) or percentages. Example: 6px or 1em

Max Width String, default 100% Defines the maximum width of the Link image. This property accepts lengths followed by a relative unit (em, ex, or px) or percentages. Example: 6px or 1em

Min Height String Defines the minimum height of the Link image. This property accepts lengths followed by a relative unit (em, ex, or px) or percentages. Example: 6px or 1em

Max Height String Defines the maximum height of the Link image. This property accepts lengths followed by a relative unit (em, ex, or px) or percentages. Example: 6px or 1em

Object Fit Dropdown Image setting for container resize behavior. The following options can be used:

  • contain

  • cover

  • fill

  • none

  • scale-down

Last updated

Was this helpful?