Skip to content

Latest commit

 

History

History
115 lines (78 loc) · 2.72 KB

icon.md

File metadata and controls

115 lines (78 loc) · 2.72 KB
description
Icon component for Universal Apps

Icon

FontAwesome icons to include in your app. Icon names are slightly different than those shown on the FontAwesome website. For example, if you want to use the network-wired icon, you would use the following string. 

New-UDIcon -Icon 'NetworkWired'

Finding an Icon

We include FontAwesome v6 with PowerShell Universal. You can use Find-UDIcon to search through the list of included icons. 

Find-UDIcon User

{% hint style="warning" %} The UniversalDashboard.FontAwesomeIcons enum should not be used and is only included for backwards compatibility. Many of the icons are no longer a part of FontAwesome 6. {% endhint %}

Icon

Create icons by specifying their names. You can use the icon reference below to find icons.

New-UDIcon -Icon 'AddressBook'

Size

Set the size of the icon. Valid values are: xs, sm, lg, 2x, 3x, 4x, 5x, 6x, 7x, 8x, 9x, 10x

    New-UDIcon -Icon 'AddressBook' -Size 'sm'
    New-UDIcon -Icon 'AddressBook' -Size 'lg'
    New-UDIcon -Icon 'AddressBook' -Size '5x'
    New-UDIcon -Icon 'AddressBook' -Size '10x'

Rotation

Rotate icons. The value represents the degrees of rotation.

New-UDIcon -Icon 'AddressBook' -Size '5x' -Rotation 90

Border

Add a border to your icon.

New-UDIcon -Icon 'AddressBook' -Size '5x' -Border

Style

Apply CSS styles to your icon.

New-UDIcon -Icon 'AddressBook' -Size '5x' -Style @{
    backgroundColor = "red"
}

Visually Search for Icons

New-UDTextbox -Id 'txtIconSearch' -Label 'Search' 
New-UDButton -Text 'Search' -OnClick {
    Sync-UDElement -Id 'icons'
}

New-UDElement -tag 'p' -Content {}

New-UDDynamic -Id 'icons' -Content {
    $IconSearch = (Get-UDElement -Id 'txtIconSearch').value
    if ($null -ne $IconSearch -and $IconSearch -ne '')
    {
        $Icons =$Icons = Find-UDIcon -Name $IconSearch
    }

    foreach($icon in $icons) {
        try{
            New-UDChip -Label $icon -Icon (New-UDIcon -Icon $icon)
        }
        catch{
            New-UDChip -Label "$icon Unknown" 
        }
    }
}

Complete Icon List

Click here to view the complete icon list.

API

New-UDIcon