Common Update 1.0

assets/icons/ic_edit.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20.243" height="17.99" viewBox="0 0 20.243 17.99">
+  <path id="edit" d="M14.149,3.02l3.17,3.17a.344.344,0,0,1,0,.485L9.643,14.351l-3.261.362a.684.684,0,0,1-.756-.756L5.989,10.7,13.664,3.02A.344.344,0,0,1,14.149,3.02Zm5.693-.8L18.127.5a1.374,1.374,0,0,0-1.94,0L14.943,1.745a.344.344,0,0,0,0,.485l3.17,3.17a.344.344,0,0,0,.485,0l1.244-1.244A1.374,1.374,0,0,0,19.842,2.216ZM13.5,12.263v3.578H2.249V4.595h8.076a.432.432,0,0,0,.3-.123L12.03,3.066a.422.422,0,0,0-.3-.72H1.687A1.687,1.687,0,0,0,0,4.033V16.4A1.687,1.687,0,0,0,1.687,18.09H14.058A1.687,1.687,0,0,0,15.744,16.4V10.858a.422.422,0,0,0-.72-.3l-1.406,1.406A.432.432,0,0,0,13.5,12.263Z" transform="translate(0 -0.1)" fill="#28323a"/>
+</svg>

lib/classes/consts.dart

