Merge pull request #1021 from pangeachat/1016-border-radius-on-overla…

…y-top-bar added border radius to overlay header
pangeachat · Nov 15, 2024 · 661a64f · 661a64f
2 parents cdce258 + 2106c5a
commit 661a64f
Show file tree

Hide file tree

Showing 4 changed files with 68 additions and 54 deletions.
diff --git a/lib/pangea/widgets/chat/message_selection_overlay.dart b/lib/pangea/widgets/chat/message_selection_overlay.dart
@@ -658,6 +658,7 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
             ),
           ),
           Material(
+            type: MaterialType.transparency,
             child: OverlayHeader(controller: widget.chatController),
           ),
         ],

diff --git a/lib/pangea/widgets/chat/overlay_footer.dart b/lib/pangea/widgets/chat/overlay_footer.dart
@@ -1,3 +1,4 @@
+import 'package:fluffychat/config/app_config.dart';
 import 'package:fluffychat/config/themes.dart';
 import 'package:fluffychat/pages/chat/chat.dart';
 import 'package:fluffychat/pages/chat/chat_input_row.dart';
@@ -31,7 +32,7 @@ class OverlayFooter extends StatelessWidget {
             clipBehavior: Clip.hardEdge,
             color: Theme.of(context).colorScheme.surfaceContainerHighest,
             borderRadius: const BorderRadius.all(
-              Radius.circular(24),
+              Radius.circular(AppConfig.borderRadius),
             ),
             child: ChatInputRow(controller),
           ),

diff --git a/lib/pangea/widgets/chat/overlay_header.dart b/lib/pangea/widgets/chat/overlay_header.dart
@@ -1,3 +1,4 @@
+import 'package:fluffychat/config/app_config.dart';
 import 'package:fluffychat/pages/chat/chat.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
@@ -14,63 +15,73 @@ class OverlayHeader extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Column(
-      mainAxisSize: MainAxisSize.min,
-      children: [
-        AppBar(
-          actionsIconTheme: IconThemeData(
+    return Container(
+      padding: const EdgeInsets.symmetric(horizontal: 20),
+      decoration: BoxDecoration(
+        borderRadius: const BorderRadius.only(
+          bottomLeft: Radius.circular(AppConfig.borderRadius),
+          bottomRight: Radius.circular(AppConfig.borderRadius),
+        ),
+        color: Theme.of(context).appBarTheme.backgroundColor,
+      ),
+      height: Theme.of(context).appBarTheme.toolbarHeight ?? 56,
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.end,
+        children: [
+          IconButton(
+            icon: const Icon(Symbols.forward),
+            tooltip: L10n.of(context)!.forward,
+            onPressed: controller.forwardEventsAction,
             color: Theme.of(context).colorScheme.primary,
           ),
-          actions: [
+          if (controller.selectedEvents.length == 1 &&
+              controller.selectedEvents.single.messageType == MessageTypes.Text)
             IconButton(
-              icon: const Icon(Symbols.forward),
-              tooltip: L10n.of(context)!.forward,
-              onPressed: controller.forwardEventsAction,
+              icon: const Icon(Icons.copy_outlined),
+              tooltip: L10n.of(context)!.copy,
+              onPressed: controller.copyEventsAction,
+              color: Theme.of(context).colorScheme.primary,
             ),
-            if (controller.selectedEvents.length == 1 &&
-                controller.selectedEvents.single.messageType ==
-                    MessageTypes.Text)
-              IconButton(
-                icon: const Icon(Icons.copy_outlined),
-                tooltip: L10n.of(context)!.copy,
-                onPressed: controller.copyEventsAction,
-              ),
-            if (controller.canPinSelectedEvents)
-              IconButton(
-                icon: const Icon(Icons.push_pin_outlined),
-                onPressed: controller.pinEvent,
-                tooltip: L10n.of(context)!.pinMessage,
-              ),
-            if (controller.canEditSelectedEvents)
-              IconButton(
-                icon: const Icon(Icons.edit_outlined),
-                tooltip: L10n.of(context)!.edit,
-                onPressed: controller.editSelectedEventAction,
-              ),
-            if (controller.canRedactSelectedEvents)
-              IconButton(
-                icon: const Icon(Icons.delete_outlined),
-                tooltip: L10n.of(context)!.redactMessage,
-                onPressed: controller.redactEventsAction,
-              ),
-            if (controller.selectedEvents.length == 1)
-              IconButton(
-                icon: const Icon(Icons.shield_outlined),
-                tooltip: L10n.of(context)!.reportMessage,
-                onPressed: controller.reportEventAction,
-              ),
-            if (controller.selectedEvents.length == 1)
-              IconButton(
-                icon: const Icon(Icons.info_outlined),
-                tooltip: L10n.of(context)!.messageInfo,
-                onPressed: () {
-                  controller.showEventInfo();
-                  controller.clearSelectedEvents();
-                },
-              ),
-          ],
-        ),
-      ],
+          if (controller.canPinSelectedEvents)
+            IconButton(
+              icon: const Icon(Icons.push_pin_outlined),
+              onPressed: controller.pinEvent,
+              tooltip: L10n.of(context)!.pinMessage,
+              color: Theme.of(context).colorScheme.primary,
+            ),
+          if (controller.canEditSelectedEvents)
+            IconButton(
+              icon: const Icon(Icons.edit_outlined),
+              tooltip: L10n.of(context)!.edit,
+              onPressed: controller.editSelectedEventAction,
+              color: Theme.of(context).colorScheme.primary,
+            ),
+          if (controller.canRedactSelectedEvents)
+            IconButton(
+              icon: const Icon(Icons.delete_outlined),
+              tooltip: L10n.of(context)!.redactMessage,
+              onPressed: controller.redactEventsAction,
+              color: Theme.of(context).colorScheme.primary,
+            ),
+          if (controller.selectedEvents.length == 1)
+            IconButton(
+              icon: const Icon(Icons.shield_outlined),
+              tooltip: L10n.of(context)!.reportMessage,
+              onPressed: controller.reportEventAction,
+              color: Theme.of(context).colorScheme.primary,
+            ),
+          if (controller.selectedEvents.length == 1)
+            IconButton(
+              icon: const Icon(Icons.info_outlined),
+              tooltip: L10n.of(context)!.messageInfo,
+              color: Theme.of(context).colorScheme.primary,
+              onPressed: () {
+                controller.showEventInfo();
+                controller.clearSelectedEvents();
+              },
+            ),
+        ],
+      ),
     );
   }
 }
diff --git a/lib/pangea/widgets/practice_activity/multiple_choice_activity.dart b/lib/pangea/widgets/practice_activity/multiple_choice_activity.dart
@@ -122,6 +122,7 @@ class MultipleChoiceActivityState extends State<MultipleChoiceActivity> {
 
     final content = Column(
       mainAxisSize: MainAxisSize.min,
+      mainAxisAlignment: MainAxisAlignment.center,
       children: [
         Text(
           practiceActivity.content.question,