mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-15 17:47:53 +00:00
Enhance device management UI with improved padding and SVG icon integration
This commit is contained in:
@ -51,8 +51,7 @@ class DeviceSettingsPanel extends StatelessWidget {
|
||||
Container(
|
||||
width: MediaQuery.of(context).size.width * 0.3,
|
||||
color: ColorsManager.grey25,
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 20, vertical: 24),
|
||||
padding: const EdgeInsets.all(10),
|
||||
child: ListView(
|
||||
children: [
|
||||
Row(
|
||||
@ -70,37 +69,43 @@ class DeviceSettingsPanel extends StatelessWidget {
|
||||
children: [
|
||||
Text(
|
||||
'Device Settings',
|
||||
style:
|
||||
context.theme.textTheme.titleLarge!.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: ColorsManager.primaryColor,
|
||||
),
|
||||
style: context.theme.textTheme.titleLarge!
|
||||
.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
color: ColorsManager.vividBlue
|
||||
.withOpacity(0.7),
|
||||
fontSize: 24),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
DefaultContainer(
|
||||
borderRadius: BorderRadius.circular(15),
|
||||
child: Row(
|
||||
children: [
|
||||
CircleAvatar(
|
||||
radius: 40,
|
||||
backgroundColor:
|
||||
const Color.fromARGB(177, 213, 213, 213),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(left: 15),
|
||||
child: CircleAvatar(
|
||||
backgroundColor: ColorsManager.whiteColors,
|
||||
radius: 36,
|
||||
child: SvgPicture.asset(
|
||||
iconPath,
|
||||
fit: BoxFit.cover,
|
||||
radius: 38,
|
||||
backgroundColor:
|
||||
ColorsManager.grayBorder.withOpacity(0.5),
|
||||
child: CircleAvatar(
|
||||
backgroundColor: ColorsManager.whiteColors,
|
||||
radius: 36,
|
||||
child: SvgPicture.asset(
|
||||
iconPath,
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
const SizedBox(width: 25),
|
||||
Expanded(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const SizedBox(height: 15),
|
||||
Text(
|
||||
'Device Name:',
|
||||
style: context.textTheme.bodyMedium!
|
||||
@ -108,50 +113,79 @@ class DeviceSettingsPanel extends StatelessWidget {
|
||||
color: ColorsManager.grayColor,
|
||||
),
|
||||
),
|
||||
TextFormField(
|
||||
maxLength: 30,
|
||||
style: const TextStyle(
|
||||
color: ColorsManager.blackColor,
|
||||
),
|
||||
textAlign: TextAlign.start,
|
||||
focusNode: _bloc.focusNode,
|
||||
controller: _bloc.nameController,
|
||||
enabled: _bloc.editName,
|
||||
onFieldSubmitted: (value) {
|
||||
_bloc.add(const ChangeNameEvent(
|
||||
value: false));
|
||||
},
|
||||
decoration: const InputDecoration(
|
||||
border: InputBorder.none,
|
||||
fillColor: Colors.white10,
|
||||
counterText: '',
|
||||
SizedBox(
|
||||
height: 35,
|
||||
child: Row(
|
||||
children: [
|
||||
SizedBox(
|
||||
height: 50,
|
||||
width: 190,
|
||||
child: TextFormField(
|
||||
scrollPadding: EdgeInsets.zero,
|
||||
maxLength: 30,
|
||||
style: const TextStyle(
|
||||
color: ColorsManager.blackColor,
|
||||
fontSize: 16,
|
||||
),
|
||||
textAlign: TextAlign.start,
|
||||
focusNode: _bloc.focusNode,
|
||||
controller: _bloc.nameController,
|
||||
enabled: _bloc.editName,
|
||||
onFieldSubmitted: (value) {
|
||||
_bloc.add(const ChangeNameEvent(
|
||||
value: false));
|
||||
},
|
||||
decoration: InputDecoration(
|
||||
isDense: true,
|
||||
contentPadding: EdgeInsets.zero,
|
||||
border: InputBorder.none,
|
||||
fillColor: Colors.white10,
|
||||
counterText: '',
|
||||
),
|
||||
),
|
||||
),
|
||||
Column(
|
||||
children: [
|
||||
SizedBox(
|
||||
width: 15,
|
||||
height: 25,
|
||||
child: Visibility(
|
||||
visible:
|
||||
_bloc.editName != true,
|
||||
replacement: const SizedBox(),
|
||||
child: InkWell(
|
||||
onTap: () {
|
||||
_bloc.add(
|
||||
const ChangeNameEvent(
|
||||
value: true));
|
||||
},
|
||||
child: SvgPicture.asset(
|
||||
Assets
|
||||
.editNameIconSettings,
|
||||
color: ColorsManager
|
||||
.lightGrayBorderColor,
|
||||
height: 15,
|
||||
width: 15,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Visibility(
|
||||
visible: _bloc.editName != true,
|
||||
replacement: const SizedBox(),
|
||||
child: GestureDetector(
|
||||
onTap: () {
|
||||
_bloc.add(
|
||||
const ChangeNameEvent(value: true));
|
||||
},
|
||||
child: SvgPicture.asset(
|
||||
Assets.editNameIconSettings,
|
||||
color: ColorsManager.grayColor,
|
||||
height: 20,
|
||||
width: 20,
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 32),
|
||||
Text('Device Management', style: sectionTitle),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(left: 10),
|
||||
child: Text('Device Management', style: sectionTitle),
|
||||
),
|
||||
DeviceManagementContent(
|
||||
device: device,
|
||||
subSpaces: subSpaces.cast<SubSpaceModel>(),
|
||||
|
Reference in New Issue
Block a user