Login to follow
SegoeFluentIcons

SegoeFluentIcons (ODC)

Stable version 1.0.0 (Compatible with ODC)
Uploaded on 31 July 2024 by INETUM
SegoeFluentIcons

SegoeFluentIcons (ODC)

Documentation
1.0.0

To display an Icon on a reactive web or mobile app page, simply drag and drop the SFIcon block to the desired location, and set the following input parameters:

  • SegoeFluentIconName - double-click to choose from a list of 1403 available icons (defaults to Flag)
  • SegoeFluentIconSize - select the icon size to display, from the available options 1x, 2x, 3x, 4x, 5x, 6x, 7x, 8x, 9x, 10x (defaults to 1x)
  • SegoeFluentIconRotate - rotation to apply to the icon, from the available options 90, 180, 270 degrees (defaults to NullIdentifier(), aka no rotation)
  • SegoeFluentIconFlip - flip mode for the displayed icon, from the available options Horizontal, Vertical, Both (defaults to Nullidentifier(), aka no flip)
  • ExtendedClass - aditional CSS classes to apply to the displayed icon

To display a stacked Icon on a reactive web or mobile app page, simply drag and drop the SFStackedIcon block to the desired location, and set the following input parameters:

  • OuterIconName - double-click to choose from a list of 1403 available icons (defaults to StatusCircleBlock)
  • OuterIconExtendedClass - aditional CSS classes to apply to the outer displayed icon
  • InnerIconName - double-click to choose from a list of 1403 available icons (defaults to Microphone)
  • InnerIconExtendedClass - aditional CSS classes to apply to the inner displayed icon
  • SegoeFluentIconSize - select the icon size to display, from the available options 1x, 2x, 3x, 4x, 5x, 6x, 7x, 8x, 9x, 10x (defaults to 1x)
  • SegoeFluentIconRotate - rotation to apply to the icon, from the available options 90, 180, 270 degrees (defaults to NullIdentifier(), aka no rotation)
  • SegoeFluentIconFlip - flip mode for the displayed icon, from the available options Horizontal, Vertical, Both (defaults to Nullidentifier(), aka no flip)

The Demo allows you to play with the options, and see them in action.