make pressable button more visbile in dark mode, make main menu indicators into pressable buttons (#1315)

lib/pangea/widgets/chat/message_speech_to_text_card.dart

@@ -79,10 +79,7 @@ class MessageSpeechToTextCardState extends State<MessageSpeechToTextCard> {
       if (transcript.sttTokens.isEmpty) {
         return TextSpan(
           text: remainingFullText,
-          style: BotStyle.text(
+          style: BotStyle.text(context),
-            context,
-            setColor: false,
-          ),
         );
       }
 

lib/pangea/widgets/chat_list/analytics_summary/learning_settings_button.dart

@@ -1,3 +1,4 @@
+import 'package:fluffychat/pangea/widgets/pressable_button.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
 
@@ -16,23 +17,15 @@ class LearningSettingsButton extends StatelessWidget {
   Widget build(BuildContext context) {
     return Tooltip(
       message: L10n.of(context).learningSettings,
-      child: InkWell(
+      child: PressableButton(
-        customBorder: RoundedRectangleBorder(
+        buttonHeight: 2.5,
-          borderRadius: BorderRadius.circular(15),
+        borderRadius: BorderRadius.circular(15),
-        ),
+        onPressed: onTap,
-        onTap: onTap,
+        color: Theme.of(context).colorScheme.surfaceBright,
         child: Container(
           decoration: BoxDecoration(
             borderRadius: BorderRadius.circular(15),
             color: Theme.of(context).colorScheme.surfaceBright,
-            boxShadow: [
-              BoxShadow(
-                color: Theme.of(context).colorScheme.primary,
-                spreadRadius: 1,
-                blurRadius: 1,
-                offset: const Offset(1, 1), // changes position of shadow
-              ),
-            ],
           ),
           padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
           child: Row(

lib/pangea/widgets/chat_list/analytics_summary/level_badge.dart

@@ -1,4 +1,6 @@
 import 'package:fluffychat/config/app_config.dart';
+import 'package:fluffychat/pangea/widgets/chat_list/analytics_summary/level_bar_popup.dart';
+import 'package:fluffychat/pangea/widgets/pressable_button.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
 
@@ -11,43 +13,46 @@ class LevelBadge extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return PressableButton(
-      decoration: BoxDecoration(
+      color: Theme.of(context).colorScheme.surfaceBright,
-        borderRadius: BorderRadius.circular(15),
+      borderRadius: BorderRadius.circular(15),
-        color: Theme.of(context).colorScheme.surfaceBright,
+      buttonHeight: 2.5,
-        boxShadow: [
+      onPressed: () {
-          BoxShadow(
+        showDialog<LevelBarPopup>(
-            color: Theme.of(context).colorScheme.primary,
+          context: context,
-            spreadRadius: 1,
+          builder: (c) => const LevelBarPopup(),
-            blurRadius: 1,
+        );
-            offset: const Offset(1, 1), // changes position of shadow
+      },
-          ),
+      child: Container(
-        ],
+        decoration: BoxDecoration(
-      ),
+          borderRadius: BorderRadius.circular(15),
-      padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 2),
+          color: Theme.of(context).colorScheme.surfaceBright,
-      child: Row(
+        ),
-        mainAxisSize: MainAxisSize.min,
+        padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 2),
-        children: [
+        child: Row(
-          CircleAvatar(
+          mainAxisSize: MainAxisSize.min,
-            backgroundColor: AppConfig.gold,
+          children: [
-            radius: 8,
+            CircleAvatar(
-            child: Icon(
+              backgroundColor: AppConfig.gold,
-              size: 12,
+              radius: 8,
-              Icons.star,
+              child: Icon(
-              color: Theme.of(context).colorScheme.surfaceBright,
+                size: 12,
-              weight: 1000,
+                Icons.star,
+                color: Theme.of(context).colorScheme.surfaceBright,
+                weight: 1000,
+              ),
             ),
-          ),
+            const SizedBox(width: 4),
-          const SizedBox(width: 4),
+            Text(
-          Text(
+              L10n.of(context).levelShort(level),
-            L10n.of(context).levelShort(level),
+              style: TextStyle(
-            style: TextStyle(
+                fontSize: 12,
-              fontSize: 12,
+                fontWeight: FontWeight.bold,
-              fontWeight: FontWeight.bold,
+                color: Theme.of(context).colorScheme.primary,
-              color: Theme.of(context).colorScheme.primary,
+              ),
             ),
-          ),
+          ],
-        ],
+        ),
       ),
     );
   }

lib/pangea/widgets/chat_list/analytics_summary/progress_indicator.dart

@@ -1,4 +1,5 @@
 import 'package:fluffychat/pangea/enum/progress_indicators_enum.dart';
+import 'package:fluffychat/pangea/widgets/pressable_button.dart';
 import 'package:flutter/material.dart';
 
 /// A badge that represents one learning progress indicator (i.e., construct uses)
@@ -20,23 +21,15 @@ class ProgressIndicatorBadge extends StatelessWidget {
   Widget build(BuildContext context) {
     return Tooltip(
       message: indicator.tooltip(context),
-      child: InkWell(
+      child: PressableButton(
-        customBorder: RoundedRectangleBorder(
+        color: Theme.of(context).colorScheme.surfaceBright,
-          borderRadius: BorderRadius.circular(15),
+        borderRadius: BorderRadius.circular(15),
-        ),
+        onPressed: onTap,
-        onTap: onTap,
+        buttonHeight: 2.5,
         child: Container(
           decoration: BoxDecoration(
             borderRadius: BorderRadius.circular(15),
             color: Theme.of(context).colorScheme.surfaceBright,
-            boxShadow: [
-              BoxShadow(
-                color: Theme.of(context).colorScheme.primary,
-                spreadRadius: 1,
-                blurRadius: 1,
-                offset: const Offset(-1, 1), // changes position of shadow
-              ),
-            ],
           ),
           padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
           child: Row(

lib/pangea/widgets/pressable_button.dart

@@ -138,7 +138,9 @@ class PressableButtonState extends State<PressableButton>
             return Container(
               decoration: BoxDecoration(
                 color: Color.alphaBlend(
-                  Colors.black.withOpacity(0.25),
+                  Theme.of(context).brightness == Brightness.light
+                      ? Colors.black.withOpacity(0.25)
+                      : Colors.white.withOpacity(0.25),
                   widget.color,
                 ),
                 borderRadius: widget.borderRadius,