Skip to content
Türkçe
All snippets

Disabled button

A button that fades and greys out through disabled: utilities.

  • WDiv
  • WText
  • WButton
preview
button_disabled_state.dart 
WDiv(
  className: 'flex flex-col gap-2 items-center',
  children: [
    const WText(
      'Disabled State',
      className: 'text-sm text-gray-600',
    ),
    WButton(
      onTap: () {},
      disabled: true,
      className: '''
        bg-blue-600 disabled:bg-gray-400 disabled:opacity-50
        text-white px-6 py-3 rounded-lg font-medium
      ''',
      child: const Text('Disabled Button'),
    ),
  ],
)
18 lines Open in the playground From the docs: WButton

More like this

  • Featured

    Validated email field

    A form input with a validator, a focus ring and an error: border.

    • WFormInput

  • Button variants

    One recipe with two intents and two sizes, resolved from a map of classNames.

    • WindRecipe

  • Hover transition

    A primary button that darkens and lifts its shadow over 200 milliseconds.

    • WAnchor
    • WDiv
    • WText