[styles] background, onBackground to primaryContainer, onPrimaryConta…

…iner
ChiliBitcoin · Jul 8, 2024 · 33d8294 · 33d8294
1 parent 916f020
commit 33d8294
Show file tree

Hide file tree

Showing 29 changed files with 172 additions and 134 deletions.
diff --git a/lib/_ui/alert.dart b/lib/_ui/alert.dart
@@ -25,7 +25,6 @@ class BBAlert extends StatelessWidget {
   static Future _openPopUp(BuildContext context, AlertData alertData) {
     return showGeneralDialog(
       barrierLabel: 'showGeneralDialog',
-      barrierDismissible: false,
       transitionDuration: const Duration(milliseconds: 600),
       context: context,
       pageBuilder: (context, _, __) {
@@ -172,13 +171,13 @@ class BBAlert extends StatelessWidget {
       child: SizedBox(
         width: width,
         child: AlertDialog(
-          backgroundColor: context.colour.background,
+          backgroundColor: context.colour.primaryContainer,
           title: title != null ? BBText.titleLarge(title ?? '') : Container(),
           content: BBText.error(text),
           shape:
               RoundedRectangleBorder(borderRadius: BorderRadius.circular(32)),
           actions: buttons,
-          surfaceTintColor: context.colour.background,
+          surfaceTintColor: context.colour.primaryContainer,
         ),
       ),
     );

diff --git a/lib/_ui/app_bar.dart b/lib/_ui/app_bar.dart
@@ -16,7 +16,7 @@ class BBAppBar extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Container(
-      color: context.colour.background,
+      color: context.colour.primaryContainer,
       height: double.infinity,
       child: Row(
         crossAxisAlignment: CrossAxisAlignment.end,
@@ -28,7 +28,7 @@ class BBAppBar extends StatelessWidget {
                 icon: const FaIcon(FontAwesomeIcons.angleLeft),
                 padding: EdgeInsets.zero,
                 onPressed: onBack,
-                color: context.colour.onBackground,
+                color: context.colour.onPrimaryContainer,
               ).animate(delay: 100.ms).fadeIn(),
             ),
           ],

diff --git a/lib/_ui/atoms/bb_form_field.dart b/lib/_ui/atoms/bb_form_field.dart
@@ -29,7 +29,7 @@ class BBFormField extends StatelessWidget {
   Widget build(BuildContext context) {
     final borderColor = selected
         ? context.colour.primary
-        : context.colour.onBackground.withOpacity(0.2);
+        : context.colour.onPrimaryContainer.withOpacity(0.2);
 
     // TODO: Ideally move this to theme file
     final InputDecoration decoration = InputDecoration(

diff --git a/lib/_ui/bottom_bar.dart b/lib/_ui/bottom_bar.dart
@@ -17,7 +17,7 @@ class BottomBar extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return ColoredBox(
-      color: context.colour.onBackground,
+      color: context.colour.onPrimaryContainer,
       child: Row(
         mainAxisAlignment: MainAxisAlignment.spaceEvenly,
         children: [

diff --git a/lib/_ui/bottom_wallet_actions.dart b/lib/_ui/bottom_wallet_actions.dart
@@ -21,7 +21,7 @@ class WalletActionButtons extends StatelessWidget {
     // const buttonWidth = double.maxFinite;
     //128.0;
 
-    final color = context.colour.background;
+    final color = context.colour.primaryContainer;
 
     return Container(
       padding: const EdgeInsets.only(

diff --git a/lib/_ui/components/button.dart b/lib/_ui/components/button.dart
@@ -144,7 +144,8 @@ class BBButton extends StatelessWidget {
       (Lighting x) => x.state.currentTheme(context) == ThemeMode.dark,
     );
 
-    final bgColour = darkMode ? context.colour.background : NewColours.offWhite;
+    final bgColour =
+        darkMode ? context.colour.primaryContainer : NewColours.offWhite;
 
     Widget widget;
 
@@ -162,7 +163,7 @@ class BBButton extends StatelessWidget {
           // shadowColor: Colors.transparent,
           padding: const EdgeInsets.symmetric(vertical: 8),
 
-          // disabledForegroundColor: context.colour.onBackground,
+          // disabledForegroundColor: context.colour.onPrimaryContainer,
         );
 
         if (!loading)
@@ -177,15 +178,15 @@ class BBButton extends StatelessWidget {
                   SvgPicture.asset(
                     leftSvgAsset!,
                     colorFilter: ColorFilter.mode(
-                      context.colour.onBackground,
+                      context.colour.onPrimaryContainer,
                       BlendMode.srcIn,
                     ),
                   ),
                   const Gap(16),
                 ] else if (leftIcon != null) ...[
                   Icon(
                     leftIcon,
-                    color: context.colour.onBackground,
+                    color: context.colour.onPrimaryContainer,
                   ),
                   const Gap(16),
                 ],
@@ -272,14 +273,14 @@ class BBButton extends StatelessWidget {
                             valueColor: AlwaysStoppedAnimation<Color>(
                               context.colour.primary,
                             ),
-                            backgroundColor: context.colour.background,
+                            backgroundColor: context.colour.primaryContainer,
                           ),
                         ),
                 ),
               const Gap(8),
               FaIcon(
                 FontAwesomeIcons.angleRight,
-                color: context.colour.onBackground,
+                color: context.colour.onPrimaryContainer,
                 // size: 16,
               ),
               const Gap(8),

diff --git a/lib/_ui/components/controls.dart b/lib/_ui/components/controls.dart
@@ -47,10 +47,10 @@ class BBSwitcher<T> extends StatelessWidget {
     );
 
     final colour =
-        darkMode ? context.colour.background : context.colour.surface;
+        darkMode ? context.colour.primaryContainer : context.colour.surface;
 
     final borderColour =
-        darkMode ? context.colour.onBackground : context.colour.onSurface;
+        darkMode ? context.colour.onPrimaryContainer : context.colour.onSurface;
 
     return Container(
       decoration: BoxDecoration(
@@ -94,7 +94,7 @@ class BBDropDown<T> extends StatelessWidget {
     );
 
     final bgColour =
-        darkMode ? context.colour.onBackground : NewColours.offWhite;
+        darkMode ? context.colour.onPrimaryContainer : NewColours.offWhite;
 
     final widget = SizedBox(
       width: 225,
@@ -131,7 +131,7 @@ class BBDropDown<T> extends StatelessWidget {
               borderRadius: BorderRadius.circular(8),
             ),
             filled: true,
-            fillColor: context.colour.background,
+            fillColor: context.colour.primaryContainer,
             focusedBorder: OutlineInputBorder(
               borderSide: BorderSide(color: bgColour),
               borderRadius: BorderRadius.circular(8),
@@ -181,10 +181,10 @@ class BBSwitch extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Switch(
-      activeColor: context.colour.background,
-      activeTrackColor: context.colour.onBackground,
+      activeColor: context.colour.primaryContainer,
+      activeTrackColor: context.colour.onPrimaryContainer,
       inactiveTrackColor: context.colour.surface,
-      inactiveThumbColor: context.colour.onBackground.withOpacity(0.4),
+      inactiveThumbColor: context.colour.onPrimaryContainer.withOpacity(0.4),
       value: value,
       onChanged: onChanged,
     );

diff --git a/lib/_ui/components/text.dart b/lib/_ui/components/text.dart
@@ -170,7 +170,7 @@ class BBText extends StatelessWidget {
     if (isGreen) style = style.copyWith(color: Colors.green);
     if (isBold) style = style.copyWith(fontWeight: FontWeight.bold);
     if (removeColourOpacity)
-      style = style.copyWith(color: context.colour.onBackground);
+      style = style.copyWith(color: context.colour.onPrimaryContainer);
     if (fontSize != null) style = style.copyWith(fontSize: fontSize);
     if (compact) style = style.copyWith(height: 0.8);
 

diff --git a/lib/_ui/components/text_input.dart b/lib/_ui/components/text_input.dart
@@ -128,7 +128,8 @@ class _BBTextInputState extends State<BBTextInput> {
 
   @override
   Widget build(BuildContext context) {
-    if (widget.value != _editingController.text) _editingController.text = widget.value;
+    if (widget.value != _editingController.text)
+      _editingController.text = widget.value;
 
     Widget widgett;
 
@@ -142,7 +143,8 @@ class _BBTextInputState extends State<BBTextInput> {
           enableIMEPersonalizedLearning: false,
           keyboardType: TextInputType.multiline,
           maxLines: 5,
-          style: context.font.bodySmall!.copyWith(color: context.colour.onBackground),
+          style: context.font.bodySmall!
+              .copyWith(color: context.colour.onPrimaryContainer),
           onTap: () => widget.onEnter?.call(),
           decoration: InputDecoration(
             suffixIcon: widget.rightIcon,
@@ -154,13 +156,13 @@ class _BBTextInputState extends State<BBTextInput> {
             enabledBorder: OutlineInputBorder(
               borderRadius: BorderRadius.circular(8.0),
               borderSide: BorderSide(
-                color: context.colour.onBackground.withOpacity(0.2),
+                color: context.colour.onPrimaryContainer.withOpacity(0.2),
               ),
             ),
             focusedBorder: OutlineInputBorder(
               borderRadius: BorderRadius.circular(8.0),
               borderSide: BorderSide(
-                color: context.colour.onBackground,
+                color: context.colour.onPrimaryContainer,
               ),
             ),
           ),
@@ -190,19 +192,19 @@ class _BBTextInputState extends State<BBTextInput> {
               enabledBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(8.0),
                 borderSide: BorderSide(
-                  color: context.colour.onBackground.withOpacity(0.2),
+                  color: context.colour.onPrimaryContainer.withOpacity(0.2),
                 ),
               ),
               focusedBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(8.0),
                 borderSide: BorderSide(
-                  color: context.colour.onBackground,
+                  color: context.colour.onPrimaryContainer,
                 ),
               ),
               disabledBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(8.0),
                 borderSide: BorderSide(
-                  color: context.colour.onBackground.withOpacity(0.2),
+                  color: context.colour.onPrimaryContainer.withOpacity(0.2),
                 ),
               ),
               labelStyle: context.font.labelSmall,
@@ -238,13 +240,13 @@ class _BBTextInputState extends State<BBTextInput> {
               enabledBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(8.0),
                 borderSide: BorderSide(
-                  color: context.colour.onBackground.withOpacity(0.2),
+                  color: context.colour.onPrimaryContainer.withOpacity(0.2),
                 ),
               ),
               focusedBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(8.0),
                 borderSide: BorderSide(
-                  color: context.colour.onBackground,
+                  color: context.colour.onPrimaryContainer,
                 ),
               ),
               labelStyle: context.font.labelSmall,
@@ -281,13 +283,13 @@ class _BBTextInputState extends State<BBTextInput> {
               enabledBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(8.0),
                 borderSide: BorderSide(
-                  color: context.colour.onBackground.withOpacity(0.2),
+                  color: context.colour.onPrimaryContainer.withOpacity(0.2),
                 ),
               ),
               focusedBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(8.0),
                 borderSide: BorderSide(
-                  color: context.colour.onBackground,
+                  color: context.colour.onPrimaryContainer,
                 ),
               ),
               labelStyle: context.font.labelSmall,
@@ -318,13 +320,13 @@ class _BBTextInputState extends State<BBTextInput> {
               enabledBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(8.0),
                 borderSide: BorderSide(
-                  color: context.colour.onBackground.withOpacity(0.2),
+                  color: context.colour.onPrimaryContainer.withOpacity(0.2),
                 ),
               ),
               focusedBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(8.0),
                 borderSide: BorderSide(
-                  color: context.colour.onBackground,
+                  color: context.colour.onPrimaryContainer,
                 ),
               ),
               labelStyle: context.font.labelSmall,
@@ -383,7 +385,7 @@ class _BBTextInputState extends State<BBTextInput> {
 //       _editingController.text = widget.value!;
 
 //     final borderColor =
-//         widget.selected ? context.colour.primary : context.colour.onBackground.withOpacity(0.2);
+//         widget.selected ? context.colour.primary : context.colour.onPrimaryContainer.withOpacity(0.2);
 
 //     return TextField(
 //       key: widget.uiKey,
@@ -480,8 +482,9 @@ class _BBAmountInputState2 extends State<BBAmountInput> {
     if (widget.value != null && _editingController.text != widget.value)
       _editingController.text = widget.value!;
 
-    final borderColor =
-        widget.selected ? context.colour.primary : context.colour.onBackground.withOpacity(0.2);
+    final borderColor = widget.selected
+        ? context.colour.primary
+        : context.colour.onPrimaryContainer.withOpacity(0.2);
 
     return SizedBox(
       height: 60,

diff --git a/lib/_ui/headers.dart b/lib/_ui/headers.dart
@@ -38,7 +38,7 @@ class BBHeader extends StatelessWidget {
           if (showBack)
             IconButton(
               icon: const FaIcon(FontAwesomeIcons.xmark),
-              color: context.colour.onBackground,
+              color: context.colour.onPrimaryContainer,
               onPressed: () {
                 if (onBack == null)
                   Navigator.of(context).pop();

diff --git a/lib/_ui/page_template.dart b/lib/_ui/page_template.dart
@@ -21,8 +21,9 @@ class StackedPage extends StatelessWidget {
           child: Container(
             width: double.infinity,
             height: 72,
-            color: context.colour.background.withOpacity(0.95),
-            padding: const EdgeInsets.only(bottom: 16, top: 8, left: 16, right: 16),
+            color: context.colour.primaryContainer.withOpacity(0.95),
+            padding:
+                const EdgeInsets.only(bottom: 16, top: 8, left: 16, right: 16),
             alignment: Alignment.bottomCenter,
             child: bottomChild,
           ),

diff --git a/lib/_ui/popup_border.dart b/lib/_ui/popup_border.dart
@@ -7,7 +7,8 @@ import 'package:flutter_animate/flutter_animate.dart';
 import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
 
 class PopUpBorder extends StatefulWidget {
-  const PopUpBorder({super.key, required this.child, this.scrollToBottom = false});
+  const PopUpBorder(
+      {super.key, required this.child, this.scrollToBottom = false});
 
   final Widget child;
   final bool scrollToBottom;
@@ -66,7 +67,7 @@ class _PopUpBorderState extends State<PopUpBorder> {
                 ignoring: false,
                 child: Container(
                   decoration: BoxDecoration(
-                    color: context.colour.background,
+                    color: context.colour.primaryContainer,
                     borderRadius: const BorderRadius.vertical(
                       top: Radius.circular(25.0),
                     ),

diff --git a/lib/_ui/toast.dart b/lib/_ui/toast.dart
@@ -6,7 +6,7 @@ extension Xontext on BuildContext {
   SnackBar showToast(String text) {
     return SnackBar(
       content: Center(child: BBText.titleLarge(text)),
-      backgroundColor: colour.background,
+      backgroundColor: colour.primaryContainer,
       elevation: 4,
     );
   }

diff --git a/lib/address/pop_up.dart b/lib/address/pop_up.dart
@@ -79,13 +79,13 @@ class _Screen extends StatelessWidget {
           const AddressQR(),
           const Gap(8),
           Divider(
-            color: context.colour.onBackground.withOpacity(0.3),
+            color: context.colour.onPrimaryContainer.withOpacity(0.3),
           ),
           const Gap(8),
           const AddressDetails(),
           const Gap(4),
           Divider(
-            color: context.colour.onBackground.withOpacity(0.3),
+            color: context.colour.onPrimaryContainer.withOpacity(0.3),
           ),
           const Gap(4),
           const AddressActions(),

diff --git a/lib/auth/page.dart b/lib/auth/page.dart
@@ -131,7 +131,7 @@ class AuthPasswordField extends StatelessWidget {
             iconSize: 32,
             color: pin.isEmpty
                 ? context.colour.surface
-                : context.colour.onBackground,
+                : context.colour.onPrimaryContainer,
             splashColor: Colors.transparent,
             onPressed: () {
               SystemSound.play(SystemSoundType.click);
@@ -178,14 +178,14 @@ class _NumberButtonState extends State<NumberButton> {
   Widget build(BuildContext context) {
     final _ = OutlinedButton.styleFrom(
       shape: const CircleBorder(),
-      backgroundColor: context.colour.onBackground,
+      backgroundColor: context.colour.onPrimaryContainer,
       foregroundColor: context.colour.primary,
     );
 
     final __ = OutlinedButton.styleFrom(
       shape: const CircleBorder(),
       backgroundColor: context.colour.primary,
-      foregroundColor: context.colour.background,
+      foregroundColor: context.colour.primaryContainer,
     );
 
     return Center(