fix(quick-add): wrap sheet action row to prevent overflow on small screens
The Cancel / Save-and-add-another / Save actions were a fixed Row that could not shrink, so on narrow phones and long locales (es/pt/de/fr) the buttons overflowed the right edge (the clipped 'Guardar'). Replace it with an OverflowBar that wraps onto stacked, end-aligned lines when they don't fit; move the added-count onto its own line above. Guard it in small_screen_overflow_test.dart across the long locales.
This commit is contained in:
parent
5b64fe14b3
commit
dc0d18562f
2 changed files with 48 additions and 10 deletions
|
|
@ -83,20 +83,27 @@ class QuickAddSheet extends StatelessWidget {
|
|||
),
|
||||
if (state.expanded) const _MoreSection(),
|
||||
const SizedBox(height: 8),
|
||||
Row(
|
||||
if (state.addedCount > 0)
|
||||
Padding(
|
||||
padding: const EdgeInsetsDirectional.only(bottom: 4),
|
||||
child: Text(
|
||||
t.quickAdd.addedCount(n: state.addedCount),
|
||||
style: Theme.of(context).textTheme.bodySmall,
|
||||
),
|
||||
),
|
||||
// OverflowBar wraps the actions onto stacked lines when the
|
||||
// labels don't fit the width (small phones, long locales),
|
||||
// instead of clipping with a RenderFlex overflow.
|
||||
OverflowBar(
|
||||
alignment: MainAxisAlignment.end,
|
||||
spacing: 8,
|
||||
overflowSpacing: 4,
|
||||
overflowAlignment: OverflowBarAlignment.end,
|
||||
children: [
|
||||
TextButton(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
child: Text(t.quickAdd.cancel),
|
||||
),
|
||||
if (state.addedCount > 0) ...[
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
t.quickAdd.addedCount(n: state.addedCount),
|
||||
style: Theme.of(context).textTheme.bodySmall,
|
||||
),
|
||||
],
|
||||
const Spacer(),
|
||||
TextButton(
|
||||
key: const Key('quickAdd.saveAndAddAnother'),
|
||||
onPressed: state.submitting
|
||||
|
|
@ -104,7 +111,6 @@ class QuickAddSheet extends StatelessWidget {
|
|||
: cubit.submitAndAddAnother,
|
||||
child: Text(t.quickAdd.saveAndAddAnother),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
FilledButton(
|
||||
key: const Key('quickAdd.save'),
|
||||
onPressed: state.submitting ? null : cubit.submit,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue