UX Fix: Field addition button removed from mobile

This commit is contained in:
Ashita Prasad
2025-05-10 00:43:50 +05:30
parent ce219ddd42
commit 17c3c8a793
4 changed files with 70 additions and 66 deletions

View File

@@ -182,7 +182,7 @@ class EditEnvironmentVariablesState
color: Theme.of(context).colorScheme.surface, color: Theme.of(context).colorScheme.surface,
borderRadius: kBorderRadius12, borderRadius: kBorderRadius12,
), ),
margin: kP10, margin: kPh10t10,
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch, crossAxisAlignment: CrossAxisAlignment.stretch,
children: [ children: [
@@ -203,27 +203,28 @@ class EditEnvironmentVariablesState
), ),
), ),
), ),
kVSpacer40, if (!kIsMobile) kVSpacer40,
], ],
), ),
), ),
Align( if (!kIsMobile)
alignment: Alignment.bottomCenter, Align(
child: Padding( alignment: Alignment.bottomCenter,
padding: kPb15, child: Padding(
child: ElevatedButton.icon( padding: kPb15,
onPressed: () { child: ElevatedButton.icon(
variableRows.add(kEnvironmentVariableEmptyModel); onPressed: () {
_onFieldChange(selectedId!); variableRows.add(kEnvironmentVariableEmptyModel);
}, _onFieldChange(selectedId!);
icon: const Icon(Icons.add), },
label: const Text( icon: const Icon(Icons.add),
kLabelAddVariable, label: const Text(
style: kTextStyleButton, kLabelAddVariable,
style: kTextStyleButton,
),
), ),
), ),
), ),
),
], ],
); );
} }

View File

@@ -185,7 +185,7 @@ class _FormDataBodyState extends ConsumerState<FormDataWidget> {
return Stack( return Stack(
children: [ children: [
Container( Container(
margin: kP10, margin: kPh10t10,
child: Column( child: Column(
children: [ children: [
Expanded( Expanded(
@@ -205,27 +205,28 @@ class _FormDataBodyState extends ConsumerState<FormDataWidget> {
), ),
), ),
), ),
kVSpacer40, if (!kIsMobile) kVSpacer40,
], ],
), ),
), ),
Align( if (!kIsMobile)
alignment: Alignment.bottomCenter, Align(
child: Padding( alignment: Alignment.bottomCenter,
padding: kPb15, child: Padding(
child: ElevatedButton.icon( padding: kPb15,
onPressed: () { child: ElevatedButton.icon(
formRows.add(kFormDataEmptyModel); onPressed: () {
_onFieldChange(); formRows.add(kFormDataEmptyModel);
}, _onFieldChange();
icon: const Icon(Icons.add), },
label: const Text( icon: const Icon(Icons.add),
kLabelAddFormField, label: const Text(
style: kTextStyleButton, kLabelAddFormField,
style: kTextStyleButton,
),
), ),
), ),
), ),
),
], ],
); );
} }

View File

@@ -178,7 +178,7 @@ class EditRequestHeadersState extends ConsumerState<EditRequestHeaders> {
return Stack( return Stack(
children: [ children: [
Container( Container(
margin: kP10, margin: kPh10t10,
child: Column( child: Column(
children: [ children: [
Expanded( Expanded(
@@ -198,28 +198,29 @@ class EditRequestHeadersState extends ConsumerState<EditRequestHeaders> {
), ),
), ),
), ),
kVSpacer40, if (!kIsMobile) kVSpacer40,
], ],
), ),
), ),
Align( if (!kIsMobile)
alignment: Alignment.bottomCenter, Align(
child: Padding( alignment: Alignment.bottomCenter,
padding: kPb15, child: Padding(
child: ElevatedButton.icon( padding: kPb15,
onPressed: () { child: ElevatedButton.icon(
headerRows.add(kNameValueEmptyModel); onPressed: () {
isRowEnabledList.add(false); headerRows.add(kNameValueEmptyModel);
_onFieldChange(); isRowEnabledList.add(false);
}, _onFieldChange();
icon: const Icon(Icons.add), },
label: const Text( icon: const Icon(Icons.add),
kLabelAddHeader, label: const Text(
style: kTextStyleButton, kLabelAddHeader,
style: kTextStyleButton,
),
), ),
), ),
), ),
),
], ],
); );
} }

View File

@@ -178,7 +178,7 @@ class EditRequestURLParamsState extends ConsumerState<EditRequestURLParams> {
return Stack( return Stack(
children: [ children: [
Container( Container(
margin: kP10, margin: kPh10t10,
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch, crossAxisAlignment: CrossAxisAlignment.stretch,
children: [ children: [
@@ -199,28 +199,29 @@ class EditRequestURLParamsState extends ConsumerState<EditRequestURLParams> {
), ),
), ),
), ),
kVSpacer40, if (!kIsMobile) kVSpacer40,
], ],
), ),
), ),
Align( if (!kIsMobile)
alignment: Alignment.bottomCenter, Align(
child: Padding( alignment: Alignment.bottomCenter,
padding: kPb15, child: Padding(
child: ElevatedButton.icon( padding: kPb15,
onPressed: () { child: ElevatedButton.icon(
paramRows.add(kNameValueEmptyModel); onPressed: () {
isRowEnabledList.add(false); paramRows.add(kNameValueEmptyModel);
_onFieldChange(); isRowEnabledList.add(false);
}, _onFieldChange();
icon: const Icon(Icons.add), },
label: const Text( icon: const Icon(Icons.add),
kLabelAddParam, label: const Text(
style: kTextStyleButton, kLabelAddParam,
style: kTextStyleButton,
),
), ),
), ),
), ),
),
], ],
); );
} }