ammar/syncrow-web
1
0
Fork 0
mirror of https://github.com/SyncrowIOT/web.git synced 2025-07-15 01:35:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: update dropdown styles and dimensions for better UI consistency

Browse Source
This commit is contained in:
mohammad
2025-06-18 12:14:17 +03:00
parent f5500dfe50
commit b9a3b9c719
3 changed files with 147 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
lib/pages/routines/create_new_routines/commu_dropdown.dart
View File

@ -117,7 +117,7 @@ class _DropdownContentState extends State<_DropdownContent> {
final selectedCommunity = _findCommunity(state, state.selectedSpaceId); final selectedCommunity = _findCommunity(state, state.selectedSpaceId);
return Container( return Container(
height: 46, height: 40,
decoration: BoxDecoration( decoration: BoxDecoration(
border: Border.all(color: Colors.grey.shade300), border: Border.all(color: Colors.grey.shade300),
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(12),
@ -149,7 +149,7 @@ class _DropdownContentState extends State<_DropdownContent> {
), ),
), ),
height: 45, height: 45,
width: 33, width: 44,
child: const Icon( child: const Icon(
Icons.keyboard_arrow_down, Icons.keyboard_arrow_down,
color: ColorsManager.textGray, color: ColorsManager.textGray,

266
lib/pages/routines/create_new_routines/create_new_routines.dart
View File

@ -44,144 +44,158 @@ class _CreateNewRoutinesDialogState extends State<CreateNewRoutinesDialog> {
_selectedSpace = null; _selectedSpace = null;
_selectedCommunity = _selectedId; _selectedCommunity = _selectedId;
} }
return AlertDialog( return Dialog(
backgroundColor: Colors.white, backgroundColor: Colors.white,
insetPadding: EdgeInsets.zero, insetPadding: const EdgeInsets.symmetric(
contentPadding: EdgeInsets.zero, horizontal: 20,
),
shape: RoundedRectangleBorder( shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12)), borderRadius: BorderRadius.circular(12)),
title: Text( child: Container(
'Create New Routines', width: 450,
textAlign: TextAlign.center, child: Stack(
style: Theme.of(context).textTheme.bodyMedium!.copyWith( children: [
color: ColorsManager.spaceColor, Column(
fontSize: 20, mainAxisSize: MainAxisSize.min,
fontWeight: FontWeight.w700, children: [
), const SizedBox(height: 20),
), Text(
content: Stack( 'Create New Routines',
children: [ textAlign: TextAlign.center,
Column( style:
mainAxisSize: MainAxisSize.min, Theme.of(context).textTheme.bodyMedium!.copyWith(
children: [ color: ColorsManager.spaceColor,
const Divider(), fontSize: 20,
const SizedBox(height: 20), fontWeight: FontWeight.w700,
Column( ),
children: [ ),
Padding( const Divider(),
padding: const SizedBox(height: 20),
const EdgeInsets.only(left: 13, right: 8), Column(
child: Column( children: [
children: [ Column(
SpaceTreeDropdown( children: [
selectedSpaceId: _selectedId, Padding(
padding: const EdgeInsets.only(
left: 13, right: 10),
child: Column(
children: [
SpaceTreeDropdown(
selectedSpaceId: _selectedId,
onChanged: (String? newValue) {
setState(
() => _selectedId = newValue!);
if (_selectedId != null) {
_bloc.add(
SpaceOnlyWithDevicesEvent(
_selectedId!));
}
},
),
],
)),
const SizedBox(height: 5),
const SizedBox(height: 8),
const SizedBox(height: 8),
Padding(
padding: const EdgeInsets.only(
left: 15, right: 20),
child: SpaceDropdown(
hintMessage: spaceHint,
spaces: spaces,
selectedValue: _selectedSpace,
onChanged: (String? newValue) { onChanged: (String? newValue) {
setState(() => _selectedId = newValue!); setState(() {
if (_selectedId != null) { _selectedSpace = newValue;
_bloc.add(SpaceOnlyWithDevicesEvent( });
_selectedId!));
}
}, },
), ),
], ),
)), ],
const SizedBox(height: 5),
const SizedBox(height: 8),
Padding(
padding: const EdgeInsets.only(left: 15, right: 15),
child: SpaceDropdown(
hintMessage: spaceHint,
spaces: spaces,
selectedValue: _selectedSpace,
onChanged: (String? newValue) {
setState(() {
_selectedSpace = newValue;
});
},
), ),
), ],
], ),
), const SizedBox(height: 20),
const SizedBox(height: 20), const Divider(),
const Divider(), Row(
Row( mainAxisAlignment: MainAxisAlignment.spaceAround,
mainAxisAlignment: MainAxisAlignment.spaceAround, children: [
children: [ Padding(
Padding( padding: const EdgeInsets.only(
padding: const EdgeInsets.only( left: 20,
left: 20, right: 20,
right: 20, ),
), child: TextButton(
child: TextButton( onPressed: () {
onPressed: () { Navigator.of(context).pop();
Navigator.of(context).pop(); },
}, child: Text(
child: Text( 'Cancel',
'Cancel', style: Theme.of(context)
style: Theme.of(context) .textTheme
.textTheme .bodyMedium!
.bodyMedium! .copyWith(
.copyWith( fontWeight: FontWeight.w400,
fontWeight: FontWeight.w400, fontSize: 14,
fontSize: 14, color: ColorsManager.blackColor,
color: ColorsManager.blackColor, ),
), ),
), ),
), ),
), Padding(
Padding( padding: const EdgeInsets.only(
padding: const EdgeInsets.only( left: 20,
left: 20, right: 20,
right: 20, ),
), child: TextButton(
child: TextButton( onPressed: _selectedCommunity != null &&
onPressed: _selectedCommunity != null && _selectedSpace != null
_selectedSpace != null ? () {
? () { Navigator.of(context).pop({
Navigator.of(context).pop({ 'community': _selectedCommunity,
'community': _selectedCommunity, 'space': _selectedSpace,
'space': _selectedSpace, });
}); }
} : null,
: null, child: Text(
child: Text( 'Next',
'Next', style: Theme.of(context)
style: Theme.of(context) .textTheme
.textTheme .bodyMedium!
.bodyMedium! .copyWith(
.copyWith( fontWeight: FontWeight.w400,
fontWeight: FontWeight.w400, fontSize: 14,
fontSize: 14, color: _selectedCommunity != null &&
color: _selectedCommunity != null && _selectedSpace != null
_selectedSpace != null ? ColorsManager.blueColor
? ColorsManager.blueColor : Colors.blue.shade100,
: Colors.blue.shade100, ),
), ),
), ),
), ),
), ],
], ),
), const SizedBox(height: 10),
const SizedBox(height: 10), ],
],
),
if (isLoadingCommunities)
const SizedBox(
height: 200,
child: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Center(
child: CircularProgressIndicator(
color: ColorsManager.primaryColor,
),
),
],
),
), ),
], if (isLoadingCommunities)
const SizedBox(
height: 200,
child: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Center(
child: CircularProgressIndicator(
color: ColorsManager.primaryColor,
),
),
],
),
),
],
),
), ),
); );
}, },

