RuutChatTheme constructor
const
RuutChatTheme({
- 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,
),
);