**ActionButton** A lightweight and special type of button/link with icon-first styling, sized presets, and colorized text/icon support.
**Basic**:
Create account
Disabled
AriaLabel="Call"
No Icon
**IconPosition**:
Start (default)
End
**Href**:
Open bitplatform.dev in a new tab
Go to bitplatform GitHub
**Rel**:
Open bitplatform.dev with a rel attribute (nofollow)
Open bitplatform.dev with a rel attribute (nofollow & noreferrer)
**Rich content**:
**ButtonType**:
@if (formIsValidSubmit is false)
{
Submit
Reset
Button
}
else
{
The form submitted successfully.
}
public class ButtonValidationModel
{
[Required]
public string RequiredText { get; set; } = string.Empty;
public string? NonRequiredText { get; set; }
}
private bool formIsValidSubmit;
private ButtonValidationModel buttonValidationModel = new();
private async Task HandleValidSubmit()
{
formIsValidSubmit = true;
await Task.Delay(2000);
buttonValidationModel = new();
formIsValidSubmit = false;
StateHasChanged();
}
private void HandleInvalidSubmit()
{
formIsValidSubmit = false;
}
**FullWidth**:
FullWidth
FullWidth with end icon
**Loading**:
Save changes
Upload file
Send message
private bool isLoading;
**LoadingTemplate**:
Download
Downloading...
private bool templateIsLoading;
**Underlined**:
Link style
Open GitHub
More info
**Color**:
Primary
Primary
Secondary
Secondary
Tertiary
Tertiary
Info
Info
Success
Success
Warning
Warning
SevereWarning
SevereWarning
Error
Error
PrimaryBackground
PrimaryBackground
SecondaryBackground
SecondaryBackground
TertiaryBackground
TertiaryBackground
PrimaryForeground
PrimaryForeground
SecondaryForeground
SecondaryForeground
TertiaryForeground
TertiaryForeground
PrimaryBorder
PrimaryBorder
SecondaryBorder
SecondaryBorder
TertiaryBorder
TertiaryBorder
**External Icons**:
House (Icon=@@("fa-solid fa-house"))
Heart (Icon="@@BitIconInfo.Css("fa-solid fa-heart")")
GitHub (Icon="@@BitIconInfo.Fa("fa-brands fa-github")")
Rocket (Icon="@@BitIconInfo.Fa("solid rocket")")
House (Icon=@@("bi bi-house-fill"))
Heart (Icon="@@BitIconInfo.Css("bi bi-heart-fill")")
GitHub (Icon="@@BitIconInfo.Bi("github")")
Gear (Icon="@@BitIconInfo.Bi("gear-fill")")
**Size**:
Small
Medium
Large
**Style & Class**:
Action Button Styles
Action Button Classes (Hover me)
**RTL**:
ساخت حساب
This is a custom template