social media elements added for profile and service page

pull/268/head
tahaalam 13 hours ago
parent 05aaa71cf9
commit e73d2534cc

@ -0,0 +1,11 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_12335_23399)">
<path d="M24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 17.9895 4.3882 22.954 10.125 23.8542L10.125 15.4687H7.07813L7.07813 12H10.125L10.125 9.35625C10.125 6.34875 11.9166 4.6875 14.6576 4.6875C15.9701 4.6875 17.3438 4.92187 17.3438 4.92187L17.3438 7.875L15.8306 7.875C14.34 7.875 13.875 8.80008 13.875 9.75L13.875 12H17.2031L16.6711 15.4687H13.875L13.875 23.8542C19.6118 22.954 24 17.9895 24 12Z" fill="#1877F2"/>
<path d="M16.6711 15.4687L17.2031 12L13.875 12L13.875 9.75C13.875 8.80102 14.34 7.875 15.8306 7.875L17.3438 7.875V4.92187C17.3438 4.92187 15.9705 4.6875 14.6576 4.6875C11.9166 4.6875 10.125 6.34875 10.125 9.35625V12H7.07813L7.07813 15.4688H10.125L10.125 23.8542C11.3674 24.0486 12.6326 24.0486 13.875 23.8542V15.4687H16.6711Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0_12335_23399">
<rect width="24" height="24" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1023 B

@ -0,0 +1,6 @@
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1.75" y="1.75" width="24.5" height="24.5" rx="12.25" fill="#1275B1"/>
<path d="M11.0412 8.48063C11.0412 9.29836 10.3325 9.96126 9.45812 9.96126C8.58379 9.96126 7.875 9.29836 7.875 8.48063C7.875 7.6629 8.58379 7 9.45812 7C10.3325 7 11.0412 7.6629 11.0412 8.48063Z" fill="white"/>
<path d="M8.09149 11.0496H10.7977L10.7977 19.25H8.09149L8.09149 11.0496Z" fill="white"/>
<path d="M15.1546 11.0496L12.4485 11.0496L12.4485 19.25H15.1546C15.1546 19.25 15.1546 16.6684 15.1546 15.0542C15.1546 14.0854 15.4854 13.1123 16.8054 13.1123C18.2971 13.1123 18.2882 14.3802 18.2812 15.3625C18.2721 16.6464 18.2938 17.9566 18.2938 19.25L21 19.25L21 14.922C20.9771 12.1585 20.257 10.8851 17.8879 10.8851C16.481 10.8851 15.6089 11.5238 15.1546 12.1017V11.0496Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 870 B

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.3569 2.78113C2.52359 2.45513 2.85886 2.25 3.225 2.25L8.1 2.25C8.41308 2.25 8.70711 2.40034 8.89041 2.65415L13.5354 9.08571L20.0856 2.53557C20.4663 2.15481 21.0837 2.15481 21.4644 2.53557C21.8452 2.91633 21.8452 3.53367 21.4644 3.91443L14.6919 10.687L21.5654 20.2041C21.7798 20.501 21.8098 20.8929 21.6431 21.2189C21.4764 21.5449 21.1411 21.75 20.775 21.75H15.9C15.5869 21.75 15.2929 21.5997 15.1096 21.3459L10.4646 14.9143L3.91443 21.4644C3.53367 21.8452 2.91634 21.8452 2.53557 21.4644C2.15481 21.0837 2.15481 20.4663 2.53557 20.0856L9.30811 13.313L2.43459 3.79585C2.22022 3.49903 2.19021 3.10713 2.3569 2.78113Z" fill="black"/>
</svg>

After

Width:  |  Height:  |  Size: 745 B

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.0898 21L10.7433 14.5283L5.302 21H3L9.72196 13.0073L3 3L8.91024 3L13.0068 9.09956L18.1395 3L20.4415 3L14.0315 10.6226L21 21H15.0898ZM17.6533 19.1755H16.1035L6.29612 4.82455H7.84613L11.7741 10.5708L12.4533 11.5679L17.6533 19.1755Z" fill="#384250"/>
</svg>

After

Width:  |  Height:  |  Size: 403 B

@ -0,0 +1,4 @@
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.96394 8.69847C2.07641 6.96704 3.46845 5.61012 5.20141 5.52427C7.71084 5.39994 11.2975 5.25 14 5.25C16.7025 5.25 20.2892 5.39994 22.7986 5.52427C24.5315 5.61012 25.9236 6.96704 26.0361 8.69847C26.1438 10.3573 26.25 12.3985 26.25 14C26.25 15.6015 26.1438 17.6427 26.0361 19.3015C25.9236 21.033 24.5315 22.3899 22.7986 22.4757C20.2892 22.6001 16.7025 22.75 14 22.75C11.2975 22.75 7.71084 22.6001 5.20141 22.4757C3.46845 22.3899 2.07641 21.033 1.96394 19.3015C1.85619 17.6427 1.75 15.6015 1.75 14C1.75 12.3985 1.85619 10.3573 1.96394 8.69847Z" fill="#FC0D1B"/>
<path d="M11.375 10.5L11.375 17.5L18.375 14L11.375 10.5Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 745 B

