poshud/pages/button.ps1
|
New-UDPage -Name "Button" -Icon plus_circle -Content { New-UDRow -Columns { New-UDColumn -Size 2 -Content {} New-UDColumn -Size 10 -Content { New-UDHeading -Size 1 -Text "Buttons" -Color $Colors.FontColor New-UDParagraph -Content { "There are 3 main button types described in material design. The raised button is a standard button that signify actions and seek to give depth to a mostly flat page. The floating circular action button is meant for very important functions. Flat buttons are usually used within elements that already have depth like cards or modals." } -Color $Colors.FontColor New-UDHeading -Size 3 -Text "Raised" -Color $Colors.FontColor New-UDElementExample -Example { New-UDButton -Text "Button" New-UDButton -Text "Button" -Icon cloud -IconAlignment left New-UDButton -Text "Button" -Icon cloud -IconAlignment right } New-UDHeading -Size 3 -Text "Floating" -Color $Colors.FontColor New-UDElementExample -Example { New-UDButton -Floating -Icon plus } New-UDHeading -Size 3 -Text "Flat" -Color $Colors.FontColor New-UDParagraph -Content { "Flat buttons are used to reduce excessive layering. For example, flat buttons are usually used for actions within a card or modal so there aren't too many overlapping shadows." } -Color $Colors.FontColor New-UDElementExample -Example { New-UDButton -Text "Button" -Flat } New-UDHeading -Size 3 -Text "OnClick Event" -Color $Colors.FontColor New-UDParagraph -Content { "Tie ScriptBlocks to an OnClick event." } -Color $Colors.FontColor New-UDElementExample -Example { New-UDHeading -Size 5 -Id "ShowOnClick" -Text "" New-UDButton -Text "Button" -OnClick { Set-UDElement -Id "ShowOnClick" -Content { "You clicked the button!" } } } } } } |