7
lib/pages/routines/create_new_routines/space_dropdown.dart
View File

@ -34,7 +34,9 @@ class SpaceDropdown extends StatelessWidget {
), ),
SizedBox( SizedBox(
child: Container( child: Container(
height: 40,
decoration: BoxDecoration( decoration: BoxDecoration(
color: ColorsManager.whiteColors,
borderRadius: BorderRadius.circular(10), borderRadius: BorderRadius.circular(10),
), ),
child: DropdownButton2<String>( child: DropdownButton2<String>(
@ -45,7 +47,7 @@ class SpaceDropdown extends StatelessWidget {
value: space.uuid, value: space.uuid,
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
Text( Text(
' ${space.name}', ' ${space.name}',
@ -88,7 +90,7 @@ class SpaceDropdown extends StatelessWidget {
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
Expanded( Expanded(
flex: 6, flex: 8,
child: Padding( child: Padding(
padding: const EdgeInsets.only(left: 10), padding: const EdgeInsets.only(left: 10),
child: Text( child: Text(
@ -129,6 +131,7 @@ class SpaceDropdown extends StatelessWidget {
dropdownStyleData: DropdownStyleData( dropdownStyleData: DropdownStyleData(
maxHeight: MediaQuery.of(context).size.height * 0.4, maxHeight: MediaQuery.of(context).size.height * 0.4,
decoration: BoxDecoration( decoration: BoxDecoration(
color: ColorsManager.whiteColors,
borderRadius: BorderRadius.circular(10), borderRadius: BorderRadius.circular(10),
), ),
), ),