RuutChatTheme constructor

const RuutChatTheme({
  1. Color primaryColor = color,
})

Creates a ruut chat theme with customizable primary color. All other styling remains consistent regardless of device theme.

Implementation

const RuutChatTheme({
  Color primaryColor = color,
}) : super(
        // Fixed light theme colors
        backgroundColor: const Color(0xfff4f6fb),
        secondaryColor: Colors.white,
        inputBackgroundColor: Colors.white,
        inputTextColor: const Color(0xff1a1a1a),
        errorColor: const Color(0xffff6b6b),

        // Primary color usage
        primaryColor: primaryColor,

        // Message styling - fixed for consistency
        messageBorderRadius: 20.0,

        // Received message styling (always light background)
        receivedMessageBodyTextStyle: const TextStyle(
          color: Color(0xff1a1a1a),
          fontSize: 16,
          letterSpacing: -0.2,
          fontWeight: FontWeight.w500,
          height: 1.5,
        ),
        receivedMessageCaptionTextStyle: const TextStyle(
          color: Color(0xff666666),
          fontSize: 12,
          letterSpacing: -0.2,
          fontWeight: FontWeight.w500,
          height: 1.333,
        ),
        receivedMessageLinkTitleTextStyle: const TextStyle(
          color: Color(0xff1a1a1a),
          fontSize: 16,
          fontWeight: FontWeight.w800,
          height: 1.375,
        ),
        receivedMessageLinkDescriptionTextStyle: const TextStyle(
          color: Color(0xff666666),
          fontSize: 14,
          fontWeight: FontWeight.w400,
          height: 1.428,
        ),
        receivedMessageDocumentIconColor: primaryColor,

        // Sent message styling (uses primary color background)
        sentMessageBodyTextStyle: const TextStyle(
          color: Colors.white,
          fontSize: 16,
          letterSpacing: -0.2,
          fontWeight: FontWeight.w500,
          height: 1.5,
        ),
        sentMessageCaptionTextStyle: const TextStyle(
          color: Color(0xffcccccc),
          fontSize: 12,
          letterSpacing: -0.2,
          fontWeight: FontWeight.w500,
          height: 1.333,
        ),
        sentMessageLinkTitleTextStyle: const TextStyle(
          color: Colors.white,
          letterSpacing: -0.2,
          fontSize: 16,
          fontWeight: FontWeight.w800,
          height: 1.375,
        ),
        sentMessageLinkDescriptionTextStyle: const TextStyle(
          color: Color(0xffcccccc),
          letterSpacing: -0.2,
          fontSize: 14,
          fontWeight: FontWeight.w400,
          height: 1.428,
        ),
        sentMessageDocumentIconColor: Colors.white,

        // Input styling
        inputTextStyle: const TextStyle(
          fontSize: 16,
          letterSpacing: -0.3,
          fontWeight: FontWeight.w500,
          height: 1.5,
          color: Color(0xff1a1a1a),
        ),
        inputBorderRadius: const BorderRadius.all(Radius.circular(24)),
        inputPadding: const EdgeInsets.fromLTRB(16, 16, 16, 16),
        inputMargin: const EdgeInsets.all(8),

        // User avatar and name styling
        userAvatarNameColors: const [color],
        userAvatarTextStyle: const TextStyle(
          color: Colors.white,
          fontSize: 12,
          fontWeight: FontWeight.w800,
          height: 1.333,
        ),
        userNameTextStyle: const TextStyle(
          color: Color(0xff1a1a1a),
          fontSize: 12,
          letterSpacing: -0.2,
          fontWeight: FontWeight.w800,
          height: 1.333,
        ),

        // Date divider styling
        dateDividerTextStyle: const TextStyle(
          color: Color(0xff999999),
          fontSize: 12,
          fontWeight: FontWeight.w800,
          height: 1.333,
        ),

        // Empty chat placeholder
        emptyChatPlaceholderTextStyle: const TextStyle(
          color: Color(0xff666666),
          fontSize: 16,
          fontWeight: FontWeight.w500,
          height: 1.5,
        ),
      );