İçeriğe geç
English
Tüm örnekler

Buton varyantları

İki niyet ve iki boyut içeren tek bir tarif; className haritasından çözülür.

  • WindRecipe
önizleme
wind_recipe_button.dart
final button = WindRecipe(
  base: 'inline-flex items-center rounded-lg font-medium',
  variants: {
    'intent': {
      'primary': 'bg-blue-600 dark:bg-blue-500 text-white',
      'ghost':   'bg-transparent text-blue-600 dark:text-blue-400',
    },
    'size': {
      'sm': 'px-3 py-1.5 text-sm',
      'md': 'px-4 py-2 text-base',
    },
  },
  defaultVariants: {'intent': 'primary', 'size': 'md'},
);
  • Öne çıkan

    Doğrulamalı e-posta alanı

    Doğrulayıcısı, odak halkası ve error: kenarlığı olan bir form girdisi.

    • WFormInput
  • Devre dışı buton

    disabled: yardımcılarıyla soluklaşan ve grileşen bir buton.

    • WDiv
    • WText
    • WButton
  • Hover geçişi

    200 milisaniyede koyulaşan ve gölgesi yükselen bir ana buton.

    • WAnchor
    • WDiv
    • WText