diff --git a/assets/fonts/fonnts.com-AftikaBlack.ttf b/assets/fonts/fonnts.com-AftikaBlack.ttf new file mode 100644 index 00000000..538c917d Binary files /dev/null and b/assets/fonts/fonnts.com-AftikaBlack.ttf differ diff --git a/assets/fonts/fonnts.com-AftikaBold.ttf b/assets/fonts/fonnts.com-AftikaBold.ttf new file mode 100644 index 00000000..2ff73322 Binary files /dev/null and b/assets/fonts/fonnts.com-AftikaBold.ttf differ diff --git a/assets/fonts/fonnts.com-AftikaRegular.ttf b/assets/fonts/fonnts.com-AftikaRegular.ttf new file mode 100644 index 00000000..5ca4dc50 Binary files /dev/null and b/assets/fonts/fonnts.com-AftikaRegular.ttf differ diff --git a/lib/main.dart b/lib/main.dart index 464406cc..6a7fd37d 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -45,6 +45,7 @@ class MyApp extends StatelessWidget { ), theme: ThemeData( + fontFamily: 'Aftika', textTheme: const TextTheme( bodySmall: TextStyle( fontSize: 13, @@ -61,7 +62,43 @@ class MyApp extends StatelessWidget { ), ), colorScheme: ColorScheme.fromSeed( - seedColor: Colors.deepPurple), // Set up color scheme + seedColor: ColorsManager.blueColor, + primary: ColorsManager.blueColor, // Checked state color + onSurface: Colors.grey.shade400, // Unchecked state color + ), + switchTheme: SwitchThemeData( + thumbColor: MaterialStateProperty.resolveWith((states) { + if (states.contains(MaterialState.selected)) { + return ColorsManager + .blueColor; // Color of the switch knob when selected + } + return ColorsManager + .whiteColors; // Color of the switch knob when not selected + }), + trackColor: MaterialStateProperty.resolveWith((states) { + if (states.contains(MaterialState.selected)) { + return ColorsManager.blueColor + .withOpacity(0.5); // Track color when selected + } + return ColorsManager + .whiteColors; // Track color when not selected + }), + ), + checkboxTheme: CheckboxThemeData( + fillColor: MaterialStateProperty.resolveWith((states) { + if (states.contains(MaterialState.selected)) { + return ColorsManager.blueColor; // Checked state color + } + return Colors.grey.shade200; // Unchecked state color + }), + checkColor: MaterialStateProperty.all( + Colors.white), // The color of the checkmark + side: + BorderSide(color: ColorsManager.whiteColors), // Border color + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(4), // Border radius + ), + ), useMaterial3: true, // Enable Material 3 ), home: isLoggedIn == 'Success' ? const HomePage() : const LoginPage(), diff --git a/lib/pages/common/filter/filter_widget.dart b/lib/pages/common/filter/filter_widget.dart index 9d70aebd..d6cfcc7e 100644 --- a/lib/pages/common/filter/filter_widget.dart +++ b/lib/pages/common/filter/filter_widget.dart @@ -35,7 +35,9 @@ class FilterWidget extends StatelessWidget { decoration: BoxDecoration( color: ColorsManager.boxColor, border: Border.all( - color: isSelected ? Colors.blue : Colors.transparent, + color: isSelected + ? ColorsManager.blueColor.withOpacity(0.8) + : Colors.transparent, width: 2.0, ), borderRadius: _getBorderRadius(index), @@ -45,7 +47,9 @@ class FilterWidget extends StatelessWidget { child: Text( tabs[index], style: TextStyle( - color: isSelected ? Colors.blue : Colors.black, + color: isSelected + ? ColorsManager.blueColor.withOpacity(0.8) + : Colors.black, ), ), ), diff --git a/lib/pages/common/text_field/custom_web_textfield.dart b/lib/pages/common/text_field/custom_web_textfield.dart index cc29a423..6fe0dc49 100644 --- a/lib/pages/common/text_field/custom_web_textfield.dart +++ b/lib/pages/common/text_field/custom_web_textfield.dart @@ -10,6 +10,7 @@ class CustomWebTextField extends StatelessWidget { required this.controller, this.description, this.validator, + this.hintText, }); final bool isRequired; @@ -17,6 +18,7 @@ class CustomWebTextField extends StatelessWidget { final String? description; final TextEditingController? controller; final String? Function(String?)? validator; + final String? hintText; @override Widget build(BuildContext context) { @@ -81,7 +83,7 @@ class CustomWebTextField extends StatelessWidget { errorStyle: const TextStyle(height: 0), // Hide the error text space - hintText: 'Please enter'), + hintText: hintText ?? 'Please enter'), ), ), ], diff --git a/lib/pages/device_managment/all_devices/view/device_managment_page.dart b/lib/pages/device_managment/all_devices/view/device_managment_page.dart index 5d1abd02..c56a661f 100644 --- a/lib/pages/device_managment/all_devices/view/device_managment_page.dart +++ b/lib/pages/device_managment/all_devices/view/device_managment_page.dart @@ -3,8 +3,9 @@ import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:syncrow_web/pages/device_managment/all_devices/bloc/device_managment_bloc.dart'; import 'package:syncrow_web/pages/device_managment/all_devices/widgets/device_managment_body.dart'; import 'package:syncrow_web/web_layout/web_scaffold.dart'; +import 'package:syncrow_web/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart'; -class DeviceManagementPage extends StatelessWidget { +class DeviceManagementPage extends StatelessWidget with HelperResponsiveLayout { const DeviceManagementPage({super.key}); @override @@ -16,7 +17,7 @@ class DeviceManagementPage extends StatelessWidget { 'Device Management', style: Theme.of(context).textTheme.headlineLarge, ), - enableMenuSideba: true, + enableMenuSideba: isLargeScreenSize(context), scaffoldBody: BlocBuilder( builder: (context, state) { if (state is DeviceManagementLoading) { diff --git a/lib/pages/device_managment/all_devices/widgets/device_managment_body.dart b/lib/pages/device_managment/all_devices/widgets/device_managment_body.dart index a3d2215e..b836c8ea 100644 --- a/lib/pages/device_managment/all_devices/widgets/device_managment_body.dart +++ b/lib/pages/device_managment/all_devices/widgets/device_managment_body.dart @@ -41,7 +41,6 @@ class DeviceManagementBody extends StatelessWidget with HelperResponsiveLayout { lowBatteryCount = state.lowBatteryCount; } - // Create tab labels with counts final tabs = [ 'All (${devices.length})', 'Online ($onlineCount)', @@ -50,7 +49,9 @@ class DeviceManagementBody extends StatelessWidget with HelperResponsiveLayout { ]; return Container( - padding: const EdgeInsets.all(30), + padding: isLargeScreenSize(context) + ? const EdgeInsets.all(30) + : const EdgeInsets.all(15), height: context.screenHeight, width: context.screenWidth, child: Column( @@ -66,16 +67,12 @@ class DeviceManagementBody extends StatelessWidget with HelperResponsiveLayout { .add(SelectedFilterChanged(index)); }, ), - const SizedBox( - height: 20, - ), + const SizedBox(height: 20), const DeviceSearchFilters(), - const SizedBox( - height: 12, - ), + const SizedBox(height: 12), Container( height: 43, - width: 100, + width: isSmallScreenSize(context) ? double.infinity : 100, decoration: containerDecoration, child: Center( child: DefaultButton( @@ -95,9 +92,7 @@ class DeviceManagementBody extends StatelessWidget with HelperResponsiveLayout { ), ), ), - const SizedBox( - height: 12, - ), + const SizedBox(height: 12), Expanded( child: DynamicTable( cellDecoration: containerDecoration, diff --git a/lib/pages/device_managment/shared/device_control_dialog.dart b/lib/pages/device_managment/shared/device_control_dialog.dart index 4e745180..d115f57e 100644 --- a/lib/pages/device_managment/shared/device_control_dialog.dart +++ b/lib/pages/device_managment/shared/device_control_dialog.dart @@ -29,15 +29,41 @@ class DeviceControlDialog extends StatelessWidget with RouteControlsBasedCode { child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Center( - child: Text( - device.categoryName ?? 'Device Control', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 22, - color: ColorsManager.dialogBlueTitle, + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + const SizedBox(), + Text( + device.categoryName ?? 'Device Control', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 22, + color: ColorsManager.dialogBlueTitle, + ), ), - ), + Container( + width: 25, + decoration: BoxDecoration( + color: Colors.transparent, + shape: BoxShape.circle, + border: Border.all( + color: Colors.grey, + width: 1.0, + ), + ), + child: IconButton( + padding: EdgeInsets.all(1), + icon: const Icon( + Icons.close, + color: Colors.grey, + size: 18, + ), + onPressed: () { + Navigator.of(context).pop(); + }, + ), + ), + ], ), const SizedBox(height: 20), _buildDeviceInfoSection(), @@ -56,7 +82,7 @@ class DeviceControlDialog extends StatelessWidget with RouteControlsBasedCode { Widget _buildDeviceInfoSection() { return Padding( - padding: const EdgeInsets.symmetric(vertical: 50, horizontal: 50), + padding: const EdgeInsets.symmetric(vertical: 25, horizontal: 50), child: Table( children: [ TableRow( diff --git a/lib/pages/home/view/home_card.dart b/lib/pages/home/view/home_card.dart index 5c5e8dea..c1805a20 100644 --- a/lib/pages/home/view/home_card.dart +++ b/lib/pages/home/view/home_card.dart @@ -18,15 +18,17 @@ class HomeCard extends StatelessWidget { }); @override Widget build(BuildContext context) { - bool evenNumbers = index % 2 == 0; + // bool evenNumbers = index % 2 == 0; return InkWell( onTap: active ? onTap : null, child: Container( padding: const EdgeInsets.only(left: 10, right: 10, bottom: 10), decoration: BoxDecoration( - color: evenNumbers && active - ? ColorsManager.blueColor.withOpacity(0.8) - : (active + color: + // evenNumbers && active + // ? ColorsManager.blueColor.withOpacity(0.8) + // : + (active ? ColorsManager.blueColor : ColorsManager.blueColor.withOpacity(0.2)), borderRadius: BorderRadius.circular(30), diff --git a/lib/services/devices_mang_api.dart b/lib/services/devices_mang_api.dart index ba0027a4..c7881a1a 100644 --- a/lib/services/devices_mang_api.dart +++ b/lib/services/devices_mang_api.dart @@ -93,4 +93,7 @@ class DevicesManagementApi { ); return response; } + + //https://syncrow-dev.azurewebsites.net/device/report-logs/7e97c359-e822-4507-ac1f-e0ff96b0ca29?code=factory_reset + } diff --git a/lib/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart b/lib/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart index fbec8cda..d64a5144 100644 --- a/lib/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart +++ b/lib/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart @@ -7,10 +7,10 @@ mixin HelperResponsiveLayout { bool isMediumScreenSize(BuildContext context) { return MediaQuery.of(context).size.width >= 700 && - MediaQuery.of(context).size.width < 1300; + MediaQuery.of(context).size.width < 1400; } bool isLargeScreenSize(BuildContext context) { - return MediaQuery.of(context).size.width >= 1300; + return MediaQuery.of(context).size.width >= 1400; } } diff --git a/lib/web_layout/menu_sidebar.dart b/lib/web_layout/menu_sidebar.dart index c0d7b08f..8bd95d6c 100644 --- a/lib/web_layout/menu_sidebar.dart +++ b/lib/web_layout/menu_sidebar.dart @@ -1,59 +1,75 @@ import 'package:flutter/material.dart'; -import 'package:syncrow_web/utils/color_manager.dart'; -import 'package:syncrow_web/utils/style.dart'; +import 'package:syncrow_web/pages/common/text_field/custom_web_textfield.dart'; +import 'package:syncrow_web/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart'; -class MenuSidebar extends StatelessWidget { +class MenuSidebar extends StatelessWidget with HelperResponsiveLayout { const MenuSidebar({super.key}); @override Widget build(BuildContext context) { - return Expanded( - child: Container( - decoration: const BoxDecoration( - shape: BoxShape.rectangle, - boxShadow: [ - BoxShadow( - color: Colors.black26, - offset: Offset(4, 0), - blurRadius: 10, - ) - ], - color: ColorsManager.whiteColors, - ), - width: 200, - child: Padding( - padding: const EdgeInsets.all(15.0), - child: Column( - children: [ - Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - const Text( - 'Community', - style: TextStyle(fontSize: 20), - ), - CircleAvatar( - backgroundColor: Colors.grey.shade200, - child: IconButton( - color: ColorsManager.onSecondaryColor, - onPressed: () {}, - icon: const Icon(Icons.add)), - ) - ], - ), - const SizedBox( - height: 20, - ), - TextFormField( - controller: TextEditingController(), - decoration: textBoxDecoration(suffixIcon: true)), - Container( - height: 100, + return LayoutBuilder( + builder: (context, constraints) { + double sidebarWidth; + + if (isLargeScreenSize(context)) { + sidebarWidth = 250; + } else if (isMediumScreenSize(context)) { + sidebarWidth = 230; + } else { + sidebarWidth = 200; + } + + return Container( + width: sidebarWidth, + decoration: const BoxDecoration( + shape: BoxShape.rectangle, + boxShadow: [ + BoxShadow( + color: Colors.black26, + offset: Offset(4, 0), + blurRadius: 10, ) ], + color: Colors.white, ), - ), - ), + child: Padding( + padding: const EdgeInsets.all(15.0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + const Text( + 'Community', + style: TextStyle(fontSize: 20), + ), + CircleAvatar( + backgroundColor: Colors.grey.shade200, + child: IconButton( + color: Colors.grey, + onPressed: () {}, + icon: const Icon(Icons.add), + ), + ), + ], + ), + const SizedBox(height: 20), + SizedBox( + height: 100, + child: CustomWebTextField( + isRequired: false, + textFieldName: '', + controller: TextEditingController(), + hintText: 'Search...', + ), + ), + const Spacer(), + ], + ), + ), + ); + }, ); } } diff --git a/lib/web_layout/web_scaffold.dart b/lib/web_layout/web_scaffold.dart index 03610e52..72bcb777 100644 --- a/lib/web_layout/web_scaffold.dart +++ b/lib/web_layout/web_scaffold.dart @@ -1,10 +1,11 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:syncrow_web/utils/constants/assets.dart'; +import 'package:syncrow_web/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart'; import 'package:syncrow_web/web_layout/web_app_bar.dart'; import 'menu_sidebar.dart'; -class WebScaffold extends StatelessWidget { +class WebScaffold extends StatelessWidget with HelperResponsiveLayout { final bool enableMenuSideba; final Widget? appBarTitle; final List? appBarBody; @@ -17,6 +18,7 @@ class WebScaffold extends StatelessWidget { this.enableMenuSideba = true}); @override Widget build(BuildContext context) { + final isSmall = isSmallScreenSize(context); return Scaffold( body: Stack( children: [ @@ -43,7 +45,7 @@ class WebScaffold extends StatelessWidget { Expanded( child: Row( children: [ - if (enableMenuSideba) const MenuSidebar(), + if (enableMenuSideba && !isSmall) const MenuSidebar(), Expanded(flex: 5, child: scaffoldBody!) ], ), diff --git a/pubspec.yaml b/pubspec.yaml index 7e9d9608..776d9f0c 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -86,17 +86,13 @@ 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 - # - asset: fonts/Schyler-Italic.ttf - # style: italic - # - family: Trajan Pro - # fonts: - # - asset: fonts/TrajanPro.ttf - # - asset: fonts/TrajanPro_Bold.ttf - # weight: 700 - # + fonts: + - family: Aftika + fonts: + - asset: assets/fonts/fonnts.com-AftikaBlack.ttf + - asset: assets/fonts/fonnts.com-AftikaBold.ttf + - asset: assets/fonts/fonnts.com-AftikaRegular.ttf + + # For details regarding fonts from package dependencies, # see https://flutter.dev/custom-fonts/#from-packages