ember/fluffychat
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

1053 making font in the tool pop up the same size as message (#1075)

Browse source 
* give text in toolbar the same size / style as message text

* fix scrolling in overlay message and message translation, also fix overflow on mobile
This commit is contained in:
ggurdin 2024-11-20 14:03:31 -05:00 • committed by GitHub
parent 1c997fd864
commit 34c6511387
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 117 additions and 95 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
lib/config/app_config.dart
View file

@ -1,6 +1,5 @@
import 'dart:ui';
import 'package:fluffychat/pangea/config/environment.dart';
import 'package:flutter/material.dart';
import 'package:matrix/matrix.dart';
abstract class AppConfig {
@ -26,7 +25,22 @@ abstract class AppConfig {
static const double toolbarMinHeight = 175.0;
static const double toolbarMinWidth = 350.0;
static const double toolbarButtonsHeight = 50.0;
// #Pangea
static TextStyle messageTextStyle(
Event event,
Color textColor,
) {
final fontSize = messageFontSize * fontSizeFactor;
final bigEmotes =
event.onlyEmotes && event.numberEmotes > 0 && event.numberEmotes <= 10;
return TextStyle(
color: textColor,
fontSize: bigEmotes ? fontSize * 3 : fontSize,
decoration: event.redacted ? TextDecoration.lineThrough : null,
height: 1.3,
);
}
// static const Color primaryColor = Color(0xFF5625BA);
// static const Color primaryColorLight = Color(0xFFCCBDEA);
static const Color primaryColor = Color(0xFF8560E0);

26
lib/pages/chat/events/message_content.dart
View file

@ -298,12 +298,8 @@ class MessageContent extends StatelessWidget {
event.numberEmotes <= 10;
// #Pangea
final messageTextStyle = TextStyle(
color: textColor,
fontSize: bigEmotes ? fontSize * 3 : fontSize,
decoration: event.redacted ? TextDecoration.lineThrough : null,
height: 1.3,
);
final messageTextStyle =
AppConfig.messageTextStyle(event, textColor);
if (immersionMode && pangeaMessageEvent != null) {
return Flexible(
@ -349,15 +345,15 @@ class MessageContent extends StatelessWidget {
MatrixLocals(L10n.of(context)!),
hideReply: true,
),
style: TextStyle(
color: textColor,
fontSize: bigEmotes ? fontSize * 3 : fontSize,
decoration:
event.redacted ? TextDecoration.lineThrough : null,
// #Pangea
height: 1.3,
// Pangea#
),
// #Pangea
// style: TextStyle(
// color: textColor,
// fontSize: bigEmotes ? fontSize * 3 : fontSize,
// decoration:
// event.redacted ? TextDecoration.lineThrough : null,
// ),
style: messageTextStyle,
// Pangea#
options: const LinkifyOptions(humanize: false),
linkStyle: TextStyle(
color: textColor.withAlpha(150),

1
lib/pangea/utils/bot_style.dart
View file

@ -20,6 +20,7 @@ class BotStyle {
fontStyle: italics ? FontStyle.italic : null,
color: setColor ? Theme.of(context).colorScheme.primary : null,
inherit: true,
height: 1.3,
);
return existingStyle?.merge(botStyle) ?? botStyle;

76
lib/pangea/widgets/chat/message_selection_overlay.dart
View file

@ -375,7 +375,6 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
final currentBottomOffset = _screenHeight! -
_messageOffset!.dy -
_messageHeight -
(_mediaQuery?.padding.bottom ?? 0) -
_belowMessageHeight;
final bool hasHeaderOverflow =
@ -496,8 +495,10 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
// height of the reply/forward bar + the reaction picker + contextual padding
double get _footerHeight {
return 56 + 16 + (FluffyThemes.isColumnMode(context) ? 16.0 : 8.0);
// (_mediaQuery?.padding.bottom ?? 0);
return 56 +
16 +
(FluffyThemes.isColumnMode(context) ? 16.0 : 8.0) +
(_mediaQuery?.padding.bottom ?? 0);
}
MediaQueryData? get _mediaQuery {
@ -627,7 +628,6 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
bottom: _screenHeight! -
_messageOffset!.dy -
_messageHeight -
(_mediaQuery?.padding.bottom ?? 0) -
_belowMessageHeight,
child: overlayMessage,
)
@ -643,41 +643,45 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
},
);
return SafeArea(
child: Padding(
padding: EdgeInsets.only(
left: horizontalPadding,
right: horizontalPadding,
),
child: Stack(
children: [
positionedOverlayMessage,
Align(
alignment: Alignment.bottomCenter,
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
OverlayFooter(controller: widget.chatController),
],
),
return Padding(
padding: EdgeInsets.only(
left: horizontalPadding,
right: horizontalPadding,
),
child: Stack(
children: [
positionedOverlayMessage,
Align(
alignment: Alignment.bottomCenter,
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
OverlayFooter(controller: widget.chatController),
SizedBox(height: _mediaQuery?.padding.bottom ?? 0),
],
),
if (showDetails)
const SizedBox(
width: FluffyThemes.columnWidth,
),
],
),
),
if (showDetails)
const SizedBox(
width: FluffyThemes.columnWidth,
),
],
),
Material(
type: MaterialType.transparency,
child: OverlayHeader(controller: widget.chatController),
),
Material(
type: MaterialType.transparency,
child: Column(
children: [
SizedBox(height: _mediaQuery?.padding.top ?? 0),
OverlayHeader(controller: widget.chatController),
],
),
],
),
),
],
),
);
}

70
lib/pangea/widgets/chat/message_translation_card.dart
View file