@@ -100,7 +100,7 @@ class MyAssets {
   static String bcIntro = "${assetPath}images/bc_intro.svg";
   static String bnLogo = "${assetPath}images/bn_logo.svg";
   static String icCar = "${assetPath}images/ic_car.svg";
-  static String icEdit = "${assetPath}images/ic_edit.svg";
+  static String icEdit = "${assetPath}icons/ic_edit.svg";
   static String icEmail = "${assetPath}images/ic_email.svg";
   static String icLock = "${assetPath}images/ic_lock.svg";
   static String icLogout = "${assetPath}images/ic_logout.svg";

lib/extensions/string_extensions.dart

@@ -1,13 +1,23 @@
-
 import 'package:flutter/cupertino.dart';
 import 'package:intl/intl.dart';
 import 'package:mc_common_app/theme/colors.dart';
+import 'package:auto_size_text/auto_size_text.dart';
 
 extension EmailValidator on String {
-  Widget toText({Color? color, bool isBold = false, double? fontSize, bool isUnderLine = false, TextDecoration? textDecoration, double letterSpacing = -0.4, TextAlign? textAlign, double? height}) =>
+  Widget toText(
-      Text(
+          {Color? color,
+          bool isBold = false,
+          double? fontSize,
+          bool isUnderLine = false,
+          TextDecoration? textDecoration,
+          double letterSpacing = -0.4,
+          TextAlign? textAlign,
+          double? height,
+          int? maxLines}) =>
+      AutoSizeText(
         this,
         textAlign: textAlign,
+        maxLines: maxLines,
         style: TextStyle(
           height: height,
           decoration: isUnderLine ? TextDecoration.underline : textDecoration ?? TextDecoration.none,
@@ -18,7 +28,6 @@ extension EmailValidator on String {
         ),
       );
 
-
   bool isValidEmail() {
     return RegExp(r'^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$').hasMatch(this);
   }

lib/theme/colors.dart

@@ -6,10 +6,10 @@ class MyColors {
   static const Color accentColor = Colors.blue;
   static const Color lightTextColor = Color(0xff969696);
   static const Color textColor = Color(0xff777777);
+  static const Color darkTextColor = Color(0xff28323A);
   static const Color textFieldColor = Color(0xffF3F5F7);
   static const Color darkIconColor = Color(0xff28323A);
   static const Color lightIconColor = Color(0xff767676);
-  static const Color darkTextColor = Color(0xff2B353E);
   static const Color normalTextColor = Color(0xff5A5A5A);
   static const Color gradiantStartColor = Color(0xff33c0a5);
   static const Color gradiantEndColor = Color(0xff259db7);

lib/views/user/change_email_page.dart

@@ -3,7 +3,7 @@ import 'package:mc_common_app/extensions/string_extensions.dart';
 import 'package:mc_common_app/generated/locale_keys.g.dart';
 import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:mc_common_app/widgets/txt_field.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';

lib/views/user/change_mobile_page.dart

@@ -3,7 +3,7 @@ import 'package:mc_common_app/extensions/string_extensions.dart';
 import 'package:mc_common_app/generated/locale_keys.g.dart';
 import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:mc_common_app/widgets/txt_field.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';

lib/views/user/change_password_page.dart

@@ -3,7 +3,7 @@ import 'package:mc_common_app/extensions/string_extensions.dart';
 import 'package:mc_common_app/generated/locale_keys.g.dart';
 import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:mc_common_app/widgets/txt_field.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';

lib/views/user/complete_profile_page.dart

@@ -5,7 +5,7 @@ import 'package:mc_common_app/generated/locale_keys.g.dart';
 import 'package:mc_common_app/models/user/register_user.dart';
 import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:mc_common_app/widgets/txt_field.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';

lib/views/user/confirm_new_password.dart

@@ -4,7 +4,7 @@ import 'package:mc_common_app/extensions/int_extensions.dart';
 import 'package:mc_common_app/generated/locale_keys.g.dart';
 import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:mc_common_app/widgets/txt_field.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';

lib/views/user/confirm_new_password_page.dart

@@ -4,7 +4,7 @@ import 'package:mc_common_app/extensions/string_extensions.dart';
 import 'package:mc_common_app/generated/locale_keys.g.dart';
 import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
@@ -26,7 +26,7 @@ class _ConfirmNewPasswordPageState extends State<ConfirmNewPasswordPage> {
   Widget build(BuildContext context) {
     UserVM userVM = context.read<UserVM>();
     return Scaffold(
-      appBar: CustomAppBar( isRemoveBackButton: true, title: LocaleKeys.forgetPassword.tr()),
+      appBar: CustomAppBar(isRemoveBackButton: true, title: LocaleKeys.forgetPassword.tr()),
       body: SingleChildScrollView(
         child: Container(
           // width: double.infinity,
@@ -34,7 +34,11 @@ class _ConfirmNewPasswordPageState extends State<ConfirmNewPasswordPage> {
           padding: const EdgeInsets.all(40),
           child: Column(
             children: [
-              LocaleKeys.newPassword.tr().toText(height: 23 / 24, fontSize: 24, letterSpacing: -1.44,),
+              LocaleKeys.newPassword.tr().toText(
+                    height: 23 / 24,
+                    fontSize: 24,
+                    letterSpacing: -1.44,
+                  ),
               12.height,
               TextFormField(
                 decoration: InputDecoration(

lib/views/user/forget_password_page.dart

@@ -8,7 +8,7 @@ import 'package:mc_common_app/generated/locale_keys.g.dart';
 import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
 import 'package:mc_common_app/widgets/dropdown/dropdow_field.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:mc_common_app/widgets/tab/login_email_tab.dart';
 import 'package:mc_common_app/widgets/txt_field.dart';
 import 'package:easy_localization/easy_localization.dart';

lib/views/user/login_with_password_page.dart

@@ -10,7 +10,7 @@ import 'package:mc_common_app/utils/navigator.dart';
 import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
 import 'package:mc_common_app/widgets/dropdown/dropdow_field.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:mc_common_app/widgets/tab/login_email_tab.dart';
 import 'package:mc_common_app/widgets/txt_field.dart';
 import 'package:easy_localization/easy_localization.dart';

lib/views/user/register_page.dart

@@ -6,7 +6,7 @@ import 'package:mc_common_app/utils/utils.dart';
 import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
 import 'package:mc_common_app/widgets/dropdown/dropdow_field.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';

lib/views/user/register_provider_page.dart

@@ -10,7 +10,7 @@ import 'package:mc_common_app/view_models/user_view_model.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
 
 import 'package:mc_common_app/widgets/dropdown/dropdow_field.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:mc_common_app/widgets/tab/role_type_tab.dart';

lib/views/user/register_selection_page.dart

@@ -8,7 +8,7 @@ import 'package:mc_common_app/generated/locale_keys.g.dart';
 import 'package:mc_common_app/utils/enums.dart';
 import 'package:mc_common_app/utils/navigator.dart';
 import 'package:mc_common_app/utils/utils.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';

lib/widgets/button/show_card_buttton.dart

@@ -1,6 +1,6 @@
 
 import 'package:flutter/material.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 
 class ShowCardButton extends StatelessWidget {
   String title;

lib/widgets/button/show_fill_button.dart

@@ -1,8 +1,7 @@
-
 import 'package:flutter/material.dart';
 import 'package:mc_common_app/extensions/string_extensions.dart';
 
-import '../theme/colors.dart';
+import '../../theme/colors.dart';
 
 class ShowFillButton extends StatelessWidget {
   String title;
@@ -10,6 +9,7 @@ class ShowFillButton extends StatelessWidget {
   Color txtColor;
   double elevation, radius, maxWidth, maxHeight, fontSize, horizontalPadding, horizontalMargin, verticalMargin;
   bool isFlatButton, isBold;
+  EdgeInsets? margin;
 
   ShowFillButton({
     required this.title,
@@ -25,6 +25,7 @@ class ShowFillButton extends StatelessWidget {
     this.isBold = true,
     this.horizontalMargin = 0,
     this.verticalMargin = 0,
+    this.margin,
   });
 
   @override
@@ -38,31 +39,35 @@ class ShowFillButton extends StatelessWidget {
         right: 20,
       ),
     )
-        : ConstrainedBox(
+        : Padding(
-      constraints: BoxConstraints(
+      padding: margin ?? const EdgeInsets.all(0.0),
-        minHeight: maxHeight,
+      child: ConstrainedBox(
-        minWidth: maxWidth,
+        constraints: BoxConstraints(
-        maxHeight: maxHeight,
+          minHeight: maxHeight,
-        maxWidth: maxWidth,
+          minWidth: maxWidth,
+          maxHeight: maxHeight,
+          maxWidth: maxWidth,
+        ),
+        child: showButton(),
       ),
-      child: showButton(),
     );
   }
 
   Widget showButton() {
     return Container(
       // decoration: isFlatButton ? null : MyColors.gradientButton,
-      color:isFlatButton ? null : MyColors.darkPrimaryColor,
+      color: isFlatButton ? null : MyColors.darkPrimaryColor,
       margin: EdgeInsets.symmetric(horizontal: horizontalMargin, vertical: verticalMargin),
       child: MaterialButton(
         onPressed: onPressed,
-        shape: new RoundedRectangleBorder(
+        shape: RoundedRectangleBorder(
-          borderRadius: new BorderRadius.circular(radius),
+          borderRadius: BorderRadius.circular(radius),
         ),
         child: title.toText(
           fontSize: fontSize,
           isBold: isBold,
           color: txtColor,
+          maxLines: 1,
         ),
       ),
     );

lib/widgets/common_widgets/ad_widget.dart

@@ -1,4 +1,3 @@
-
 import 'package:flutter/material.dart';
 import 'package:mc_common_app/classes/consts.dart';
 import 'package:mc_common_app/extensions/int_extensions.dart';

lib/widgets/common_widgets/app_bar.dart

@@ -72,6 +72,7 @@ class CustomAppBar extends StatelessWidget with PreferredSizeWidget {
   final String profileImageUrl;
   final bool isDrawerEnabled;
   final VoidCallback? onTap;
+  final double? leadingWidth;
 
   const CustomAppBar({
     Key? key,
@@ -86,45 +87,72 @@ class CustomAppBar extends StatelessWidget with PreferredSizeWidget {
     this.isTitleCenter,
     this.titleColor,
     this.onTap,
+    this.leadingWidth,
   }) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
-    return AppBar(
+    return Column(
-      leadingWidth: 100,
+      children: [
-      backgroundColor: backgroundColor ?? appBackgroundColor,
+        AppBar(
-      elevation: elevation ?? 0,
+          leadingWidth: leadingWidth??61,
-      centerTitle: isTitleCenter ?? true,
+          backgroundColor: backgroundColor ?? Colors.white,
-      leading: isDrawerEnabled
+          elevation: elevation ?? 0,
-          ? InkWell(
+          centerTitle: isTitleCenter ?? true,
-              onTap: onTap,
+          leading: isDrawerEnabled
-              child: Row(
+              ? InkWell(
-                children: [
+                  onTap: onTap,
-                  Image.asset(
+                  child: Row(
-                    profileImageUrl,
+                    children: [
-                    width: 34,
+                      Image.asset(
-                    height: 34,
+                        profileImageUrl,
-                    fit: BoxFit.fill,
+                        width: 34,
-                  ).toCircle(borderRadius: 100),
+                        height: 34,
-                  10.width,
+                        fit: BoxFit.fill,
-                  SvgPicture.asset(MyAssets.dashboardDrawerIcon),
+                      ).toCircle(borderRadius: 100),
-                ],
+                      10.width,
-              ).paddingOnly(left: 21),
+                      SvgPicture.asset(MyAssets.dashboardDrawerIcon),
-            )
+                    ],
-          : isRemoveBackButton
+                  ).paddingOnly(left: 21),
-              ? null
+                )
-              : IconButton(
+              : isRemoveBackButton
-                  icon: const Icon(Icons.arrow_back_ios, color: Colors.black),
+                  ? null
-                  onPressed: () => Navigator.of(context).pop(),
+                  : Row(
-                ),
+                      children: [
-      iconTheme: IconThemeData(
+                        21.width,
-        color: backIconColor ?? Colors.black, //change your color here
+                        IconButton(
-      ),
+                          icon: const Icon(
-      actions: actions,
+                            Icons.arrow_back_ios,
-      title: (title ?? "").toText(fontSize: 20, isBold: true),
+                            color: Colors.black,
+                            size: 16,
+                          ),
+                          onPressed: () => onTap??Navigator.of(context).pop(),
+                        ).toContainer(
+                          paddingAll: 0,
+                          borderRadius: 100,
+                          borderColor: MyColors.lightGreyEFColor,
+                          isEnabledBorder: true,
+                          height: 40,
+                          width: 40,
+                        ),
+                      ],
+                    ),
+          iconTheme: IconThemeData(
+            color: backIconColor ?? Colors.black, //change your color here
+          ),
+          actions: actions,
+          title: (title ?? "").toText(fontSize: 20, isBold: true),
+        ),
+        if (backgroundColor == null)
+          const Divider(
+            thickness: 1,
+            color: MyColors.lightGreyEFColor,
+            height: 1,
+          )
+      ],
     );
   }
 
   @override
-  Size get preferredSize => const Size.fromHeight(55);
+  Size get preferredSize => const Size.fromHeight(60);
 }

lib/widgets/dialog/message_dialog.dart

@@ -2,7 +2,7 @@
 import 'package:flutter/material.dart';
 import 'package:mc_common_app/extensions/int_extensions.dart';
 import 'package:mc_common_app/extensions/string_extensions.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 
 class MessageDialog extends StatelessWidget {
   String? title, buttonTitle;

lib/widgets/dialog/otp_dialog.dart

@@ -6,7 +6,7 @@ import 'package:mc_common_app/extensions/string_extensions.dart';
 import 'package:mc_common_app/generated/locale_keys.g.dart';
 import 'package:mc_common_app/theme/colors.dart';
 import 'package:mc_common_app/widgets/count_down_timer.dart';
-import 'package:mc_common_app/widgets/show_fill_button.dart';
+import 'package:mc_common_app/widgets/button/show_fill_button.dart';
 
 import '../otp_widget.dart';
 

lib/widgets/extensions/extensions_widget.dart

@@ -6,7 +6,6 @@ import 'package:mc_common_app/theme/colors.dart';
 import 'package:provider/provider.dart';
 
 extension ExtendedText on Widget {
-
   showOverlay({double? width, double? height}) {
     return Container(
       width: width ?? double.infinity,
@@ -24,21 +23,25 @@ extension ExtendedText on Widget {
 }
 
 extension ContainerExt on Widget {
-  Widget toWhiteContainer({required double width, required double allPading}) {
+  Widget toWhiteContainer({required double width, required double allPading, EdgeInsets? margin, VoidCallback? onTap}) {
-    return Container(
+    return InkWell(
-      decoration: const BoxDecoration(
+      onTap: onTap,
-        color: MyColors.white,
+      child: Container(
-        boxShadow: [
+        decoration: const BoxDecoration(
-          BoxShadow(
+          color: MyColors.white,
-            blurRadius: 8,
+          boxShadow: [
-            spreadRadius: 3,
+            BoxShadow(
-            offset: Offset(0, 3),
+              blurRadius: 8,
-            color: MyColors.greyShadowColor,
+              spreadRadius: 3,
-          ),
+              offset: Offset(0, 3),
-        ],
+              color: MyColors.greyShadowColor,
+            ),
+          ],
+        ),
+        padding: EdgeInsets.all(allPading),
+        margin: margin,
+        child: this,
       ),
-      padding: EdgeInsets.all(allPading),
-      child: this,
     );
   }
 
@@ -50,31 +53,39 @@ extension ContainerExt on Widget {
   //   );
   // }
 
-  Widget toContainer({double borderRadius = 8,
+  Widget toContainer({
+    double borderRadius = 8,
     double paddingAll = 10,
     double marginAll = 0,
     EdgeInsetsGeometry? margin,
     EdgeInsetsGeometry? padding,
     Color backgroundColor = Colors.white,
     bool isShadowEnabled = false,
-    double? width}) =>
+    bool isEnabledBorder = false,
+    Color borderColor = Colors.black,
+    double borderWidget = 1,
+    double? width,
+    double? height,
+  }) =>
       Container(
         decoration: BoxDecoration(
           color: backgroundColor,
           borderRadius: BorderRadius.circular(borderRadius),
+          border: !isEnabledBorder ? null : Border.all(color: borderColor, width: borderWidget),
           boxShadow: !isShadowEnabled
               ? null
               : [
-            BoxShadow(
+                  BoxShadow(
-              color: const Color(0xff000000).withOpacity(.05),
+                    color: const Color(0xff000000).withOpacity(.05),
-              blurRadius: 26,
+                    blurRadius: 26,
-              offset: const Offset(0, -3),
+                    offset: const Offset(0, -3),
-            ),
+                  ),
-          ],
+                ],
         ),
         padding: padding ?? EdgeInsets.all(paddingAll),
         margin: margin ?? EdgeInsets.all(marginAll),
         width: width,
+        height: height,
         child: this,
       );
 }
@@ -200,7 +211,6 @@ extension WidgetExt on Widget {
     );
   }
 
-
   Widget paddingOnly({double left = 0.0, double right = 0.0, double top = 0.0, double bottom = 0.0}) =>
       Padding(padding: EdgeInsets.only(left: left, right: right, top: top, bottom: bottom), child: this);
 
@@ -328,5 +338,4 @@ extension LocaleSetup on MultiProvider {
 
 extension WidgetExtensions on Widget {
   Widget onPress(VoidCallback onTap) => InkWell(onTap: onTap, child: this);
-
 }

lib/widgets/tab/menu_tabs.dart

@@ -0,0 +1,64 @@
+import 'package:flutter/material.dart';
+import 'package:mc_common_app/extensions/int_extensions.dart';
+import 'package:mc_common_app/theme/colors.dart';
+import 'package:mc_common_app/widgets/dropdown/dropdow_field.dart';
+
+class MenuTabs extends StatefulWidget {
+  int selectedIndex;
+  List<DropValue> dropList;
+  Function(DropValue value) onSelect;
+  Color? selectedColor;
+
+
+  MenuTabs(this.selectedIndex, this.dropList, {required this.onSelect, this.selectedColor});
+
+  @override
+  State<MenuTabs> createState() => _RoleTypeTabState();
+}
+
+class _RoleTypeTabState extends State<MenuTabs> {
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+      width: double.infinity,
+      height: 35,
+      child: ListView.separated(
+        itemBuilder: (context, index) {
+          return InkWell(
+            onTap: () {
+              setState(() {
+                widget.selectedIndex = index;
+                widget.onSelect(widget.dropList[index]);
+              });
+            },
+            child: Container(
+              height: 45,
+              decoration: BoxDecoration(
+                color: widget.selectedIndex == index ? widget.selectedColor ?? MyColors.darkIconColor : Colors.white,
+                border: Border.all(color: widget.selectedIndex == index ? widget.selectedColor ?? MyColors.darkIconColor : MyColors.darkPrimaryColor, width: 1.5),
+                borderRadius: const BorderRadius.all(Radius.circular(0)),
+              ),
+              padding: const EdgeInsets.symmetric(horizontal: 20),
+              child: Center(
+                child: Text(
+                  widget.dropList[index].value,
+                  style: TextStyle(
+                    color: widget.selectedIndex == index ? MyColors.white : Colors.black,
+                    fontSize: 12,
+                    fontWeight: FontWeight.w600,
+                  ),
+                ),
+              ),
+            ),
+          );
+        },
+        separatorBuilder: (context, index) {
+          return 12.width;
+        },
+        padding: const EdgeInsets.symmetric(horizontal: 21),
+        itemCount: widget.dropList.length,
+        scrollDirection: Axis.horizontal,
+      ),
+    );
+  }
+}