@ -1795,5 +1795,10 @@
"selectBloodDonationCity": "اختر المدينة", "selectBloodDonationCity": "اختر المدينة",
"selectBloodDonationGender": "اختر الجنس", "selectBloodDonationGender": "اختر الجنس",
"selectBloodType": "اختر الفصيلة", "selectBloodType": "اختر الفصيلة",
"startLiveChat": "بدء المحادثة المباشرة" "startLiveChat": "بدء المحادثة المباشرة",
"followUsOn": "تابعنا على:",
"followUsOnX": "تابعنا على X",
"likeUsOnFB": "سجل إعجابك بنا على فيسبوك",
"watchUsOnYoutube": "شاهدنا على إنستغرام",
"connectOnLinkedin": "تواصل معنا على لينكد إن"
} }

@ -1785,7 +1785,12 @@
"illurgyInfomation": "Allergy", "illurgyInfomation": "Allergy",
"vaccineInfomation": "Vaccine", "vaccineInfomation": "Vaccine",
"approvals1": "Approvals", "approvals1": "Approvals",
"startLiveChat": "Start Live Chat" "startLiveChat": "Start Live Chat",
"followUsOn": "Follow us on:",
"followUsOnX": "Follow us on X",
"likeUsOnFB": "Like us on Facebook",
"watchUsOnYoutube": "Watch us on Instagram",
"connectOnLinkedin": "Connect on LinkedIn"
} }

@ -21,6 +21,11 @@ class AppAssets {
static const String report = '$svgBasePath/report.svg'; static const String report = '$svgBasePath/report.svg';
static const String sucess = '$svgBasePath/sucess.svg'; static const String sucess = '$svgBasePath/sucess.svg';
static const String livechatMessage = '$svgBasePath/live_chat_message_icon.svg'; static const String livechatMessage = '$svgBasePath/live_chat_message_icon.svg';
static const String fb = '$svgBasePath/fb.svg';
static const String linkedin = '$svgBasePath/linkedin.svg';
static const String youtube = '$svgBasePath/youtube.svg';
static const String x = '$svgBasePath/twitter.svg';
static const String x2 = '$svgBasePath/twitter2.svg';
// static const String globeOther = '$svgBasePath/globe_other.svg'; // static const String globeOther = '$svgBasePath/globe_other.svg';
static const String cancel = '$svgBasePath/cancel.svg'; static const String cancel = '$svgBasePath/cancel.svg';

@ -1120,7 +1120,7 @@ class AuthenticationViewModel extends ChangeNotifier {
_dialogService.showPhoneNumberPickerSheet( _dialogService.showPhoneNumberPickerSheet(
// label: "Where would you like to receive OTP?", // label: "Where would you like to receive OTP?",
label: LocaleKeys.receiveOtpToast.tr(), label: LocaleKeys.receiveOtpToast.tr(),
message: _appState.isArabic() ? "يرجى الاختيار من الخيارات أدناه لاستلام رمز التحقق." "Please select from the below options to receive OTP.", message: _appState.isArabic() ? "يرجى الاختيار من الخيارات أدناه لاستلام رمز التحقق." :"Please select from the below options to receive OTP.",
onSMSPress: () { onSMSPress: () {
checkUserAuthentication(otpTypeEnum: OTPTypeEnum.sms); checkUserAuthentication(otpTypeEnum: OTPTypeEnum.sms);
}, },

@ -1788,5 +1788,10 @@ abstract class LocaleKeys {
static const selectBloodDonationGender = 'selectBloodDonationGender'; static const selectBloodDonationGender = 'selectBloodDonationGender';
static const selectBloodType = 'selectBloodType'; static const selectBloodType = 'selectBloodType';
static const startLiveChat = 'startLiveChat'; static const startLiveChat = 'startLiveChat';
static const followUsOn = 'followUsOn';
static const followUsOnX = 'followUsOnX';
static const likeUsOnFB = 'likeUsOnFB';
static const watchUsOnYoutube = 'watchUsOnYoutube';
static const connectOnLinkedin = 'connectOnLinkedin';
} }

@ -45,6 +45,7 @@ import 'package:hmg_patient_app_new/widgets/common_bottom_sheet.dart';
import 'package:hmg_patient_app_new/widgets/loader/bottomsheet_loader.dart'; import 'package:hmg_patient_app_new/widgets/loader/bottomsheet_loader.dart';
import 'package:hmg_patient_app_new/widgets/routes/custom_page_route.dart'; import 'package:hmg_patient_app_new/widgets/routes/custom_page_route.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:url_launcher/url_launcher.dart';
import '../../core/dependencies.dart' show getIt; import '../../core/dependencies.dart' show getIt;
import '../../features/qr_parking/qr_parking_view_model.dart'; import '../../features/qr_parking/qr_parking_view_model.dart';
@ -375,6 +376,52 @@ class _ServicesPageState extends State<ServicesPage> {
), ),
]; ];
late final List<HmgServicesComponentModel> socialLinkedinMessage = [
HmgServicesComponentModel(
101,
LocaleKeys.followUsOnX.tr(),
"",
AppAssets.x,
bgColor: AppColors.whiteColor,
true,
route: null,
onTap: () async {
launchUrl(Uri.parse("https://twitter.com/HMG"));
},
),
HmgServicesComponentModel(
102,
LocaleKeys.likeUsOnFB.tr(),
"",
AppAssets.fb,
bgColor: AppColors.whiteColor,
true,
route: null, // Set to null since we handle navigation in onTap
onTap: () async {
launchUrl(Uri.parse("https://www.facebook.com/DrSulaimanAlHabib?ref=tn_tnmn"));
},
),
HmgServicesComponentModel(
103,
LocaleKeys.watchUsOnYoutube.tr(),
"",
AppAssets.youtube,
bgColor: AppColors.whiteColor,
true,
onTap:()=> launchUrl(Uri.parse("https://www.youtube.com/c/DrsulaimanAlhabibHospitals"))
),
HmgServicesComponentModel(
104,
LocaleKeys.connectOnLinkedin.tr(),
"",
AppAssets.linkedin,
bgColor: AppColors.whiteColor,
true,
onTap:()=> launchUrl(Uri.parse("https://www.linkedin.com/company/drsulaiman-alhabib-medical-group")),
),
];
@override @override
void initState() { void initState() {
// TODO: implement initState // TODO: implement initState
@ -840,6 +887,27 @@ class _ServicesPageState extends State<ServicesPage> {
) )
], ],
).paddingSymmetrical(24.w, 0), ).paddingSymmetrical(24.w, 0),
SizedBox(height: 16.h),
GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: (isFoldable || isTablet) ? 6 : 4, // 4 icons per row
crossAxisSpacing: 21.w,
mainAxisSpacing: 18.h,
childAspectRatio: 80.w / 94.h,
),
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemCount: socialLinkedinMessage.length,
padding: EdgeInsets.zero,
itemBuilder: (BuildContext context, int index) {
return ServiceGridViewItem(
socialLinkedinMessage[index],
index,
false,
isHealthToolIcon: true,
);
},
).paddingSymmetrical(24.w, 0),
SizedBox(height: 24.h), SizedBox(height: 24.h),
], ],
), ),

