attemptsPill method

Widget attemptsPill(
  1. int remaining,
  2. int max
)

"N of M attempts remaining" pill. Colour escalates as the number drops, matching the expiry bar's urgency language.

Implementation

Widget attemptsPill(int remaining, int max) {
  final Color bg;
  final Color fg;
  if (remaining <= 0) {
    bg = const Color(0xFFFDE8E8);
    fg = progressRed;
  } else if (remaining <= (max / 2).ceil()) {
    bg = const Color(0xFFFFF4E0);
    fg = const Color(0xFFB8790A);
  } else {
    bg = const Color(0xFFEEF4FF);
    fg = progressBlue;
  }
  return Container(
    padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 3),
    decoration: BoxDecoration(
      color: bg,
      borderRadius: BorderRadius.circular(999),
    ),
    child: Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        Container(
          width: 6,
          height: 6,
          decoration: BoxDecoration(shape: BoxShape.circle, color: fg),
        ),
        const SizedBox(width: 6),
        Text(
          remaining <= 0
              ? 'No attempts remaining'
              : '$remaining of $max attempts remaining',
          style: TextStyle(
            fontFamily: fontFamily,
            fontSize: 11,
            fontWeight: FontWeight.w600,
            color: fg,
          ),
        ),
      ],
    ),
  );
}