fix: use mono fonts correctly

witnet · Oct 17, 2024 · 33aa4f8 · 33aa4f8
1 parent 7fd33c7
commit 33aa4f8
Show file tree

Hide file tree

Showing 18 changed files with 90 additions and 54 deletions.
diff --git a/lib/screens/create_wallet/build_wallet_card.dart b/lib/screens/create_wallet/build_wallet_card.dart
@@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_spinkit/flutter_spinkit.dart';
 import 'package:my_wit_wallet/bloc/crypto/crypto_bloc.dart';
+import 'package:my_wit_wallet/theme/extended_theme.dart';
 import 'package:my_wit_wallet/util/get_localization.dart';
 import 'package:my_wit_wallet/screens/create_wallet/bloc/api_create_wallet.dart';
 import 'package:my_wit_wallet/screens/create_wallet/bloc/create_wallet_bloc.dart';
@@ -225,6 +226,7 @@ class BuildWalletCardState extends State<BuildWalletCard>
 
   Widget _cryptoBlocBuilder() {
     final theme = Theme.of(context);
+    final extendedTheme = theme.extension<ExtendedTheme>()!;
     return BlocBuilder<CryptoBloc, CryptoState>(
       builder: (context, state) {
         if (state is CryptoInitializingWalletState) {
@@ -293,7 +295,7 @@ class BuildWalletCardState extends State<BuildWalletCard>
                     '$currentTransactionCount',
                     maxLines: 2,
                     minFontSize: 16,
-                    style: theme.textTheme.bodyMedium!,
+                    style: extendedTheme.monoSmallText!,
                   )
                 ],
               ),

diff --git a/lib/screens/create_wallet/confirm_mnemonic_card.dart b/lib/screens/create_wallet/confirm_mnemonic_card.dart
@@ -72,7 +72,6 @@ class ConfirmMnemonicCardState extends State<ConfirmMnemonicCard>
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
-    final extendedTheme = theme.extension<ExtendedTheme>()!;
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: <Widget>[
@@ -91,7 +90,7 @@ class ConfirmMnemonicCardState extends State<ConfirmMnemonicCard>
           height: 16,
         ),
         TextField(
-          style: extendedTheme.monoLargeText,
+          style: theme.textTheme.titleLarge,
           keyboardType: TextInputType.text,
           textInputAction: TextInputAction.go,
           maxLines: 3,

diff --git a/lib/screens/create_wallet/import_mnemonic_card.dart b/lib/screens/create_wallet/import_mnemonic_card.dart
@@ -33,7 +33,6 @@ class EnterMnemonicCardState extends State<EnterMnemonicCard>
 
   Widget _buildConfirmField() {
     final theme = Theme.of(context);
-    final extendedTheme = theme.extension<ExtendedTheme>()!;
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: <Widget>[
@@ -53,11 +52,11 @@ class EnterMnemonicCardState extends State<EnterMnemonicCard>
         ),
         TextField(
           decoration: InputDecoration(
-              hintStyle: extendedTheme.monoLargeText!.copyWith(
-                  color: extendedTheme.monoLargeText!.color!.withOpacity(0.5))),
+              hintStyle: theme.textTheme.titleLarge!.copyWith(
+                  color: theme.textTheme.titleLarge!.color!.withOpacity(0.5))),
           keyboardType: TextInputType.text,
           textInputAction: TextInputAction.go,
-          style: extendedTheme.monoLargeText,
+          style: theme.textTheme.titleLarge,
           maxLines: 3,
           controller: textController,
           onSubmitted: (value) => {

diff --git a/lib/screens/preferences/export_signed_msg.dart b/lib/screens/preferences/export_signed_msg.dart
@@ -3,6 +3,7 @@ import 'dart:convert';
 import 'package:dart_date/dart_date.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
+import 'package:my_wit_wallet/theme/extended_theme.dart';
 import 'package:my_wit_wallet/util/get_localization.dart';
 import 'package:my_wit_wallet/util/storage/path_provider_interface.dart';
 import 'package:my_wit_wallet/widgets/PaddedButton.dart';
@@ -54,6 +55,7 @@ class ExportSignMessageState extends State<ExportSignMessage> {
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
+    final extendedTheme = theme.extension<ExtendedTheme>()!;
     return FutureBuilder(
         future: _getPermissionStatus(),
         builder: (context, AsyncSnapshot<PermissionStatus> snapshot) {
@@ -64,6 +66,7 @@ class ExportSignMessageState extends State<ExportSignMessage> {
             DashedRect(
                 color: Colors.grey,
                 strokeWidth: 1.0,
+                textStyle: extendedTheme.monoLargeText,
                 gap: 3.0,
                 showEye: true,
                 blur: !_showMessage,

diff --git a/lib/screens/preferences/export_xprv.dart b/lib/screens/preferences/export_xprv.dart
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:my_wit_wallet/theme/extended_theme.dart';
 import 'package:my_wit_wallet/util/get_localization.dart';
 import 'package:my_wit_wallet/screens/dashboard/bloc/dashboard_bloc.dart';
 import 'package:my_wit_wallet/shared/api_database.dart';
@@ -43,6 +44,7 @@ class ExportXprvState extends State<ExportXprv> {
   Widget _exportWalletContent(BuildContext context) {
     globals.biometricsAuthInProgress = false;
     final theme = Theme.of(context);
+    final extendedTheme = theme.extension<ExtendedTheme>()!;
     Wallet currentWallet =
         Locator.instance.get<ApiDatabase>().walletStorage.currentWallet;
     bool isSingleAddressWallet = currentWallet.walletType == WalletType.single;
@@ -68,6 +70,7 @@ class ExportXprvState extends State<ExportXprv> {
       DashedRect(
           color: Colors.grey,
           strokeWidth: 1.0,
+          textStyle: extendedTheme.monoLargeText,
           gap: 3.0,
           showEye: true,
           blur: !showXprv,

diff --git a/lib/screens/preferences/general_config.dart b/lib/screens/preferences/general_config.dart
@@ -198,7 +198,7 @@ class GeneralConfigState extends State<GeneralConfig> {
           SizedBox(height: 16),
           Text(
             localization.versionNumber(VERSION_NUMBER),
-            style: theme.textTheme.bodySmall,
+            style: theme.textTheme.labelMedium,
           ),
         ]));
   }

diff --git a/lib/screens/receive_transaction/receive_tx_screen.dart b/lib/screens/receive_transaction/receive_tx_screen.dart
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:my_wit_wallet/theme/extended_theme.dart';
 import 'package:my_wit_wallet/util/get_localization.dart';
 import 'package:my_wit_wallet/bloc/explorer/explorer_bloc.dart';
 import 'package:my_wit_wallet/shared/api_database.dart';
@@ -130,6 +131,7 @@ class ReceiveTransactionScreenState extends State<ReceiveTransactionScreen>
   Widget _buildReceiveTransactionScreen() {
     final theme = Theme.of(context);
     ApiDatabase db = Locator.instance.get<ApiDatabase>();
+    final extendedTheme = theme.extension<ExtendedTheme>()!;
 
     return Padding(
         padding: EdgeInsets.only(left: 8, right: 8),
@@ -141,6 +143,7 @@ class ReceiveTransactionScreenState extends State<ReceiveTransactionScreen>
             SizedBox(height: 24),
             DashedRect(
               color: WitnetPallet.brightCyan,
+              textStyle: extendedTheme.monoLargeText,
               strokeWidth: 1.0,
               gap: 3.0,
               text: selectedAccount!.address,

diff --git a/lib/theme/dark_theme.dart b/lib/theme/dark_theme.dart
@@ -49,15 +49,15 @@ TextTheme textTheme = TextTheme(
   displayLarge: titleBold.copyWith(fontSize: 57),
   displayMedium: titleBold.copyWith(fontSize: 45),
   displaySmall: titleBold.copyWith(fontSize: 36),
-  headlineLarge: titleBold.copyWith(fontSize: 32),
-  headlineMedium: titleBold.copyWith(fontSize: 28),
-  headlineSmall: titleBold.copyWith(fontSize: 24),
-  titleLarge: titleBold.copyWith(fontSize: 22),
-  titleMedium: titleBold.copyWith(fontSize: 16),
-  titleSmall: titleBold.copyWith(fontSize: 14),
-  bodyLarge: bodyMedium.copyWith(fontSize: 16, color: WitnetPallet.lightGrey),
-  bodyMedium: bodyMedium.copyWith(fontSize: 14, color: WitnetPallet.lightGrey),
-  bodySmall: bodyMedium.copyWith(fontSize: 12, color: WitnetPallet.lightGrey),
+  headlineLarge: titleMedium.copyWith(fontSize: 32),
+  headlineMedium: titleMedium.copyWith(fontSize: 28),
+  headlineSmall: titleMedium.copyWith(fontSize: 24),
+  titleLarge: titleRegular.copyWith(fontSize: 22),
+  titleMedium: titleRegular.copyWith(fontSize: 16),
+  titleSmall: titleRegular.copyWith(fontSize: 14),
+  bodyLarge: bodyRegular.copyWith(fontSize: 16, color: WitnetPallet.lightGrey),
+  bodyMedium: bodyRegular.copyWith(fontSize: 14, color: WitnetPallet.lightGrey),
+  bodySmall: bodyRegular.copyWith(fontSize: 12, color: WitnetPallet.lightGrey),
   labelLarge: bodyMedium.copyWith(fontSize: 14),
   labelMedium: bodyMedium.copyWith(fontSize: 12),
   labelSmall: bodyMedium.copyWith(fontSize: 11),
@@ -71,7 +71,7 @@ InputDecorationTheme inputDecorationTheme = InputDecorationTheme(
   errorMaxLines: 1,
   hintStyle: bodyRegular
       .copyWith(fontSize: 16)
-      .copyWith(color: bodyRegular.color!.withOpacity(0.5)),
+      .copyWith(color: bodyMedium.color!.withOpacity(0.5)),
   labelStyle: bodyRegular.copyWith(color: WitnetPallet.mediumGrey),
   hoverColor: const Color.fromARGB(9, 255, 255, 255),
   focusColor: WitnetPallet.brightCyanOpacity1,

diff --git a/lib/theme/extended_theme.dart b/lib/theme/extended_theme.dart
@@ -388,7 +388,7 @@ class ExtendedTheme extends ThemeExtension<ExtendedTheme> {
         fontFamily: 'NimbusMono',
         fontWeight: FontWeight.w500,
         color: WitnetPallet.darkGrey,
-        fontSize: 22),
+        fontSize: 18),
     monoBoldText: TextStyle(
         fontFamily: 'NimbusMono',
         fontWeight: FontWeight.w700,

diff --git a/lib/theme/light_theme.dart b/lib/theme/light_theme.dart
@@ -45,21 +45,22 @@ final TextStyle titleExtraBold = o.copyWith(fontWeight: FontWeight.w800);
 final TextStyle titleBlack = o.copyWith(fontWeight: FontWeight.w900);
 
 TextTheme textTheme = TextTheme(
-  displayLarge: titleBold.copyWith(fontSize: 57),
-  displayMedium: titleBold.copyWith(fontSize: 45),
-  displaySmall: titleBold.copyWith(fontSize: 36),
-  headlineLarge: titleBold.copyWith(fontSize: 32),
-  headlineMedium: titleBold.copyWith(fontSize: 28),
-  headlineSmall: titleBold.copyWith(fontSize: 24),
-  titleLarge: titleBold.copyWith(fontSize: 22),
-  titleMedium: titleBold.copyWith(fontSize: 16),
-  titleSmall: titleBold.copyWith(fontSize: 14),
-  bodyLarge: bodyMedium.copyWith(fontSize: 16, color: WitnetPallet.mediumGrey),
-  bodyMedium: bodyMedium.copyWith(fontSize: 14, color: WitnetPallet.mediumGrey),
-  bodySmall: bodyMedium.copyWith(fontSize: 12, color: WitnetPallet.mediumGrey),
-  labelLarge: bodyBold.copyWith(fontSize: 14),
-  labelMedium: bodyBold.copyWith(fontSize: 12),
-  labelSmall: bodyBold.copyWith(fontSize: 11),
+  displayLarge: titleMedium.copyWith(fontSize: 57),
+  displayMedium: titleMedium.copyWith(fontSize: 45),
+  displaySmall: titleMedium.copyWith(fontSize: 36),
+  headlineLarge: titleMedium.copyWith(fontSize: 32),
+  headlineMedium: titleMedium.copyWith(fontSize: 28),
+  headlineSmall: titleMedium.copyWith(fontSize: 24),
+  titleLarge: titleRegular.copyWith(fontSize: 22),
+  titleMedium: titleRegular.copyWith(fontSize: 16),
+  titleSmall: titleRegular.copyWith(fontSize: 14),
+  bodyLarge: bodyRegular.copyWith(fontSize: 16, color: WitnetPallet.mediumGrey),
+  bodyMedium:
+      bodyRegular.copyWith(fontSize: 14, color: WitnetPallet.mediumGrey),
+  bodySmall: bodyRegular.copyWith(fontSize: 12, color: WitnetPallet.mediumGrey),
+  labelLarge: bodyMedium.copyWith(fontSize: 14),
+  labelMedium: bodyMedium.copyWith(fontSize: 12),
+  labelSmall: bodyMedium.copyWith(fontSize: 11),
 );
 
 InputDecorationTheme inputDecorationTheme = InputDecorationTheme(
@@ -144,6 +145,8 @@ TooltipThemeData tooltipTheme = TooltipThemeData(
       borderRadius: BorderRadius.circular(24),
       color: WitnetPallet.lighterGrey,
     ),
+    margin: EdgeInsets.all(8),
+    padding: EdgeInsets.all(16),
     textStyle: bodyRegular.copyWith(color: WitnetPallet.black, fontSize: 12));
 
 ProgressIndicatorThemeData progressIndicatorTheme = ProgressIndicatorThemeData(

diff --git a/lib/widgets/address_list.dart b/lib/widgets/address_list.dart
@@ -7,6 +7,7 @@ import 'package:my_wit_wallet/screens/dashboard/bloc/dashboard_bloc.dart';
 import 'package:my_wit_wallet/shared/api_database.dart';
 import 'package:my_wit_wallet/theme/colors.dart';
 import 'package:my_wit_wallet/theme/extended_theme.dart';
+import 'package:my_wit_wallet/util/extensions/string_extensions.dart';
 import 'package:my_wit_wallet/util/preferences.dart';
 import 'package:my_wit_wallet/util/storage/database/wallet.dart';
 import 'package:my_wit_wallet/util/extensions/num_extensions.dart';
@@ -107,7 +108,7 @@ class AddressListState extends State<AddressList> {
                       children: [
                         Expanded(
                           child: Text(
-                            account.address,
+                            account.address.cropMiddle(18),
                             overflow: TextOverflow.ellipsis,
                             style: textStyle,
                           ),

diff --git a/lib/widgets/dashed_rect.dart b/lib/widgets/dashed_rect.dart
@@ -9,6 +9,7 @@ typedef void VoidCallback();
 class DashedRect extends StatelessWidget {
   final Color color;
   final double strokeWidth;
+  final TextStyle? textStyle;
   final double gap;
   final bool blur;
   final bool showEye;
@@ -18,6 +19,7 @@ class DashedRect extends StatelessWidget {
   DashedRect(
       {this.color = Colors.black,
       this.updateBlur,
+      this.textStyle,
       this.strokeWidth = 1.0,
       this.blur = false,
       this.showEye = false,
@@ -29,6 +31,8 @@ class DashedRect extends StatelessWidget {
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
     final extendedTheme = theme.extension<ExtendedTheme>()!;
+    TextStyle? textStyle =
+        this.textStyle != null ? this.textStyle : theme.textTheme.titleLarge;
     return Container(
         child: Padding(
       padding: EdgeInsets.all(strokeWidth / 2),
@@ -43,13 +47,13 @@ class DashedRect extends StatelessWidget {
                   : Text(
                       text,
                       style: blur
-                          ? extendedTheme.monoLargeText!.copyWith(
+                          ? textStyle!.copyWith(
                               foreground: Paint()
                                 ..style = PaintingStyle.fill
-                                ..color = extendedTheme.monoLargeText!.color!
+                                ..color = textStyle.color!
                                 ..maskFilter =
                                     MaskFilter.blur(BlurStyle.normal, 6))
-                          : extendedTheme.monoLargeText,
+                          : textStyle,
                     )),
           showEye && container == null
               ? Padding(

diff --git a/lib/widgets/info_element.dart b/lib/widgets/info_element.dart
@@ -10,12 +10,14 @@ class InfoElement extends StatelessWidget {
   final Color? color;
   final bool isLastItem;
   final String? copyText;
+  final String? fontFamily;
 
   const InfoElement({
     required this.label,
     required this.text,
     this.plainText = false,
     this.isLastItem = false,
+    this.fontFamily,
     this.url,
     this.color,
     this.copyText,
@@ -31,13 +33,20 @@ class InfoElement extends StatelessWidget {
         ]);
   }
 
+  TextStyle getContentStyle(ThemeData theme) {
+    String? fontFamily = this.fontFamily != null
+        ? this.fontFamily
+        : theme.textTheme.bodyMedium!.fontFamily;
+    Color? color =
+        this.color != null ? this.color : theme.textTheme.bodyMedium!.color;
+    return theme.textTheme.bodyMedium!
+        .copyWith(color: color, fontFamily: fontFamily);
+  }
+
   Widget buildContent(ThemeData theme) {
     return url != null
         ? CustomLink(text: text, url: url ?? '', color: color)
-        : Text(text,
-            style: (color != null
-                ? theme.textTheme.bodyMedium?.copyWith(color: color)
-                : theme.textTheme.bodyMedium));
+        : Text(text, style: getContentStyle(theme));
   }
 
   Widget build(BuildContext context) {

diff --git a/lib/widgets/labeled_form_entry.dart b/lib/widgets/labeled_form_entry.dart
@@ -1,13 +1,12 @@
 import 'package:flutter/material.dart';
-import 'package:my_wit_wallet/util/get_localization.dart';
 
 class LabeledFormEntry extends StatelessWidget {
   LabeledFormEntry({
     Key? key,
-    this.label,
+    required this.label,
     required this.formEntry,
   });
-  final String? label;
+  final String label;
   final Widget formEntry;
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
@@ -16,7 +15,7 @@ class LabeledFormEntry extends StatelessWidget {
         mainAxisSize: MainAxisSize.max,
         children: [
           Text(
-            localization.nameLabel,
+            this.label,
             style: theme.textTheme.labelLarge,
           ),
           SizedBox(height: 8),

diff --git a/lib/widgets/select_wallet_box.dart b/lib/widgets/select_wallet_box.dart
@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:my_wit_wallet/theme/colors.dart';
 import 'package:my_wit_wallet/theme/extended_theme.dart';
+import 'package:my_wit_wallet/util/extensions/string_extensions.dart';
 import 'package:my_wit_wallet/util/storage/database/wallet.dart';
 import 'package:my_wit_wallet/widgets/PaddedButton.dart';
 import 'package:my_wit_wallet/widgets/identicon.dart';
@@ -84,7 +85,7 @@ class SelectWalletBox extends StatelessWidget {
                   ),
                   SizedBox(height: 4),
                   Text(
-                    address,
+                    address.cropMiddle(15),
                     overflow: TextOverflow.ellipsis,
                     style: extendedTheme.monoSmallText,
                   ),