@ -346,6 +346,8 @@ class ProfileSettingsState extends State<ProfileSettings> {
url: 'https://hmg.com/en/Pages/Terms.aspx', url: 'https://hmg.com/en/Pages/Terms.aspx',
); );
}, isExternalLink: true), }, isExternalLink: true),
1.divider,
socialMedia(AppAssets.privacy_terms, LocaleKeys.followUsOn.tr(context: context)),
], ],
), ),
), ),
@ -420,6 +422,30 @@ class ProfileSettingsState extends State<ProfileSettings> {
).paddingOnly(left: 16.w, right: 16.w).onPress(onPress), ).paddingOnly(left: 16.w, right: 16.w).onPress(onPress),
); );
} }
Widget socialMedia(String icon, String label,
) {
return SizedBox(
height: 56.h,
child: Row(
spacing: 8.w,
children: [
Utils.buildSvgWithAssets(icon: icon, iconColor: AppColors.greyTextColor),
label.toText14(isBold: true, textOverflow: TextOverflow.ellipsis, maxlines: 1).expanded,
Row(
spacing: 24.w,
children: [
Utils.buildSvgWithAssets(icon: AppAssets.x2).onPress(()=> launchUrl(Uri.parse("https://twitter.com/HMG"))),
Utils.buildSvgWithAssets(icon: AppAssets.fb).onPress(()=> launchUrl(Uri.parse("https://www.facebook.com/DrSulaimanAlHabib?ref=tn_tnmn"))),
Utils.buildSvgWithAssets(icon: AppAssets.linkedin).onPress(()=> launchUrl(Uri.parse("https://www.linkedin.com/company/drsulaiman-alhabib-medical-group"))),
Utils.buildSvgWithAssets(icon: AppAssets.youtube).onPress(()=> launchUrl(Uri.parse("https://www.youtube.com/c/DrsulaimanAlhabibHospitals"))),
],
)
],
).paddingOnly(left: 16.w, right: 16.w),
);
}
} }
class FamilyCardWidget extends StatefulWidget { class FamilyCardWidget extends StatefulWidget {

Loading…
Cancel
Save