add AccountBalance widget

frontend/lib/features/home/account_balance.dart

@@ -0,0 +1,57 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:flutter_starter/l10n/app_localizations.dart';
+
+class AccountBalance extends HookWidget {
+  const AccountBalance({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.symmetric(horizontal: 20.0),
+      child: Container(
+        decoration: BoxDecoration(
+          border: Border.all(
+              color: Theme.of(context).colorScheme.outline, width: 2.0),
+          borderRadius: BorderRadius.circular(24.0),
+        ),
+        padding: const EdgeInsets.symmetric(horizontal: 20.0, vertical: 16.0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(
+              Loc.of(context).accountBalance,
+              style: Theme.of(context).textTheme.labelMedium,
+            ),
+            const SizedBox(height: 10),
+            Center(
+              child: Text(
+                '\$0.00',
+                style: Theme.of(context).textTheme.displayMedium?.copyWith(
+                      fontWeight: FontWeight.bold,
+                    ),
+              ),
+            ),
+            const SizedBox(height: 20),
+            Row(
+              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+              children: [
+                Expanded(
+                  child: FilledButton(
+                      onPressed: () {}, child: Text(Loc.of(context).deposit)),
+                ),
+                const SizedBox(
+                  width: 20,
+                ),
+                Expanded(
+                  child: FilledButton(
+                      onPressed: () {}, child: Text(Loc.of(context).withdraw)),
+                ),
+              ],
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

frontend/lib/features/home/home_page.dart

@@ -1,5 +1,5 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_starter/features/send/send_page.dart';
+import 'package:flutter_starter/features/home/account_balance.dart';
 import 'package:flutter_starter/l10n/app_localizations.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 
@@ -10,33 +10,10 @@ class HomePage extends HookConsumerWidget {
   Widget build(BuildContext context, WidgetRef ref) {
     return Scaffold(
       appBar: AppBar(title: Text(Loc.of(context).home)),
-      body: Column(
+      body: const Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,
         children: [
-          const SizedBox(height: 40),
-          Text(
-            'Balance: \$0.00 USD',
-            style: Theme.of(context).textTheme.titleLarge,
-            textAlign: TextAlign.center,
-          ),
-          const Spacer(),
-          Row(
-            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
-            children: [
-              FilledButton(
-                  onPressed: () {}, child: Text(Loc.of(context).deposit)),
-              FilledButton(
-                  onPressed: () {
-                    Navigator.of(context).push(MaterialPageRoute(
-                      builder: (context) => const SendPage(),
-                    ));
-                  },
-                  child: Text(Loc.of(context).send)),
-              FilledButton(
-                  onPressed: () {}, child: Text(Loc.of(context).withdraw)),
-            ],
-          ),
-          const SizedBox(height: 40),
+          AccountBalance(),
         ],
       ),
     );