fix(ui-kit): fix message input dm checkbox accessibility scaling issue

Signed-off-by: Sahil Kumar <[email protected]>
This commit is contained in:
Sahil Kumar
2021-03-31 17:05:07 +05:30
parent 8b58ac06ff
commit 2014c25235
@@ -319,7 +319,11 @@ class MessageInputState extends State<MessageInput> {
), ),
if (widget.parentMessage != null && !widget.hideSendAsDm) if (widget.parentMessage != null && !widget.hideSendAsDm)
Padding( Padding(
padding: const EdgeInsets.symmetric(horizontal: 8.0), padding: const EdgeInsets.only(
right: 12.0,
left: 12.0,
bottom: 12.0,
),
child: _buildDmCheckbox(), child: _buildDmCheckbox(),
), ),
_buildFilePickerSection(), _buildFilePickerSection(),
@@ -354,68 +358,68 @@ class MessageInputState extends State<MessageInput> {
} }
Widget _buildDmCheckbox() { Widget _buildDmCheckbox() {
return Container( return Row(
height: 36, crossAxisAlignment: CrossAxisAlignment.center,
padding: const EdgeInsets.only( children: [
left: 12, Container(
bottom: 12, height: 16,
top: 8, width: 16,
), foregroundDecoration: BoxDecoration(
child: Row( border: _sendAsDm
crossAxisAlignment: CrossAxisAlignment.center, ? null
children: [ : Border.all(
Container( color: StreamChatTheme.of(context)
height: 16, .colorTheme
width: 16, .black
foregroundDecoration: BoxDecoration( .withOpacity(.5),
border: _sendAsDm width: 2,
? null ),
: Border.all( borderRadius: BorderRadius.circular(3),
color: StreamChatTheme.of(context) ),
.colorTheme child: Center(
.black child: Material(
.withOpacity(.5),
width: 2,
),
borderRadius: BorderRadius.circular(3), borderRadius: BorderRadius.circular(3),
), color: _sendAsDm
child: Center( ? StreamChatTheme.of(context).colorTheme.accentBlue
child: Material( : StreamChatTheme.of(context).colorTheme.white,
borderRadius: BorderRadius.circular(3), child: InkWell(
color: _sendAsDm onTap: () {
? StreamChatTheme.of(context).colorTheme.accentBlue setState(() {
: StreamChatTheme.of(context).colorTheme.white, _sendAsDm = !_sendAsDm;
child: InkWell( });
onTap: () { },
setState(() { child: AnimatedCrossFade(
_sendAsDm = !_sendAsDm; duration: Duration(milliseconds: 300),
}); reverseDuration: Duration(milliseconds: 300),
}, crossFadeState: _sendAsDm
child: AnimatedCrossFade( ? CrossFadeState.showFirst
duration: Duration(milliseconds: 300), : CrossFadeState.showSecond,
reverseDuration: Duration(milliseconds: 300), firstChild: StreamSvgIcon.check(
crossFadeState: _sendAsDm size: 16.0,
? CrossFadeState.showFirst color: StreamChatTheme.of(context).colorTheme.white,
: CrossFadeState.showSecond, ),
firstChild: StreamSvgIcon.check( secondChild: SizedBox(
size: 16.0, height: 16,
color: StreamChatTheme.of(context).colorTheme.white, width: 16,
),
secondChild: SizedBox(
height: 16,
width: 16,
),
), ),
), ),
), ),
), ),
), ),
Padding( ),
padding: const EdgeInsets.symmetric(horizontal: 16.0), Padding(
child: Text('Also send as direct message'), padding: const EdgeInsets.symmetric(horizontal: 12.0),
child: Text(
'Also send as direct message',
style: StreamChatTheme.of(context).textTheme.footnote.copyWith(
color: StreamChatTheme.of(context)
.colorTheme
.black
.withOpacity(0.5),
),
), ),
], ),
), ],
); );
} }