(style): redesign Transaction Details View

lib/l10n/app_en.arb

@@ -179,7 +179,7 @@
 	"feesCollected": "Fees collected",
 	"feesPayed": "Fees payed",
 	"forgetPassword": "Did you forget your password?, You can delete your wallet and configure a new one!",
-	"from": "from",
+	"from": "From",
 	"generateAddressWarning": "You are about to generate a new address",
 	"generateAddressWarningMessage": "A new address will be generated and ready to be used. The main address displayed in the navigation will be updated to the new one.",
 	"genNewAddressLabel": "Generate new Address",
@@ -282,6 +282,7 @@
 	"timelockTooltip": "The recipient will not be able to spend the coins before this date and time.",
 	"timestamp": "Timestamp",
 	"to": "To",
+	"total": "Total",
 	"totalFeesPaid": "Total fees paid",
 	"totalMiningRewards": "Total mining rewards",
 	"transaction": "Transaction",
@@ -314,6 +315,7 @@
 	"validationMinFee": "Fee should be higher than",
 	"validationNoZero": "Amount cannot be zero",
 	"valueTransferTxn": "Value Transfer",
+	"viewOnExplorer": "View on Block Explorer",
 	"verifyLabel": "Verify",
 	"versionNumber": "Version {versionNumber}",
 	"vttException": "Error building the transaction",

lib/l10n/app_es.arb

@@ -282,6 +282,7 @@
 	"timelockTooltip": "El beneficiario no podrá gastar las monedas antes de esa fecha y hora.",
 	"timestamp": "Marca de tiempo",
 	"to": "a",
+	"total": "Total",
 	"totalFeesPaid": "Total de tasas pagadas",
 	"totalMiningRewards": "Recompensas mineras totales",
 	"transaction": "Transacción",
@@ -314,6 +315,7 @@
 	"validationMinFee": "La tarifa de minado tiene que ser mayor que",
 	"validationNoZero": "La cantidad no puede ser cero",
 	"valueTransferTxn": "Value Transfer",
+	"viewOnExplorer": "Ver en el Explorador de Bloques",
 	"verifyLabel": "Verificar",
 	"versionNumber": "Versión {versionNumber}",
 	"vttException": "Error creando la transacción",

lib/util/extensions/string_extensions.dart

@@ -5,14 +5,20 @@ extension StringExtension on String {
 
   String cropMiddle(int length) {
     if (this.length > length) {
-      var leftSizeLengh = ((length - 3) / 2).floor();
-      var rightSizeLength = this.length - leftSizeLengh;
-      return '${this.substring(0, leftSizeLengh)}...${this.substring(rightSizeLength)}';
+      var leftSizeLength = ((length - 3) / 2).floor();
+      var rightSizeLength = this.length - leftSizeLength;
+      return '${this.substring(0, leftSizeLength)}…${this.substring(rightSizeLength)}';
     } else {
       return '';
     }
   }
 
+  String cropAddress(int length) {
+    var leftSizeLength = 4;
+    var rightSizeLength = (length < 6) ? this.length - 6 : this.length - length;
+    return '${this.substring(0, leftSizeLength)}…${this.substring(rightSizeLength)}';
+  }
+
   String fromPascalCaseToTitle() {
     final result = this.split(RegExp('(?=[A-Z])'));
     return result.join(' ').toLowerCase().capitalize();

lib/util/transactions_list/get_transaction_address.dart

@@ -10,10 +10,10 @@ String getTransactionAddress(
     return 'genesis';
   else if (label == localization.from && inputs.length > 0) {
     // Set sender address
-    address = inputs[0].address.cropMiddle(18);
+    address = inputs[0].address.cropAddress(12);
   } else if (outputs.length > 0) {
     // Set recipient address
-    address = outputs[0].pkh.address.cropMiddle(18);
+    address = outputs[0].pkh.address.cropAddress(12);
   }
   return address;
 }

lib/widgets/PaddedButton.dart

@@ -52,7 +52,8 @@ class PaddedButton extends StatelessWidget {
       this.darkBackground = false,
       this.alignment = MainAxisAlignment.center,
       this.iconPosition = IconPosition.right,
-      this.autofocus});
+      this.autofocus,
+      this.hoverPadding});
 
   final EdgeInsets padding;
   final bool sizeCover;