@ -4,7 +4,6 @@ import 'package:fluffychat/pangea/matrix_event_wrappers/pangea_message_event.dar
import 'package:fluffychat/pangea/models/pangea_token_model.dart';
import 'package:fluffychat/pangea/models/representation_content_model.dart';
import 'package:fluffychat/pangea/repo/full_text_translation_repo.dart';
import 'package:fluffychat/pangea/utils/bot_style.dart';
import 'package:fluffychat/pangea/utils/error_handler.dart';
import 'package:fluffychat/pangea/utils/inline_tooltip.dart';
import 'package:fluffychat/pangea/widgets/chat/toolbar_content_loading_indicator.dart';
@ -145,39 +144,44 @@ class MessageTranslationCardState extends State<MessageTranslationCard> {
return const ToolbarContentLoadingIndicator();
}
return Padding(
padding: const EdgeInsets.fromLTRB(16, 20, 16, 16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
widget.selection != null ? selectionTranslation! : repEvent!.text,
style: BotStyle.text(context),
textAlign: TextAlign.center,
),
if (notGoingToTranslate &&
widget.selection == null &&
!InstructionsEnum.l1Translation.toggledOff())
const Row(
mainAxisSize: MainAxisSize.min,
children: [
InlineTooltip(
instructionsEnum: InstructionsEnum.l1Translation,
),
],
return SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.fromLTRB(16, 20, 16, 16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
widget.selection != null ? selectionTranslation! : repEvent!.text,
style: AppConfig.messageTextStyle(
widget.messageEvent.event,
Theme.of(context).colorScheme.primary,
),
textAlign: TextAlign.center,
),
if (widget.selection != null &&
!InstructionsEnum.clickAgainToDeselect.toggledOff())
const Row(
mainAxisSize: MainAxisSize.min,
children: [
InlineTooltip(
instructionsEnum: InstructionsEnum.clickAgainToDeselect,
),
],
),
],
if (notGoingToTranslate &&
widget.selection == null &&
!InstructionsEnum.l1Translation.toggledOff())
const Row(
mainAxisSize: MainAxisSize.min,
children: [
InlineTooltip(
instructionsEnum: InstructionsEnum.l1Translation,
),
],
),
if (widget.selection != null &&
!InstructionsEnum.clickAgainToDeselect.toggledOff())
const Row(
mainAxisSize: MainAxisSize.min,
children: [
InlineTooltip(
instructionsEnum: InstructionsEnum.clickAgainToDeselect,
),
],
),
],
),
),
);
}

1
lib/pangea/widgets/chat/overlay_message.dart
View file

@ -115,7 +115,6 @@ class OverlayMessage extends StatelessWidget {
vertical: 8,
),
width: messageWidth,
height: messageHeight,
child: MessageContent(
pangeaMessageEvent.event,
textColor: ownMessage

3
lib/pangea/widgets/igc/card_error_widget.dart
View file

@ -23,7 +23,8 @@ class CardErrorWidget extends StatelessWidget {
Widget build(BuildContext context) {
final ErrorCopy errorCopy = ErrorCopy(context, error);
return ConstrainedBox(
return Container(
padding: const EdgeInsets.all(8),
constraints: maxWidth != null
? BoxConstraints(maxWidth: maxWidth!)
: const BoxConstraints(),

13
lib/pangea/widgets/practice_activity/multiple_choice_activity.dart
View file

@ -7,7 +7,6 @@ import 'package:fluffychat/pangea/controllers/put_analytics_controller.dart';
import 'package:fluffychat/pangea/enum/activity_type_enum.dart';
import 'package:fluffychat/pangea/models/practice_activities.dart/practice_activity_model.dart';
import 'package:fluffychat/pangea/models/practice_activities.dart/practice_activity_record_model.dart';
import 'package:fluffychat/pangea/utils/bot_style.dart';
import 'package:fluffychat/pangea/utils/error_handler.dart';
import 'package:fluffychat/pangea/widgets/chat/message_audio_card.dart';
import 'package:fluffychat/pangea/widgets/chat/tts_controller.dart';
@ -16,13 +15,14 @@ import 'package:fluffychat/pangea/widgets/practice_activity/word_audio_button.da
import 'package:fluffychat/widgets/matrix.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:matrix/matrix.dart';
/// The multiple choice activity view
class MultipleChoiceActivity extends StatefulWidget {
final PracticeActivityCardState practiceCardController;
final PracticeActivityModel currentActivity;
final TtsController tts;
final String eventID;
final Event event;
final VoidCallback? onError;
const MultipleChoiceActivity({
@ -30,7 +30,7 @@ class MultipleChoiceActivity extends StatefulWidget {
required this.practiceCardController,
required this.currentActivity,
required this.tts,
required this.eventID,
required this.event,
this.onError,
});
@ -126,7 +126,10 @@ class MultipleChoiceActivityState extends State<MultipleChoiceActivity> {
children: [
Text(
practiceActivity.content.question,
style: BotStyle.text(context),
style: AppConfig.messageTextStyle(
widget.event,
Theme.of(context).colorScheme.primary,
),
),
const SizedBox(height: 8),
if (practiceActivity.activityType ==
@ -134,7 +137,7 @@ class MultipleChoiceActivityState extends State<MultipleChoiceActivity> {
WordAudioButton(
text: practiceActivity.content.answer,
ttsController: widget.tts,
eventID: widget.eventID,
eventID: widget.event.eventId,
),
if (practiceActivity.activityType ==
ActivityTypeEnum.hiddenWordListening)

2
lib/pangea/widgets/practice_activity/practice_activity_card.dart
View file

@ -314,7 +314,7 @@ class PracticeActivityCardState extends State<PracticeActivityCard> {
practiceCardController: this,
currentActivity: currentActivity!,
tts: widget.ttsController,
eventID: widget.pangeaMessageEvent.eventId,
event: widget.pangeaMessageEvent.event,
onError: _onError,
);
}