Documentation

Kitchen Sink documentation of style: 'Delos' of skin: 'ILIAS'

Link

Description

Purpose: The Link Glyph indicates the intention of an action in an e.g. link or button, which transforms some text from or into a link.
Composition: The Link Glyph is composed out of two linked chain-pieces that ilustrate the official URL symbol.
Effect: Clicking the Link Glyph may insert or transform some text into bold one.

Context

Appears in the markdown-actions.

Rivals

Italic Glyph: should be used if the transformation should be italic.
Heading Glyph: should be used if the transformation should be a heading.
Bold Glyph: should be used if the transformation should be bold.

Rules

Accessibility

The aria-label MUST be ‘Insert Link'.

Example 1: Link

Active
Inactive
Highlighted

<?php
 
declare(strict_types=1);
 
namespace ILIAS\UI\examples\Symbol\Glyph\Link;
 
function link()
{
    global $DIC;
 
    $factory = $DIC->ui()->factory();
    $renderer = $DIC->ui()->renderer();
 
    $glyph = $factory->symbol()->glyph()->link("#");
 
    // showcase the various states of this Glyph
    $list = $factory->listing()->descriptive([
        "Active" => $glyph,
        "Inactive" => $glyph->withUnavailableAction(),
        "Highlighted" => $glyph->withHighlight()
    ]);
 
    return $renderer->render($list);
}

Relations

Parents

UIComponent
Symbol
Glyph