@@ -73,6 +74,7 @@ class PaddedButton extends StatelessWidget {
   final double? fontSize;
   final MainAxisAlignment alignment;
   final IconPosition iconPosition;
+  final num? hoverPadding;
 
   @override
   Widget build(BuildContext context) {
@@ -177,10 +179,10 @@ class PaddedButton extends StatelessWidget {
       ]),
       onPressed: onPressed,
     );
-
+    num _localHoverPad = hoverPadding ?? 22;
     Widget iconButton = SizedBox(
-        height: iconSize + 22,
-        width: iconSize + 22,
+        height: iconSize + _localHoverPad,
+        width: iconSize + _localHoverPad,
         child: TextButton(
           style: color != null
               ? theme.textButtonTheme.style?.copyWith(

lib/widgets/closable_view.dart

@@ -32,7 +32,7 @@ class ClosableView extends StatelessWidget {
                   ),
                   onPressed: this.closeSetting)),
           Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
-            SizedBox(height: 24),
+            SizedBox(height: 8),
             ...this.children,
             SizedBox(height: 16),
           ])

lib/widgets/copy_button.dart

@@ -36,6 +36,7 @@ class CopyButtonState extends State<CopyButton> {
             ? extendedTheme.headerTextColor
             : theme.textTheme.bodyMedium!.color,
         iconSize: 12,
+        hoverPadding: 0,
         onPressed: () async {
           if (!isAddressCopied) {
             await Clipboard.setData(ClipboardData(text: widget.copyContent));

lib/widgets/identicon.dart

@@ -3,6 +3,9 @@ import 'dart:math';
 import 'package:flutter/material.dart';
 import 'package:fixnum/fixnum.dart';
 
+import 'package:my_wit_wallet/theme/colors.dart';
+import 'package:my_wit_wallet/theme/extended_theme.dart';
+
 /// Identicon widget with customized painter
 ///
 /// [size] - number of blocks on x and y axis
@@ -168,3 +171,23 @@ class WiticonPainter extends CustomPainter {
   // PRIVATE:
   List<int> _randSeed = [];
 }
+
+Widget identiconContainer(ExtendedTheme extendedTheme, String seed) {
+  return Container(
+    decoration: BoxDecoration(
+        color: WitnetPallet.black,
+        border: Border.all(color: WitnetPallet.transparent),
+        borderRadius: BorderRadius.all(extendedTheme.borderRadius!)),
+    child: ClipRRect(
+      borderRadius: BorderRadius.all(extendedTheme.borderRadius!),
+      child: Container(
+        decoration: BoxDecoration(
+            color: WitnetPallet.black,
+            border: Border.all(color: WitnetPallet.black)),
+        width: 20,
+        height: 20,
+        child: Identicon(seed: seed, size: 8),
+      ),
+    ),
+  );
+}

lib/widgets/link.dart

@@ -6,9 +6,10 @@ class CustomLink extends StatelessWidget {
   final String text;
   final String url;
   final Color? color;
+  final TextStyle? style;
 
   const CustomLink(
-      {required this.text, required this.url, required this.color});
+      {required this.text, required this.url, required this.color, this.style});
 
   _launchUrl(String searchItem) async {
     try {
@@ -27,12 +28,13 @@ class CustomLink extends StatelessWidget {
         cursor: SystemMouseCursors.click,
         child: GestureDetector(
           child: Padding(
-              padding: EdgeInsets.only(right: 8),
+              padding: EdgeInsets.zero,
               child: Text(text,
-                  style: extendedTheme.monoBoldText!.copyWith(
-                      color: contentColor,
-                      decorationColor: contentColor,
-                      decoration: TextDecoration.underline))),
+                  style: style ??
+                      extendedTheme.monoBoldText!.copyWith(
+                          color: contentColor,
+                          decorationColor: contentColor,
+                          decoration: TextDecoration.underline))),
           onTap: () => {_launchUrl(url)},
         ));
   }