Merge pull request #167 from yaso-meth/NEW--Mih-Icons-Added

NEW--Mih-Icons-Added

Frontend/lib/mih_components/mih_package_components/assets/fonts/icomoon_link.txt

@@ -0,0 +1 @@
+/* Mih Icons  - https://icomoon.io/*/

Frontend/lib/mih_components/mih_package_components/assets/fonts/style.css

@@ -0,0 +1,83 @@
+@font-face {
+  font-family: 'Mih_Icons';
+  src: url('fonts/Mih_Icons.eot?h906ip');
+  src: url('fonts/Mih_Icons.eot?h906ip#iefix') format('embedded-opentype'),
+    url('fonts/Mih_Icons.ttf?h906ip') format('truetype'),
+    url('fonts/Mih_Icons.woff?h906ip') format('woff'),
+    url('fonts/Mih_Icons.svg?h906ip#Mih_Icons') format('svg');
+  font-weight: normal;
+  font-style: normal;
+  font-display: block;
+}
+
+[class^="icon-"],
+[class*=" icon-"] {
+  /* use !important to prevent issues with browser extensions that change fonts */
+  font-family: 'Mih_Icons' !important;
+  /* speak: never; */
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
+
+  /* Better Font Rendering =========== */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-i_dont_know:before {
+  content: "\e90d";
+}
+
+.icon-business_setup:before {
+  content: "\e90b";
+}
+
+.icon-profile_setup:before {
+  content: "\e90c";
+}
+
+.icon-mih_ring:before {
+  content: "\e90a";
+}
+
+.icon-about_mih:before {
+  content: "\e900";
+}
+
+.icon-access_control:before {
+  content: "\e901";
+}
+
+.icon-business_profile:before {
+  content: "\e902";
+}
+
+.icon-calculator:before {
+  content: "\e903";
+}
+
+.icon-calendar:before {
+  content: "\e904";
+}
+
+.icon-mih_logo:before {
+  content: "\e905";
+}
+
+.icon-mzansi_ai:before {
+  content: "\e906";
+}
+
+.icon-mzansi_wallet:before {
+  content: "\e907";
+}
+
+.icon-patient_manager:before {
+  content: "\e908";
+}
+
+.icon-patient_profile:before {
+  content: "\e909";
+}

Frontend/lib/mih_components/mih_package_components/mih_app.dart

@@ -101,7 +101,7 @@ class _MihAppState extends State<MihApp> with SingleTickerProviderStateMixin {
         drawer: widget.actionDrawer,
         body: SafeArea(
           bottom: false,
-          minimum: EdgeInsets.only(bottom: 5),
+          minimum: EdgeInsets.only(bottom: 0),
           child: Container(
             width: screenSize.width,
             height: screenSize.height,

Frontend/lib/mih_components/mih_package_components/mih_app_tile.dart

@@ -50,72 +50,50 @@ class _MihAppTileState extends State<MihAppTile> {
 
   @override
   Widget build(BuildContext context) {
-    double borderRadius = widget.iconSize * 0.15;
     return Container(
-      alignment: Alignment.topCenter,
+      // alignment: Alignment.topCenter,
       // color: Colors.black,
       // width: widget.iconSize,
       // height: widget.iconSize + widget.iconSize / 3,
-      child: Column(
+      child: GestureDetector(
-        children: [
+        onTap: widget.onTap,
-          Flexible(
+        onLongPress: null, // Do this later
-            flex: 3,
+        child: Column(
-            child: LayoutBuilder(
+          children: [
-              builder: (context, constraints) {
+            Flexible(
-                double iconHeight = constraints.maxWidth;
+              flex: 3,
-                return AnimatedContainer(
+              child: LayoutBuilder(
-                  height: iconHeight,
+                builder: (context, constraints) {
-                  duration: const Duration(seconds: 2),
+                  double iconHeight = constraints.maxWidth;
-                  child: Material(
+                  return Container(
-                    color: widget.primaryColor,
+                    width: iconHeight,
-                    // shadowColor:
+                    height: iconHeight,
-                    //     MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                    child:
-                    // elevation: 5,
+                        FittedBox(fit: BoxFit.fitHeight, child: widget.appIcon),
-                    borderRadius: BorderRadius.circular(borderRadius),
+                  );
-                    child: InkWell(
+                },
-                      borderRadius: BorderRadius.circular(borderRadius),
-                      // ho
-                      onTap: widget.onTap,
-                      onLongPress: () {
-                        displayHint();
-                      },
-                      // hoverDuration: ,
-                      splashColor: MzanziInnovationHub.of(context)!
-                          .theme
-                          .highlightColor(),
-                      highlightColor: MzanziInnovationHub.of(context)!
-                          .theme
-                          .highlightColor(),
-                      child: FittedBox(
-                        fit: BoxFit.fill,
-                        alignment: Alignment.center,
-                        child: widget.appIcon,
-                      ),
-                    ),
-                  ),
-                );
-              },
-            ),
-          ),
-          const SizedBox(height: 10),
-          Flexible(
-            flex: 1,
-            child: FittedBox(
-              child: Text(
-                widget.appName,
-                textAlign: TextAlign.center,
-                // softWrap: true,
-                // overflow: TextOverflow.visible,
-                style: TextStyle(
-                  color:
-                      MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                  fontSize: 20.0,
-                  fontWeight: FontWeight.bold,
-                ),
               ),
             ),
-          )
+            const SizedBox(height: 10),
-        ],
+            Flexible(
+              flex: 1,
+              child: FittedBox(
+                child: Text(
+                  widget.appName,
+                  textAlign: TextAlign.center,
+                  // softWrap: true,
+                  // overflow: TextOverflow.visible,
+                  style: TextStyle(
+                    color:
+                        MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                    fontSize: 20.0,
+                    fontWeight: FontWeight.bold,
+                  ),
+                ),
+              ),
+            )
+          ],
+        ),
       ),
     );
   }

Frontend/lib/mih_components/mih_package_components/mih_circle_avatar.dart

@@ -78,7 +78,7 @@ class _MihCircleAvatarState extends State<MihCircleAvatar> {
             fit: BoxFit.fill,
             child: Icon(
               size: widget.width,
-              MihIcons.mihCircleFrame,
+              MihIcons.mihRing,
               color: widget.frameColor,
             ),
           ),

Frontend/lib/mih_components/mih_package_components/mih_icons.dart

@@ -8,16 +8,49 @@ class 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
+// IconData constants based on your style.css file
-  // Note: We use lowerCamelCase for Dart variable names
+  // Note: We convert the hex code from CSS (\eXXX) to an integer (0xeXXX)
-  static const IconData mihCircleFrame =
-      IconData(59393, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
 
-  // IconData constant for 'mih_logo' using its code 59393
+  static const IconData aboutMih =
+      IconData(0xe900, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  static const IconData accessControl =
+      IconData(0xe901, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  static const IconData businessProfile =
+      IconData(0xe902, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  static const IconData calculator =
+      IconData(0xe903, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  static const IconData calendar =
+      IconData(0xe904, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  // Note: Updated codepoint for mih_logo based on CSS (\e905)
   static const IconData mihLogo =
-      IconData(59392, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+      IconData(0xe905, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
 
-  // IconData constant for 'mzansi_ai_logo' using its code 59394
+  // Note: Updated codepoint and name for mzansi_ai based on CSS (\e906)
-  static const IconData mzansiAiLogo =
+  static const IconData mzansiAi =
-      IconData(59394, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+      IconData(0xe906, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  // Note: Added mzansi_wallet based on CSS (\e907)
+  static const IconData mzansiWallet =
+      IconData(0xe907, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  static const IconData patientManager =
+      IconData(0xe908, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  static const IconData patientProfile =
+      IconData(0xe909, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  // Added the new icon 'mih_ring' from your updated CSS (\e90a)
+  static const IconData mihRing =
+      IconData(0xe90a, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  static const IconData profileSetup =
+      IconData(0xe90c, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
+
+  static const IconData businessSetup =
+      IconData(0xe90b, fontFamily: _mihFontFam, fontPackage: _mihFontPkg);
 }

Frontend/lib/mih_components/mih_profile_picture.dart

@@ -1,160 +0,0 @@
-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
-class MIHProfilePicture extends StatefulWidget {
-  final ImageProvider<Object>? profilePictureFile;
-  final TextEditingController proPicController;
-
-  PlatformFile? proPic;
-  final double width;
-  final double radius;
-  final bool drawerMode;
-  final bool editable;
-  final Color frameColor;
-  final onChange;
-
-  MIHProfilePicture({
-    super.key,
-    required this.profilePictureFile,
-    required this.proPicController,
-    required this.proPic,
-    required this.width,
-    required this.radius,
-    required this.drawerMode,
-    required this.editable,
-    required this.onChange,
-    required this.frameColor,
-  });
-
-  @override
-  State<MIHProfilePicture> createState() => _MIHProfilePictureState();
-}
-
-class _MIHProfilePictureState extends State<MIHProfilePicture> {
-  late ImageProvider<Object>? propicPreview;
-
-  Widget displayEditableProPic() {
-    if (widget.profilePictureFile != null) {
-      return Stack(
-        alignment: Alignment.center,
-        fit: StackFit.loose,
-        children: [
-          CircleAvatar(
-            backgroundColor:
-                MzanziInnovationHub.of(context)!.theme.primaryColor(),
-            backgroundImage: propicPreview,
-            //'https://media.licdn.com/dms/image/D4D03AQGd1-QhjtWWpA/profile-displayphoto-shrink_400_400/0/1671698053061?e=2147483647&v=beta&t=a3dJI5yxs5-KeXjj10LcNCFuC9IOfa8nNn3k_Qyr0CA'),
-            radius: widget.radius,
-          ),
-          SizedBox(
-            width: widget.width,
-            child: FittedBox(
-              fit: BoxFit.fill,
-              child: Icon(
-                MihIcons.mihCircleFrame,
-                color: widget.frameColor,
-              ),
-            ),
-          ),
-          Visibility(
-            visible: widget.editable,
-            child: Positioned(
-              bottom: 0,
-              right: 0,
-              child: IconButton.filled(
-                onPressed: () async {
-                  try {
-                    // print(
-                    //     "Platform: ${MzanziInnovationHub.of(context)!.theme.getPlatform()}");
-                    FilePickerResult? result =
-                        await FilePicker.platform.pickFiles(
-                      type: FileType.image,
-                    );
-
-                    if (MzanziInnovationHub.of(context)!.theme.getPlatform() ==
-                        "Web") {
-                      if (result == null) return;
-                      final selectedFile = result.files.first;
-                      setState(() {
-                        widget.onChange(selectedFile);
-                        widget.proPic = selectedFile;
-                        //print("MIH Profile Picture: ${widget.proPic}");
-                        propicPreview = MemoryImage(widget.proPic!.bytes!);
-                      });
-
-                      setState(() {
-                        widget.proPicController.text = selectedFile.name;
-                      });
-                    } else {
-                      // print(
-                      //     "================\nHere for Android & IOS\n========================");
-                      if (result != null) {
-                        // print("here 1");
-                        File file = File(result.files.single.path!);
-                        PlatformFile? androidFile = PlatformFile(
-                          path: file.path,
-                          name: file.path.split('/').last,
-                          size: file.lengthSync(),
-                          bytes: await file.readAsBytes(), // Read file bytes
-                          //extension: fileExtension,
-                        );
-                        // print("here 2");
-                        setState(() {
-                          // print("here 3");
-                          widget.onChange(androidFile);
-                          // print("here 4");
-                          widget.proPic = androidFile;
-                          // print("here 5");
-                          //print("MIH Profile Picture: ${widget.proPic}");
-                          //print("bytes: ${widget.proPic!.bytes!}");
-                          propicPreview = FileImage(file);
-                        });
-
-                        setState(() {
-                          widget.proPicController.text = widget.proPic!.name;
-                        });
-                      } else {
-                        print("here in else");
-                        // User canceled the picker
-                      }
-                    }
-                  } catch (e) {
-                    print("Error: $e");
-                  }
-                },
-                icon: const Icon(Icons.edit),
-              ),
-            ),
-          ),
-        ],
-      );
-    } else {
-      return SizedBox(
-        width: widget.width,
-        child: Icon(
-          MihIcons.mihCircleFrame,
-          color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-        ),
-      );
-    }
-  }
-
-  @override
-  void initState() {
-    setState(() {
-      propicPreview = widget.profilePictureFile;
-    });
-
-    super.initState();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return displayEditableProPic();
-  }
-}

Frontend/lib/mih_packages/about_mih/package_tile/about_mih_tile.dart

@@ -1,7 +1,7 @@
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_tile.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';
 
 class AboutMihTile extends StatefulWidget {
   final double packageSize;
@@ -25,19 +25,11 @@ class _AboutMihTileState extends State<AboutMihTile> {
         );
       },
       appName: "About MIH",
-      appIcon: Container(
+      appIcon: Icon(
-        alignment: Alignment.center,
+        MihIcons.aboutMih,
-        padding: const EdgeInsets.all(25),
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-        child: FaIcon(
+        // size: widget.packageSize,
-          FontAwesomeIcons.circleInfo,
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-          size: widget.packageSize,
-        ),
       ),
-      // Icon(
-      //   Icons.info,
-      //   color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-      // ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
       secondaryColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),

Frontend/lib/mih_packages/access_review/package_tile/mih_access_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';
 
@@ -27,13 +28,11 @@ class _MihAccessTileState extends State<MihAccessTile> {
           arguments: widget.signedInUser,
         );
       },
-      appName: "MIH Access",
+      appName: "Access Controls",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(1),
+        MihIcons.accessControl,
-        child: Icon(
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          Icons.check_box,
+        // size: widget.packageSize,
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-        ),
       ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/lib/mih_packages/calculator/package_tiles/mih_calculator_tile.dart

@@ -1,6 +1,7 @@
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_app_tile.dart';
 import 'package:flutter/material.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_icons.dart';
 
 class MihCalculatorTile extends StatefulWidget {
   final bool personalSelected;
@@ -27,12 +28,10 @@ class _MihCalculatorTileState extends State<MihCalculatorTile> {
         );
       },
       appName: "Calculator",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(0),
+        MihIcons.calculator,
-        child: Icon(
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          Icons.calculate,
+        // size: widget.packageSize,
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-        ),
       ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/lib/mih_packages/calendar/package_tiles/mzansi_calendar_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/arguments.dart';
 import 'package:flutter/material.dart';
 
@@ -28,12 +29,10 @@ class _MzansiCalendarTileState extends State<MzansiCalendarTile> {
         );
       },
       appName: "Calendar",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(0.5),
+        MihIcons.calendar,
-        child: Icon(
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          Icons.calendar_month,
+        // size: widget.packageSize,
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-        ),
       ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/lib/mih_packages/mih_home/mih_home_legacy.dart

@@ -28,7 +28,6 @@ import '../../mih_components/mih_pop_up_messages/mih_loading_circle.dart';
 import '../../mih_components/mih_pop_up_messages/mih_notification_message.dart';
 import '../../mih_components/mih_pop_up_messages/mih_success_message.dart';
 import '../../mih_components/mih_pop_up_messages/mih_warning_message.dart';
-import '../../mih_components/mih_profile_picture.dart';
 import '../../mih_env/env.dart';
 import '../../mih_objects/app_user.dart';
 import '../../mih_objects/arguments.dart';
@@ -985,18 +984,18 @@ class _MIHHomeLegacyState extends State<MIHHomeLegacy> {
     return Builder(builder: (context) {
       return MIHAction(
         icon: Padding(
-          padding: const EdgeInsets.only(left: 5.0),
+          padding: const EdgeInsets.only(left: 5.0), child: Placeholder(),
-          child: MIHProfilePicture(
+          // MIHProfilePicture(
-            profilePictureFile: widget.propicFile,
+          //   profilePictureFile: widget.propicFile,
-            proPicController: proPicController,
+          //   proPicController: proPicController,
-            proPic: null,
+          //   proPic: null,
-            width: 45,
+          //   width: 45,
-            radius: 21,
+          //   radius: 21,
-            drawerMode: false,
+          //   drawerMode: false,
-            editable: false,
+          //   editable: false,
-            frameColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+          //   frameColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-            onChange: (newProPic) {},
+          //   onChange: (newProPic) {},
-          ),
+          // ),
         ),
         // const Icon(Icons.apps),
         iconSize: 45,

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

@@ -190,7 +190,7 @@ class _MihBusinessHomeState extends State<MihBusinessHome>
     final double width = size.width;
     final double height = size.height;
     return MihAppToolBody(
-      borderOn: true,
+      borderOn: false,
       bodyItem: getBody(width, height),
     );
   }

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

@@ -157,12 +157,9 @@ class _MihPersonalHomeState extends State<MihPersonalHome>
             );
           },
           appName: "Test",
-          appIcon: Container(
+          appIcon: Icon(
-            padding: const EdgeInsets.all(0.5),
+            Icons.warning_amber_rounded,
-            child: Icon(
+            color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-              Icons.warning_amber_rounded,
-              color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-            ),
           ),
           iconSize: packageSize,
           primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
@@ -238,7 +235,7 @@ class _MihPersonalHomeState extends State<MihPersonalHome>
     final double height = size.height;
 
     return MihAppToolBody(
-      borderOn: true,
+      borderOn: false,
       bodyItem: getBody(width, height),
     );
   }

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

@@ -29,19 +29,10 @@ class _MzansiAiTileState extends State<MzansiAiTile> {
         );
       },
       appName: "Mzansi AI",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(1),
+        MihIcons.mzansiAi,
-        alignment: Alignment.center,
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-        // color: Colors.black,
+        // size: widget.packageSize,
-        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/business_profile/package_tiles/mzansi_business_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/arguments.dart';
 import 'package:flutter/material.dart';
 
@@ -28,12 +29,10 @@ class _MzansiBusinessProfileTileState extends State<MzansiBusinessProfileTile> {
         );
       },
       appName: "Business Profile",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(0.5),
+        MihIcons.businessProfile,
-        child: Icon(
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          Icons.business_center,
+        // size: widget.packageSize,
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-        ),
       ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/lib/mih_packages/mzansi_profile/business_profile/package_tiles/mzansi_setup_business_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:flutter/material.dart';
 
@@ -29,12 +30,9 @@ class _MzansiSetupBusinessProfileTileState
         );
       },
       appName: "Setup Business",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(0.5),
+        MihIcons.profileSetup,
-        child: Icon(
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          Icons.business_center,
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-        ),
       ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/lib/mih_packages/mzansi_profile/business_profile/package_tools/mih_business_profile.dart

@@ -9,10 +9,10 @@ import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_
 import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_text_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_circle_avatar.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_error_message.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_loading_circle.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_success_message.dart';
-import 'package:mzansi_innovation_hub/mih_components/mih_profile_picture.dart';
 import 'package:mzansi_innovation_hub/mih_env/env.dart';
 import 'package:mzansi_innovation_hub/mih_objects/arguments.dart';
 import 'package:file_picker/file_picker.dart';
@@ -350,13 +350,11 @@ class _MihBusinessProfileState extends State<MihBusinessProfile> {
                           ?.theme
                           .secondaryColor()),
                   const SizedBox(height: 10.0),
-                  MIHProfilePicture(
+                  MihCircleAvatar(
-                    profilePictureFile: logoPreview,
+                    imageFile: logoPreview,
-                    proPicController: logonameController,
+                    fileNameController: logonameController,
-                    proPic: logoFile,
+                    userSelectedfile: logoFile,
                     width: 155,
-                    radius: 70,
-                    drawerMode: false,
                     editable: true,
                     frameColor:
                         MzanziInnovationHub.of(context)!.theme.secondaryColor(),
@@ -366,6 +364,8 @@ class _MihBusinessProfileState extends State<MihBusinessProfile> {
                       });
                       print("logoFile: ${logoFile?.bytes}");
                     },
+                    backgroundColor:
+                        MzanziInnovationHub.of(context)!.theme.secondaryColor(),
                   ),
                   const SizedBox(height: 10.0),
                   MIHFileField(

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

@@ -36,19 +36,10 @@ class _MzansiProfileTileState extends State<MzansiProfileTile> {
         );
       },
       appName: "Mzansi Profile",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(1),
+        MihIcons.mihLogo,
-        alignment: Alignment.center,
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-        // color: Colors.black,
+        // size: widget.packageSize,
-        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

@@ -35,16 +35,10 @@ class _MzansiSetupProfileTileState extends State<MzansiSetupProfileTile> {
         );
       },
       appName: "Setup Profile",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(1),
+        MihIcons.profileSetup,
-        child: FittedBox(
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          fit: BoxFit.contain,
+        // size: widget.packageSize,
-          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_wallet/package_tiles/mih_wallet_tile.dart

@@ -1,8 +1,8 @@
 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';
-import 'package:font_awesome_flutter/font_awesome_flutter.dart';
 import 'package:mzansi_innovation_hub/mih_objects/arguments.dart';
 
 class MihWalletTile extends StatefulWidget {
@@ -30,15 +30,12 @@ class _MihWalletTileState extends State<MihWalletTile> {
         );
       },
       appName: "Mzansi Wallet",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(25),
+        MihIcons.mzansiWallet,
-        child: FaIcon(
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          FontAwesomeIcons.wallet,
+        // size: widget.packageSize,
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-          size: widget.packageSize,
-        ),
       ),
-      iconSize: 200,
+      iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
       secondaryColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
     );

Frontend/lib/mih_packages/patient_profile/pat_manager/package_tiles/pat_manager_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/arguments.dart';
 import 'package:flutter/material.dart';
 
@@ -27,12 +28,10 @@ class _PatManagerTileState extends State<PatManagerTile> {
         );
       },
       appName: "Patient Manager",
-      appIcon: Container(
+      appIcon: Icon(
-        padding: const EdgeInsets.all(1),
+        MihIcons.patientManager,
-        child: Icon(
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          Icons.medical_services,
+        // size: widget.packageSize,
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-        ),
       ),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/lib/mih_packages/patient_profile/pat_profile/package_tiles/patient_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/arguments.dart';
 import 'package:flutter/material.dart';
 
@@ -28,13 +29,11 @@ class _PatientProfileTileState extends State<PatientProfileTile> {
         );
       },
       appName: "Patient Profile",
-      appIcon: Container(
+      appIcon: Icon(
-          padding: const EdgeInsets.all(15),
+        MihIcons.patientProfile,
-          child: Icon(
+        color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-            Icons.medical_information_outlined,
+        // size: widget.packageSize,
-            color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+      ),
-            size: widget.packageSize,
-          )),
       iconSize: widget.packageSize,
       primaryColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
       secondaryColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),

Frontend/pubspec.yaml

@@ -126,7 +126,8 @@ flutter:
   fonts:
     - family: MihIcons
       fonts:
-        - asset: lib/mih_components/mih_package_components/assets/fonts/MihIcons.ttf
+        # - asset: lib/mih_components/mih_package_components/assets/fonts/MihIcons.ttf
+        - asset: lib/mih_components/mih_package_components/assets/fonts/Mih_Icons.ttf
   #       - asset: fonts/Schyler-Italic.ttf
   #         style: italic
   #   - family: Trajan Pro