Feedback / Rating

A feedback form with star rating and optional comments.

Card
Rating
Textarea
Button

Preview

How was your experience?

Your feedback helps us improve.

Code

<BbCard class="w-full max-w-md">
    <BbCardHeader class="text-center">
        <div class="flex justify-center mb-2">
            <!-- icon SVG -->
        </div>
        <BbCardTitle class="text-2xl">How was your experience?</BbCardTitle>
        <BbCardDescription>Your feedback helps us improve.</BbCardDescription>
    </BbCardHeader>
    <BbCardContent>
        <div class="space-y-4">
            <div class="space-y-2">
                <BbLabel>Overall Rating</BbLabel>
                <BbRating @bind-Value="rating" Max="5" />
            </div>
            <BbSeparator />
            <div class="space-y-2">
                <BbLabel For="comments">Comments (optional)</BbLabel>
                <BbTextarea Id="comments" Rows="4" Placeholder="Share your thoughts..." />
            </div>
        </div>
    </BbCardContent>
    <BbCardFooter>
        <BbButton Class="w-full">Submit Feedback</BbButton>
    </BbCardFooter>
</BbCard>

@code {
    private int rating = 0;
}