Merge pull request #133 from yaso-meth/NEW--MIH-Icon-Pack

NEW--MIH-Icon-Pack

Frontend/lib/mih_components/mih_package_components/mih_app_tile.dart

@@ -88,7 +88,11 @@ class _MihAppTileState extends State<MihAppTile> {
                       highlightColor: MzanziInnovationHub.of(context)!
                           .theme
                           .highlightColor(),
-                      child: FittedBox(child: widget.appIcon),
+                      child: FittedBox(
+                        fit: BoxFit.fill,
+                        alignment: Alignment.center,
+                        child: widget.appIcon,
+                      ),
                     ),
                   ),
                 );

Frontend/lib/mih_components/mih_package_components/mih_icons.dart

@@ -0,0 +1,23 @@
+import 'package:flutter/widgets.dart'; // You need this import for IconData
+
+class MihIcons {
+  MihIcons._(); // This makes the class non-instantiable (good practice for utility classes)
+
+  // This MUST match the 'family' name you specify in pubspec.yaml
+  static const _mihFontFam = 'MihIcons';
+  // Set to your package name ONLY if this font is part of a separate package you created
+  static const String? _mihFontPkg = null;
+
+  // IconData constant for 'mih_circle_frame' using its code 59392
+  // Note: We use lowerCamelCase for Dart variable names
+  static const IconData mihCircleFrame =
+      IconData(59393, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  // IconData constant for 'mih_logo' using its code 59393
+  static const IconData mihLogo =
+      IconData(59392, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  // IconData constant for 'mzansi_ai_logo' using its code 59394
+  static const IconData mzansiAiLogo =
+      IconData(59394, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+}

Frontend/lib/mih_components/mih_package_components/test/package_test.dart

@@ -1,12 +1,12 @@
 import 'package:mzansi_innovation_hub/main.dart';
-import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_button.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_layout/mih_single_child_scroll.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_action.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_alert.dart';
-import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_tile.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_tools.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_window.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih-app_tool_body.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import 'package:mzansi_innovation_hub/mih_objects/arguments.dart';
 import 'package:flutter/material.dart';
 
@@ -167,7 +167,7 @@ class _PackageTestState extends State<PackageTest> {
     List<MihAppToolBody> toolBodies = [
       MihAppToolBody(
         borderOn: true,
-        bodyItem: SingleChildScrollView(
+        bodyItem: MihSingleChildScroll(
           child: Column(
             mainAxisAlignment: MainAxisAlignment.start,
             mainAxisSize: MainAxisSize.max,
@@ -182,116 +182,22 @@ class _PackageTestState extends State<PackageTest> {
                       MzanziInnovationHub.of(context)!.theme.secondaryColor(),
                 ),
               ),
-              const SizedBox(height: 15),
-              const Divider(),
-              const SizedBox(height: 15),
-              MIHButton(
-                onTap: () {
-                  showAlert();
-                },
-                buttonText: "Test MIH Alert",
-                buttonColor:
-                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                textColor:
-                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              ),
-              const SizedBox(height: 15),
-              MIHButton(
-                onTap: () {
-                  showFullScreenWindow();
-                },
-                buttonText: "Test MIH Window Full Screen",
-                buttonColor:
-                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                textColor:
-                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              ),
-              const SizedBox(height: 15),
-              MIHButton(
-                onTap: () {
-                  showNormalWindow();
-                },
-                buttonText: "Test MIH Window Normal",
-                buttonColor:
-                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                textColor:
-                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              ),
-              const SizedBox(height: 15),
-              MihAppTile(
-                onTap: () {},
-                appName: "Package Tets",
-                appIcon: Icon(
-                  Icons.warning_amber_rounded,
-                  //size: 250,
-                  color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+              const SizedBox(height: 10),
+              Container(
+                color: Colors.black,
+                width: 200,
+                height: 200,
+                padding: EdgeInsets.zero,
+                alignment: Alignment.center,
+                child: IconButton.filled(
+                  onPressed: () {},
+                  icon: Icon(
+                    MihIcons.mihLogo,
+                    color:
+                        MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                  ),
                 ),
-                iconSize: 200,
-                primaryColor:
-                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                secondaryColor:
-                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              ),
-              const SizedBox(height: 15),
-              MihAppTile(
-                onTap: () {},
-                appName: "Package Tets",
-                appIcon: Icon(
-                  Icons.warning_amber_rounded,
-                  //size: 250,
-                  color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                ),
-                iconSize: 200,
-                primaryColor:
-                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                secondaryColor:
-                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              ),
-              const SizedBox(height: 15),
-              MihAppTile(
-                onTap: () {},
-                appName: "Package Tets",
-                appIcon: Icon(
-                  Icons.warning_amber_rounded,
-                  //size: 250,
-                  color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                ),
-                iconSize: 200,
-                primaryColor:
-                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                secondaryColor:
-                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              ),
-              const SizedBox(height: 15),
-              MihAppTile(
-                onTap: () {},
-                appName: "Package Tets",
-                appIcon: Icon(
-                  Icons.warning_amber_rounded,
-                  //size: 250,
-                  color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                ),
-                iconSize: 200,
-                primaryColor:
-                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                secondaryColor:
-                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              ),
-              const SizedBox(height: 15),
-              MihAppTile(
-                onTap: () {},
-                appName: "Package Tets",
-                appIcon: Icon(
-                  Icons.warning_amber_rounded,
-                  //size: 250,
-                  color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                ),
-                iconSize: 200,
-                primaryColor:
-                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                secondaryColor:
-                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              ),
+              )
             ],
           ),
         ),

Frontend/lib/mih_components/mih_profile_picture.dart

@@ -2,6 +2,7 @@ import 'dart:io';
 
 import 'package:file_picker/file_picker.dart';
 import 'package:flutter/material.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import '../../main.dart';
 
 // ignore: must_be_immutable
@@ -14,7 +15,9 @@ class MIHProfilePicture extends StatefulWidget {
   final double radius;
   final bool drawerMode;
   final bool editable;
+  final Color frameColor;
   final onChange;
+
   MIHProfilePicture({
     super.key,
     required this.profilePictureFile,
@@ -25,6 +28,7 @@ class MIHProfilePicture extends StatefulWidget {
     required this.drawerMode,
     required this.editable,
     required this.onChange,
+    required this.frameColor,
   });
 
   @override
@@ -33,16 +37,8 @@ class MIHProfilePicture extends StatefulWidget {
 
 class _MIHProfilePictureState extends State<MIHProfilePicture> {
   late ImageProvider<Object>? propicPreview;
-  //late PlatformFile proPic;
 
   Widget displayEditableProPic() {
-    ImageProvider logoFrame;
-    if (!widget.drawerMode) {
-      logoFrame = MzanziInnovationHub.of(context)!.theme.altLogoFrame();
-    } else {
-      logoFrame = MzanziInnovationHub.of(context)!.theme.logoFrame();
-    }
-
     if (widget.profilePictureFile != null) {
       return Stack(
         alignment: Alignment.center,
@@ -57,7 +53,13 @@ class _MIHProfilePictureState extends State<MIHProfilePicture> {
           ),
           SizedBox(
             width: widget.width,
-            child: Image(image: logoFrame),
+            child: FittedBox(
+              fit: BoxFit.fill,
+              child: Icon(
+                MihIcons.mihCircleFrame,
+                color: widget.frameColor,
+              ),
+            ),
           ),
           Visibility(
             visible: widget.editable,
@@ -134,7 +136,10 @@ class _MIHProfilePictureState extends State<MIHProfilePicture> {
     } else {
       return SizedBox(
         width: widget.width,
-        child: Image(image: logoFrame),
+        child: Icon(
+          MihIcons.mihCircleFrame,
+          color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+        ),
       );
     }
   }

Frontend/lib/mih_packages/about_mih/mih_policy_tos_ext/policy_and_terms_text.dart

@@ -1,5 +1,6 @@
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:flutter/material.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 
 class PolicyAndTermsText {
   List<Widget> getPrivacyPolicyText(BuildContext context) {
@@ -26,8 +27,12 @@ class PolicyAndTermsText {
     return [
       SizedBox(
         width: 165,
-        child:
-            Image(image: MzanziInnovationHub.of(context)!.theme.altLogoImage()),
+        child: FittedBox(
+          child: Icon(
+            MihIcons.mihLogo,
+            color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+          ),
+        ),
       ),
       const SizedBox(height: 10),
       const Text(
@@ -430,8 +435,12 @@ class PolicyAndTermsText {
     return [
       SizedBox(
         width: 165,
-        child:
-            Image(image: MzanziInnovationHub.of(context)!.theme.altLogoImage()),
+        child: FittedBox(
+          child: Icon(
+            MihIcons.mihLogo,
+            color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+          ),
+        ),
       ),
       const SizedBox(
         height: 10,

Frontend/lib/mih_packages/about_mih/package_tools/mih_info.dart

@@ -6,6 +6,7 @@ import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih-
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import "package:universal_html/js.dart" as js;
 import 'package:url_launcher/url_launcher.dart';
 
@@ -248,7 +249,8 @@ class _MihInfoState extends State<MihInfo> {
               CircleAvatar(
                 backgroundColor:
                     MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                backgroundImage: const AssetImage("images/founder.jpg"),
+                backgroundImage: const AssetImage(
+                    "lib/mih_components/mih_package_components/assets/images/founder.jpg"),
                 //'https://media.licdn.com/dms/image/D4D03AQGd1-QhjtWWpA/profile-displayphoto-shrink_400_400/0/1671698053061?e=2147483647&v=beta&t=a3dJI5yxs5-KeXjj10LcNCFuC9IOfa8nNn3k_Qyr0CA'),
                 radius: 75,
               ),
@@ -593,8 +595,12 @@ class _MihInfoState extends State<MihInfo> {
         children: [
           SizedBox(
             width: 165,
-            child: Image(
-                image: MzanziInnovationHub.of(context)!.theme.altLogoImage()),
+            child: FittedBox(
+              child: Icon(
+                MihIcons.mihLogo,
+                color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+              ),
+            ),
           ),
           const SizedBox(
             height: 10,

Frontend/lib/mih_packages/authentication/biometric_check.dart

@@ -4,6 +4,7 @@ import 'package:mzansi_innovation_hub/mih_components/mih_layout/mih_action.dart'
 import 'package:mzansi_innovation_hub/mih_components/mih_layout/mih_body.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_layout/mih_header.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_layout/mih_layout_builder.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import 'package:mzansi_innovation_hub/mih_packages/mih_home/mih_profile_getter.dart';
 import 'package:flutter/material.dart';
 import 'package:local_auth/local_auth.dart';
@@ -32,7 +33,12 @@ class _BiometricCheckState extends State<BiometricCheck> {
         padding: const EdgeInsets.all(10.0),
         child: SizedBox(
           height: 50,
-          child: Image.asset('images/logo_light.png'),
+          child: FittedBox(
+            child: Icon(
+              MihIcons.mihLogo,
+              color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+            ),
+          ),
         ),
       ),
       iconSize: 35,

Frontend/lib/mih_packages/authentication/register.dart

@@ -1,5 +1,6 @@
 import 'dart:convert';
 
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import 'package:mzansi_innovation_hub/mih_objects/arguments.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
@@ -238,13 +239,48 @@ class _RegisterState extends State<Register> {
     });
   }
 
+  MIHAction getSecondaryActionButton() {
+    return MIHAction(
+      icon: Padding(
+        padding: const EdgeInsets.all(10.0),
+        child: SizedBox(
+          width: 150,
+          child: MIHButton(
+            onTap: () {
+              Navigator.of(context).pushNamed(
+                '/about',
+                arguments: 0,
+              );
+            },
+            buttonText: "Install MIH",
+            buttonColor:
+                MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+            textColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+          ),
+        ),
+      ),
+      iconSize: 35,
+      onTap: () {
+        Navigator.of(context).pushNamed(
+          '/about',
+          arguments: 0,
+        );
+      },
+    );
+  }
+
   MIHAction getActionButton() {
     return MIHAction(
       icon: Padding(
         padding: const EdgeInsets.all(10.0),
         child: SizedBox(
           height: 50,
-          child: Image.asset('images/logo_light.png'),
+          child: FittedBox(
+            child: Icon(
+              MihIcons.mihLogo,
+              color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+            ),
+          ),
         ),
       ),
       iconSize: 35,
@@ -440,7 +476,7 @@ class _RegisterState extends State<Register> {
     return MIHLayoutBuilder(
       actionButton: getActionButton(),
       header: getHeader(),
-      secondaryActionButton: null,
+      secondaryActionButton: getSecondaryActionButton(),
       body: getBody(),
       actionDrawer: null,
       secondaryActionDrawer: null,

Frontend/lib/mih_packages/authentication/reset_password.dart

@@ -262,7 +262,8 @@ class _ResetPasswordState extends State<ResetPassword> {
         padding: const EdgeInsets.all(10.0),
         child: SizedBox(
           height: 50,
-          child: Image.asset('images/logo_light.png'),
+          child: Image.asset(
+              'lib/mih_components/mih_package_components/assets/images/logo_light.png'),
         ),
       ),
       iconSize: 35,

Frontend/lib/mih_packages/authentication/signin.dart

@@ -1,5 +1,6 @@
 import 'dart:convert';
 
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import 'package:mzansi_innovation_hub/mih_objects/arguments.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
@@ -286,13 +287,48 @@ class _SignInState extends State<SignIn> {
     );
   }
 
+  MIHAction getSecondaryActionButton() {
+    return MIHAction(
+      icon: Padding(
+        padding: const EdgeInsets.all(10.0),
+        child: SizedBox(
+          width: 150,
+          child: MIHButton(
+            onTap: () {
+              Navigator.of(context).pushNamed(
+                '/about',
+                arguments: 0,
+              );
+            },
+            buttonText: "Install MIH",
+            buttonColor:
+                MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+            textColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+          ),
+        ),
+      ),
+      iconSize: 35,
+      onTap: () {
+        Navigator.of(context).pushNamed(
+          '/about',
+          arguments: 0,
+        );
+      },
+    );
+  }
+
   MIHAction getActionButton() {
     return MIHAction(
       icon: Padding(
         padding: const EdgeInsets.all(10.0),
         child: SizedBox(
           height: 50,
-          child: Image.asset('images/logo_light.png'),
+          child: FittedBox(
+            child: Icon(
+              MihIcons.mihLogo,
+              color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+            ),
+          ),
         ),
       ),
       iconSize: 35,
@@ -631,7 +667,7 @@ class _SignInState extends State<SignIn> {
     return MIHLayoutBuilder(
       actionButton: getActionButton(),
       header: getHeader(),
-      secondaryActionButton: null,
+      secondaryActionButton: getSecondaryActionButton(),
       body: getBody(),
       actionDrawer: null,
       secondaryActionDrawer: null,

Frontend/lib/mih_packages/mih_home/components/mih_app_drawer.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import '../../../main.dart';
 import '../../../mih_objects/app_user.dart';
 import '../../../mih_objects/arguments.dart';
@@ -60,6 +61,7 @@ class _MIHAppDrawerState extends State<MIHAppDrawer> {
           radius: 27,
           drawerMode: true,
           editable: false,
+          frameColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
           onChange: (newProPic) {},
         ),
 
@@ -107,8 +109,6 @@ class _MIHAppDrawerState extends State<MIHAppDrawer> {
   Widget build(BuildContext context) {
     // precacheImage(
     //     MzanziInnovationHub.of(context)!.theme.logoImage().image, context);
-    ImageProvider logoThemeSwitch =
-        MzanziInnovationHub.of(context)!.theme.logoImage();
     return SafeArea(
       child: Drawer(
         //backgroundColor:  MzanziInnovationHub.of(context)!.theme.primaryColor(),
@@ -328,7 +328,11 @@ class _MIHAppDrawerState extends State<MIHAppDrawer> {
                         // Navigator.of(context).popAndPushNamed('/',);
                       });
                     },
-                    child: Image(image: logoThemeSwitch),
+                    child: Icon(
+                      MihIcons.mihLogo,
+                      color:
+                          MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                    ),
                   ),
                   // IconButton(
                   //   onPressed: () {

Frontend/lib/mih_packages/mih_home/mih_home.dart

@@ -1,3 +1,4 @@
+import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_action.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_tools.dart';
@@ -108,6 +109,7 @@ class _MihHomeState extends State<MihHome> {
             radius: 21,
             drawerMode: false,
             editable: false,
+            frameColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
             onChange: (newProPic) {},
           ),
         ),
@@ -158,6 +160,7 @@ class _MihHomeState extends State<MihHome> {
         businessUser: widget.businessUser,
         propicFile: widget.propicFile,
         isUserNew: widget.isUserNew,
+        isDevActive: widget.isDevActive,
       ),
     );
     if (widget.isBusinessUser) {

Frontend/lib/mih_packages/mih_home/mih_home_legacy.dart

@@ -994,6 +994,7 @@ class _MIHHomeLegacyState extends State<MIHHomeLegacy> {
             radius: 21,
             drawerMode: false,
             editable: false,
+            frameColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
             onChange: (newProPic) {},
           ),
         ),

Frontend/lib/mih_packages/mih_home/mih_profile_getter.dart

@@ -37,7 +37,8 @@ class _MIHProfileGetterState extends State<MIHProfileGetter> {
 
   ImageProvider<Object>? isPictureAvailable(String url) {
     if (url == "") {
-      return const AssetImage('images/i-dont-know-2.png');
+      return const AssetImage(
+          'lib/mih_components/mih_package_components/assets/images/i-dont-know-2.png');
     } else if (url != "") {
       return NetworkImage(url);
     } else {

Frontend/lib/mih_packages/mih_home/package_tools/mih_personal_home.dart

@@ -2,6 +2,7 @@ import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_search_input.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_layout/mih_single_child_scroll.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih-app_tool_body.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_tile.dart';
 import 'package:mzansi_innovation_hub/mih_objects/app_user.dart';
 import 'package:mzansi_innovation_hub/mih_objects/arguments.dart';
 import 'package:mzansi_innovation_hub/mih_objects/business.dart';
@@ -25,6 +26,7 @@ class MihPersonalHome extends StatefulWidget {
   final BusinessUser? businessUser;
   final ImageProvider<Object>? propicFile;
   final bool isUserNew;
+  final bool isDevActive;
 
   const MihPersonalHome({
     super.key,
@@ -34,6 +36,7 @@ class MihPersonalHome extends StatefulWidget {
     required this.businessUser,
     required this.propicFile,
     required this.isUserNew,
+    required this.isDevActive,
   });
 
   @override
@@ -124,6 +127,28 @@ class _MihPersonalHomeState extends State<MihPersonalHome> {
     });
     //=============== About MIH ===============
     temp.add({"About MIH": AboutMihTile(packageSize: packageSize)});
+    //=============== Dev ===============
+    temp.add({
+      "test": MihAppTile(
+        onTap: () {
+          Navigator.of(context).pushNamed(
+            '/package-dev',
+            //arguments: widget.signedInUser,
+          );
+        },
+        appName: "Test",
+        appIcon: Container(
+          padding: const EdgeInsets.all(0.5),
+          child: Icon(
+            Icons.warning_amber_rounded,
+            color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+          ),
+        ),
+        iconSize: packageSize,
+        primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+        secondaryColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+      )
+    });
     return temp;
   }
 

Frontend/lib/mih_packages/mzansi_ai/package_tiles/mzansi_ai_tile.dart

@@ -1,5 +1,6 @@
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_tile.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import 'package:mzansi_innovation_hub/mih_objects/app_user.dart';
 import 'package:flutter/material.dart';
 
@@ -20,7 +21,6 @@ class MzansiAiTile extends StatefulWidget {
 class _MzansiAiTileState extends State<MzansiAiTile> {
   @override
   Widget build(BuildContext context) {
-    ImageProvider aiLogo = MzanziInnovationHub.of(context)!.theme.aiLogoImage();
     return MihAppTile(
       onTap: () {
         Navigator.of(context).pushNamed(
@@ -30,8 +30,18 @@ class _MzansiAiTileState extends State<MzansiAiTile> {
       },
       appName: "Mzansi AI",
       appIcon: Container(
-        padding: const EdgeInsets.all(25),
-        child: Image(image: aiLogo),
+        padding: const EdgeInsets.all(1),
+        alignment: Alignment.center,
+        // color: Colors.black,
+        child: FittedBox(
+          fit: BoxFit.contain,
+          child: Icon(
+            MihIcons.mzansiAiLogo,
+            color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+            // size: widget.packageSize,
+          ),
+        ),
+        // child: Image(image: logo),
       ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/lib/mih_packages/mzansi_profile/personal_profile/package_tiles/mzansi_profile_tile.dart

@@ -1,5 +1,6 @@
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_tile.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import 'package:mzansi_innovation_hub/mih_objects/app_user.dart';
 import 'package:mzansi_innovation_hub/mih_objects/arguments.dart';
 import 'package:flutter/material.dart';
@@ -23,7 +24,7 @@ class MzansiProfileTile extends StatefulWidget {
 class _MzansiProfileTileState extends State<MzansiProfileTile> {
   @override
   Widget build(BuildContext context) {
-    ImageProvider logo = MzanziInnovationHub.of(context)!.theme.logoImage();
+    // ImageProvider logo = MzanziInnovationHub.of(context)!.theme.logoImage();
     return MihAppTile(
       onTap: () {
         Navigator.of(context).pushNamed(
@@ -36,8 +37,18 @@ class _MzansiProfileTileState extends State<MzansiProfileTile> {
       },
       appName: "Mzansi Profile",
       appIcon: Container(
-        padding: const EdgeInsets.all(25),
-        child: Image(image: logo),
+        padding: const EdgeInsets.all(1),
+        alignment: Alignment.center,
+        // color: Colors.black,
+        child: FittedBox(
+          fit: BoxFit.contain,
+          child: Icon(
+            MihIcons.mihLogo,
+            color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+            // size: widget.packageSize,
+          ),
+        ),
+        // child: Image(image: logo),
       ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/lib/mih_packages/mzansi_profile/personal_profile/package_tiles/mzansi_setup_profile_tile.dart

@@ -1,5 +1,6 @@
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_tile.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 import 'package:mzansi_innovation_hub/mih_objects/app_user.dart';
 import 'package:mzansi_innovation_hub/mih_objects/arguments.dart';
 import 'package:flutter/material.dart';
@@ -23,7 +24,6 @@ class MzansiSetupProfileTile extends StatefulWidget {
 class _MzansiSetupProfileTileState extends State<MzansiSetupProfileTile> {
   @override
   Widget build(BuildContext context) {
-    ImageProvider logo = MzanziInnovationHub.of(context)!.theme.logoImage();
     return MihAppTile(
       onTap: () {
         Navigator.of(context).pushNamed(
@@ -36,8 +36,15 @@ class _MzansiSetupProfileTileState extends State<MzansiSetupProfileTile> {
       },
       appName: "Setup Profile",
       appIcon: Container(
-        padding: const EdgeInsets.all(25),
-        child: Image(image: logo),
+        padding: const EdgeInsets.all(1),
+        child: FittedBox(
+          fit: BoxFit.contain,
+          child: Icon(
+            MihIcons.mihLogo,
+            color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+            // size: widget.packageSize,
+          ),
+        ),
       ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/lib/mih_packages/mzansi_profile/personal_profile/package_tools/mih_personal_profile.dart

@@ -266,6 +266,7 @@ class _MihPersonalProfileState extends State<MihPersonalProfile> {
             radius: 70,
             drawerMode: false,
             editable: true,
+            frameColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
             onChange: (newProPic) {
               setState(() {
                 proPic = newProPic;

Frontend/lib/mih_packages/mzansi_wallet/components/mih_card_display.dart

@@ -17,43 +17,62 @@ class _MihCardDisplayState extends State<MihCardDisplay> {
   Widget displayLoyaltyCard() {
     switch (widget.shopName.toLowerCase()) {
       case "apple tree":
-        return Image.asset('images/loyalty_cards/apple_tree.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/apple_tree.png');
       case "best before":
-        return Image.asset('images/loyalty_cards/best_before.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/best_before.png');
       case "checkers":
-        return Image.asset('images/loyalty_cards/checkers.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/checkers.png');
       case "clicks":
-        return Image.asset('images/loyalty_cards/Clicks_Club.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/Clicks_Club.png');
       case "cotton:on":
-        return Image.asset('images/loyalty_cards/cotton_on_perks.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/cotton_on_perks.png');
       case "dis-chem":
-        return Image.asset('images/loyalty_cards/dischem_benefit.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/dischem_benefit.png');
       case "pick n pay":
-        return Image.asset('images/loyalty_cards/pnp_smart.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/pnp_smart.png');
       case "shoprite":
-        return Image.asset('images/loyalty_cards/shoprite.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/shoprite.png');
       case "spar":
-        return Image.asset('images/loyalty_cards/spar_rewards.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/spar_rewards.png');
       case "woolworths":
-        return Image.asset('images/loyalty_cards/wrewards.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/wrewards.png');
       case "makro":
-        return Image.asset('images/loyalty_cards/makro.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/makro.png');
       case "fresh stop":
-        return Image.asset('images/loyalty_cards/fresh_stop.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/fresh_stop.png');
       case "panarottis":
-        return Image.asset('images/loyalty_cards/panarottis.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/panarottis.png');
       case "shell":
-        return Image.asset('images/loyalty_cards/Shell.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/Shell.png');
       case "edgars":
-        return Image.asset('images/loyalty_cards/edgars.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/edgars.png');
       case "jet":
-        return Image.asset('images/loyalty_cards/jet.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/jet.png');
       case "spur":
-        return Image.asset('images/loyalty_cards/spur.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/spur.png');
       case "infinity":
-        return Image.asset('images/loyalty_cards/infinity.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/infinity.png');
       case "eskom":
-        return Image.asset('images/loyalty_cards/eskom.png');
+        return Image.asset(
+            'lib/mih_components/mih_package_components/assets/images/loyalty_cards/eskom.png');
       default:
         return const Placeholder();
     }

Frontend/lib/mih_theme/mih_theme.dart

@@ -161,11 +161,11 @@ class MihTheme {
   AssetImage logoFrame() {
     if (mode == "Dark") {
       return const AssetImage(
-        'images/frame_dark.png',
+        'lib/mih_components/mih_package_components/assets/images/frame_dark.png',
       );
     } else {
       return const AssetImage(
-        'images/frame_light.png',
+        'lib/mih_components/mih_package_components/assets/images/frame_light.png',
       );
     }
   }
@@ -173,11 +173,11 @@ class MihTheme {
   AssetImage altLogoFrame() {
     if (mode == "Light") {
       return const AssetImage(
-        'images/frame_dark.png',
+        'lib/mih_components/mih_package_components/assets/images/frame_dark.png',
       );
     } else {
       return const AssetImage(
-        'images/frame_light.png',
+        'lib/mih_components/mih_package_components/assets/images/frame_light.png',
       );
     }
   }
@@ -185,11 +185,11 @@ class MihTheme {
   AssetImage logoImage() {
     if (mode == "Dark") {
       return const AssetImage(
-        'images/logo_dark.png',
+        'lib/mih_components/mih_package_components/assets/images/logo_dark.png',
       );
     } else {
       return const AssetImage(
-        'images/logo_light.png',
+        'lib/mih_components/mih_package_components/assets/images/logo_light.png',
       );
     }
   }
@@ -197,11 +197,11 @@ class MihTheme {
   AssetImage altLogoImage() {
     if (mode == "Light") {
       return const AssetImage(
-        'images/logo_dark.png',
+        'lib/mih_components/mih_package_components/assets/images/logo_dark.png',
       );
     } else {
       return const AssetImage(
-        'images/logo_light.png',
+        'lib/mih_components/mih_package_components/assets/images/logo_light.png',
       );
     }
   }
@@ -209,11 +209,11 @@ class MihTheme {
   AssetImage loadingImage() {
     if (mode == "Dark") {
       loading = const AssetImage(
-        'images/loading_light.gif',
+        'lib/mih_components/mih_package_components/assets/images/loading_light.gif',
       );
     } else {
       loading = const AssetImage(
-        'images/loading_dark.gif',
+        'lib/mih_components/mih_package_components/assets/images/loading_dark.gif',
       );
     }
     return loading;
@@ -222,11 +222,11 @@ class MihTheme {
   AssetImage altLoadingImage() {
     if (mode == "Dark") {
       loading = const AssetImage(
-        'images/loading_dark.gif',
+        'lib/mih_components/mih_package_components/assets/images/loading_dark.gif',
       );
     } else {
       loading = const AssetImage(
-        'images/loading_light.gif',
+        'lib/mih_components/mih_package_components/assets/images/loading_light.gif',
       );
     }
     return loading;
@@ -234,18 +234,22 @@ class MihTheme {
 
   String loadingImageLocation() {
     if (mode == "Dark") {
-      loadingAssetText = 'images/loading_light.gif';
+      loadingAssetText =
+          'lib/mih_components/mih_package_components/assets/images/loading_light.gif';
     } else {
-      loadingAssetText = 'images/loading_dark.gif';
+      loadingAssetText =
+          'lib/mih_components/mih_package_components/assets/images/loading_dark.gif';
     }
     return loadingAssetText;
   }
 
   String altLoadingImageLocation() {
     if (mode == "Dark") {
-      loadingAssetText = 'images/loading_dark.gif';
+      loadingAssetText =
+          'lib/mih_components/mih_package_components/assets/images/loading_dark.gif';
     } else {
-      loadingAssetText = 'images/loading_light.gif';
+      loadingAssetText =
+          'lib/mih_components/mih_package_components/assets/images/loading_light.gif';
     }
     return loadingAssetText;
   }
@@ -253,11 +257,11 @@ class MihTheme {
   AssetImage aiLogoImage() {
     if (mode == "Dark") {
       return const AssetImage(
-        'images/mzansi_ai-dark.png',
+        'lib/mih_components/mih_package_components/assets/images/mzansi_ai-dark.png',
       );
     } else {
       return const AssetImage(
-        'images/mzansi_ai-light.png',
+        'lib/mih_components/mih_package_components/assets/images/mzansi_ai-light.png',
       );
     }
   }

Frontend/pubspec.yaml

@@ -101,10 +101,11 @@ flutter:
 
   # To add assets to your application, add an assets section, like this:
   assets:
-    - images/
-    - images/loyalty_cards/
-    - images/app_icon/
-    - images/splash_screen/
+    - lib/mih_components/mih_package_components/assets/images/
+    - lib/mih_components/mih_package_components/assets/fonts/
+    - lib/mih_components/mih_package_components/assets/images/loyalty_cards/
+    - lib/mih_components/mih_package_components/assets/images/app_icon/
+    - lib/mih_components/mih_package_components/assets/images/splash_screen/
     # - images/a_dot_ham.jpeg
 
   # An image asset can refer to one or more resolution-specific "variants", see
@@ -118,10 +119,10 @@ flutter:
   # "family" key with the font family name, and a "fonts" key with a
   # list giving the asset and other descriptors for the font. For
   # example:
-  # fonts:
-  #   - family: Schyler
-  #     fonts:
-  #       - asset: fonts/Schyler-Regular.ttf
+  fonts:
+    - family: MihIcons
+      fonts:
+        - asset: lib/mih_components/mih_package_components/assets/fonts/MihIcons.ttf
   #       - asset: fonts/Schyler-Italic.ttf
   #         style: italic
   #   - family: Trajan Pro
@@ -156,12 +157,12 @@ flutter_native_splash:
 
   # The image parameter allows you to specify an image used in the splash screen.  It must be a
   # png file and should be sized for 4x pixel density.
-  image: images/logo_light.png
+  image: lib/mih_components/mih_package_components/assets/images/logo_light.png
 
   # The branding property allows you to specify an image used as branding in the splash screen.
   # It must be a png file. It is supported for Android, iOS and the Web.  For Android 12,
   # see the Android 12 section below.
-  branding: images/branding_text.png
+  branding: lib/mih_components/mih_package_components/assets/images/branding_text.png
 
   # To position the branding image at the bottom of the screen you can use bottom, bottomRight,
   # and bottomLeft. The default values is bottom if not specified or specified something else.
@@ -191,7 +192,7 @@ flutter_native_splash:
     # 640 pixels in diameter.
     # App icon without an icon background: This should be 1152×1152 pixels, and fit within a circle
     # 768 pixels in diameter.
-    image: images/splash_screen/splash_screen_icon.png
+    image: lib/mih_components/mih_package_components/assets/images/splash_screen/splash_screen_icon.png
 
     # Splash screen background color.
     color: "#3A4454"
@@ -200,7 +201,7 @@ flutter_native_splash:
     #icon_background_color: "#111111"
 
     # The branding property allows you to specify an image used as branding in the splash screen.
-    branding: images/branding_text.png
+    branding: lib/mih_components/mih_package_components/assets/images/branding_text.png
 
     # The image_dark, color_dark, icon_background_color_dark, and branding_dark set values that
     # apply when the device is in dark mode. If they are not specified, the app will use the